如何使用 jQuery 通过 id 从元素获取 html

2024-01-29

我有一个简单的清单:

<ul id="tabs_nav">
    <li id="t_00">data</li>
    <li id="t_01">data</li>
    <li id="t_02">data</li>
    <li id="t_03">data</li>
</ul>

现在:如何获取第一个元素的 html,具体取决于 ID 是什么。我想补充一点,所有 ID 都会随着按钮的点击而动态变化。这是我的代码:

btn.on('click',function(){
    var ladder_nav_tabs = $('#tabs_nav'),
        first_ladder_element_inset_id = ladder_nav_tabs.find('li').first().attr('id'),
        first_ladder_element_inset_html = ladder_nav_tabs.find(first_ladder_element_inset_id).html();
    console.log(first_ladder_element_inset_html);
});

谢谢帮助。


看来你缺少 id 选择器#.

您正在尝试从选择器获取 html:

ladder_nav_tabs.find(first_ladder_element_inset_id).html();

这不起作用,因为 id 选择器需要#。像这样:

ladder_nav_tabs.find("#" + first_ladder_element_inset_id).html();

请尝试以下操作来修复您的代码:

btn.on('click',function(){
    var ladder_nav_tabs = $('#tabs_nav'),
        first_ladder_element_inset_id = ladder_nav_tabs.find('li').first().attr('id'),
        first_ladder_element_inset_html = ladder_nav_tabs.find("#" + first_ladder_element_inset_id).html();
    console.log(first_ladder_element_inset_html);
});

DEMO http://jsfiddle.net/sHAR8/- 更新为有效的 id 选择器语法


或者你可以使用 jQuery 来缩短你的代码eq http://api.jquery.com/eq/,类似于:

btn.on('click',function(){
    var theHtml = $('#tabs_nav li').eq(0).html();
    console.log(theHTML);
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 jQuery 通过 id 从元素获取 html 的相关文章

  • 此页面上的脚本导致 ie 运行缓慢

    问题就在标题中 IE 行为异常 并说有一个脚本运行缓慢 FF 和 Chrome 没有这个问题 我怎样才能找到问题所在 那个页面有很多JS 手动检查不是一个好主意 EDIT 这是我正在处理的一个项目的页面 但我需要一个工具来查找问题 End
  • 访问 nuxt 配置文件中的存储

    我想添加通过 Nuxt 静态生成的动态路由 我定义了一个客户端 服务器端存储asyncData方法 我想将这个存储值 一个数组 映射到我的nuxt config js文件使其成为 动态 静态 路线图nuxt generate命令 但如何访问
  • React JS 服务器端问题 - 找不到窗口

    你好 我正在尝试在我的reactJS项目中使用react rte 我有服务器端渲染 每次我想使用这个包时 我都会得到 return msie 6 9 b test window navigator userAgent toLowerCase
  • 如何禁用 body 元素的滚动?

    如何禁用正文滚动 body css overflow hidden 仅隐藏滚动条 但不会禁用滚动 我想禁用正文的滚动 但我想保持其他分区的滚动完好无损 试试这个 CSS 不需要 jQuery 评论后更新 尝试指定高度body too
  • karma/jasmine 控制台更详细的测试结果

    我使用 Karma 和 Jasmine 进行 javascript 单元测试 假设我有一个失败的测试 如下所示 expect objectA toEqual expectedObjectA 当失败时 我看到控制台上转储了两个对象 并显示一条
  • 如何在 React Native 上显示 SVG 文件?

    我想显示 svg 文件 我有一堆 svg 图像 但我找不到显示的方式 我尝试使用Image and Use的组成部分反应本机 svg https github com magicismight react native svg但他们不这样做
  • C# 和 Javascript SHA256 哈希的代码示例

    我有一个在服务器端运行的 C 算法 它对 Base64 编码的字符串进行哈希处理 byte salt Convert FromBase64String serverSalt Step 1 SHA256Managed sha256 new S
  • 将 Firebase FCM 添加到 ReactJS 应用程序

    我正在尝试向我的 ReactJS 应用程序中的用户发送推送通知 我已添加 firebase 请求用户通知权限 这正在发挥作用 但现在我想注册设备令牌 但这给了我错误 消息传递 我们无法注册默认的 Service Worker 无法注册 Se
  • 全局传递 xhr onload 函数的值

    在我正在创建的应用程序中 我有以下 XMLHttpRequest 并且我正在尝试传递结果data在 的里面xhr onload 到在同一父函数中创建的数组中 var url http api soundcloud com resolve j
  • 如何在 Web 服务器上设置 gzip 压缩?

    我有一个嵌入式网络服务器 总共有 2 兆空间 通常 您使用 gzip 文件对客户端有利 但这会节省我们在服务器上的空间 我读到你可以只 gzip js 文件并将其保存在服务器上 我在 IIS 上测试过 但没有任何运气 为了使这项工作成功 我
  • 如果一个对象结构与另一个对象结构不匹配/不匹配,如何引发异常

    我将读取格式正确的用户输入对象 也就是说 输入对象现在可以具有接口中未定义的任何键或子结构 如果用户提供了无效的对象 我如何抛出异常 预定义接口 export interface InputStructureInterface tableN
  • 呃!尝试将包发布到 npm 时出现 403

    我正在尝试将包发布到 npm 您可以在此处查看存储库 https github com biowaffeln mdx state https github com biowaffeln mdx state 我登录到 npmnpm login
  • Javascript 浮点乘以 100 仍然有错误

    我有一个货币字段的文本输入 我在字段中输入 33 91 并在尝试使用 乘以 100 技术时得到以下结果 var curWth parseInt trans withdraw index val 100 3390 var curWth par
  • 语法错误:意外的标记“?”在 repl.it 上用 JavaScript 制作不和谐机器人时 [重复]

    这个问题在这里已经有答案了 我收到错误 const token this client token this client accessToken SyntaxError Unexpected token Discord 机器人代码 con
  • 如何在画布上所有其他内容后面绘制图像? [复制]

    这个问题在这里已经有答案了 我有一块画布 我想用drawImage在画布上当前内容后面绘制图像 由于画布上已经有内容 我正在使用字面上的画布来创建包含图像的画布 因此我无法真正先绘制图像 所以我无法使用drawImage在我呈现其余内容之前
  • CSS 精灵按钮

    这些精灵按钮让我抓狂 我几乎可以让他们工作 但不完全是 我正在玩这个非常简单的精灵图像 我有一个 jsfiddle 项目 gt gt 这里 如果你想看的话 但如果你只想看一下 代码就在下面 http jsfiddle net jp2code
  • 如何重复 ajax 请求,直到满足 RxJS Observable 的条件?

    我正在尝试重复请求 直到响应包含使用 RxJS 的数据 此时我想调用成功 或失败 处理程序 但我在使用 RxJS 时遇到了麻烦 这是我目前的方法 redux observable action observable mergeMap gt
  • Bootstrap 导航栏与 Google 位置重叠自动完成下拉菜单

    我有一个导航栏 我试图在其中添加一个地点搜索框 除了谷歌位置提示框的一小部分被导航栏重叠 如下图所示 之外 一切几乎都有效 我尝试过改变z index输入框的值改为10或2000或90000但似乎没有效果 我还缺少其他需要做的事情吗 这是
  • ng-include 和 ng-view 不同时加载

    下面是我的应用程序的结构 很简单 页眉和页脚是非常小的文件 而主页上的 ng view 要大得多 当我进入该页面时 我注意到了这一点 首先加载两个 ng include 然后 ng view 出现 页脚被推到底部 页脚闪烁大约 0 1 秒
  • 确定 Javascript 中的日期相等性

    我需要找出用户在 Javascript 中选择的两个日期是否相同 日期以字符串 xx xx xxxx 形式传递给该函数 这就是我需要的全部粒度 这是我的代码 var valid true var d1 new Date datein val

随机推荐

  • 使用列名从 ResultSet 获取小写列

    我使用的是 Oracle 12cr1 数据库 看来我无法从中获得价值ResultSet如果列名是小写 则使用列名 创建表create table Tab col number col varchar2 10 所以第二列是小写的 如果我打电话
  • FILE_FLAG_DELETE_ON_CLOSE 和内存映射文件

    并不是说它特别有用 但我很好奇为什么下面的方法有效 仅仅是因为即使文件被删除后该页面仍然在内存中吗 在什么情况下 如果页面被换出 数据会丢失 include
  • 链接 gcc 6、gcc 7 和 gcc 8 对象安全吗?

    链接 C 17 C 14 和 C 11 对象是否安全 https stackoverflow com q 46746878 2069064询问有关链接使用不同语言标准编译的对象的问题 Jonathan Wakely 对这个问题的出色回答解释
  • 从批处理文件中发现Java安装在哪里?

    我想从批处理脚本设置 JAVA HOME 变量 此代码片段将在当前路径中搜索 java exe 并打印出找到它的位置 for f j in java exe do echo dp PATH j 在我的系统上这给了我 C WINDOWS sy
  • 错误 ASP 0177:8007007e COM DLL CreateObject 失败

    我们一直在尝试在新服务器上安装 COM DLL 界面是经典的 ASP 地图连接器 DLL 似乎是问题所在 但据我所知 这是问题所在 我们无法获取 IIS 提供的页面 只给出 500 错误 跟踪 ASP 时 127 ASP SCRIPT TR
  • 给 Jekyll 类别添加标题

    我想将我的帖子的打印类别名称转换为标题大小写 我找不到合适的液体过滤器 我尝试使用破折号和驼峰过滤器 但没有骰子 或者 我想打印 YAML frontmatter 中写入的类别名称 例如 对于包含以下内容的帖子 category Here
  • Android 中的计时器不会停止

    我在android中做了一个应用程序并使用了这样的计时器 try CountDownTimer start1 new CountDownTimer 20000 1000 public void onTick long millisUntil
  • CAGradientLayer 不起作用[重复]

    这个问题在这里已经有答案了 我创建了一个新项目 在LinkedIn中QuartzCore framework并进口
  • 如何阻止浏览器对 GET 上的表单值进行 url 编码

    我有一个表格method get 在表单中 我需要传递 CSS 文件的 URL 但它正在将其编码为http 3A 2F 2Fwww etc 有没有办法停止 URL 编码 因为它会破坏文件 Thanks 背景 It s a bit more
  • 为什么背景颜色需要 1px 粗体? [复制]

    这个问题在这里已经有答案了 这是我的粗话 table orders background color ff0000 然而 当我实际运行这个时 我收到一条错误消息Invalid CSS after ff0000 expected expres
  • OpenCV - 找不到指定扩展名的编码器

    这是我用来将 IplImage 转换为 jpg 的代码 IplImage fIplImageHeader fIplImageHeader cvCreateImageHeader cvSize 160 120 8 3 fIplImageHea
  • ios - 应用程序关闭时本地通知不更新徽章号码

    我注意到 当 iOS 设备中收到本地通知时 通知会显示在通知中心 但应用程序关闭时应用程序徽章编号不会更新 我需要点击通知中心的通知才能将本地推送消息传输到应用程序 这是正常行为吗 可以通过远程推送通知来解决这个问题吗 您可以利用appli
  • Iframe.readyState 在 Chrome 中不起作用

    我动态创建一个 Iframe 并将下载页面设置为 url二进制文件 xls doc 下载文件时我会显示动画 当没有的时候 我就把它隐藏起来 问题是 Chrome 不知道文件何时完全下载 即 iframe 何时完全加载 我使用 iframe
  • 处理 JavaScript 中的特定错误(考虑异常)

    您将如何实现不同类型的错误 以便能够捕获特定的错误并让其他错误出现 实现此目的的一种方法是修改Error object Error prototype sender function throwSpecificError var e new
  • XCode/MonoMac 中的自定义控件等效项

    我是一名 NET 开发人员 正在尝试 Windows 应用程序的 OSX 端口 我正在使用 MonoDevelop 和 MonoMac 带有 XCode Interface Builder 来创建我的 UI 来自 Windows 我试图理解
  • 更改多个音轨视频的音频

    我有带有多个音轨的视频 我想播放视频并希望更改视频中的音轨 有什么方法可以在 html 中制作这个 或者有 html 支持的播放器吗 您应该使用 Hermes 建议的答案 var video document getElementById
  • 如何访问 .gdbinit 和 gdb 本身内部的环境变量?

    我希望在使用 gdb 进行调试时设置源代码的路径 我选择使用 gdbinit 文件来完成此操作 基本上 它包含一个命令 directory path to src 但是 我希望能够将该命令指定为 directory SOURCESROOT
  • java 2d 中的选取

    我正在使用 java2d 绘制一个简单的图形 目前我已经通过为每个对象 形状调用 contains MousePoint 来实现拾取 这可以工作 但可以线性缩放 java2d中有没有更有效的拾取方法 是的 尽管完整的答案对于这个空间来说太长
  • 托管 (.net) 应用程序中内存泄漏的最常见(且经常被忽视)的原因是什么?

    请任何人推荐一个快速清单 最佳实践指南 以帮助我们避免可能导致 net 应用程序内存泄漏的简单 但微妙 错误 当我处于项目的测试阶段时 我发现开始寻找内存泄漏的原因非常困难且相当痛苦 如果有 经验法则 可以完全指导托管应用程序中的内存泄漏
  • 如何使用 jQuery 通过 id 从元素获取 html

    我有一个简单的清单 ul li data li li data li li data li li data li ul 现在 如何获取第一个元素的 html 具体取决于 ID 是什么 我想补充一点 所有 ID 都会随着按钮的点击而动态变化