首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >按数据属性选择元素

按数据属性选择元素
EN

Stack Overflow用户
提问于 2017-12-06 06:03:32
回答 1查看 2.6K关注 0票数 2

希望用JSON更新一些HTML,并且不想要一个完整的模板引擎,比如工具栏等等。我想我只需要分配一个数据值并进行迭代,但是我收到了错误。参考https://api.jqueryui.com/data-selector/,然而,可能不适用于jQuery 3?如何选择具有数据属性的元素?

旁注。虽然不是我的问题,但我的最终目标是用一个包含与下面列出的数据属性值相等的名称/值的对象更新HTML。如果有更好的方法,请评论。谢谢

代码语言:javascript
运行
AI代码解释
复制
<table class='table' id="default-template">
    <tr><td>Server IP</td><td data-name="server"></td></tr>
    <tr><td>Server Port</td><td data-name="port"></td></tr>
    <tr><td>Reconnect Timeout (seconds)</td><td data-name="reconnectTimeout"></td></tr>
    <tr><td>Response Timeout (seconds)</td><td data-name="responseTimeout"></td></tr>
    <tr><td>Verbose Log</td><td data-name="verboseLog"></td></tr>
    <tr><td>Device Static IP</td><td data-name="ip_address"></td></tr>
    <tr><td>Router IP</td><td data-name="router_ip"></td></tr>
    <tr><td>Domain Name Server IP</td><td data-name="domain_name_server_ip"></td></tr>
</table>
代码语言:javascript
运行
AI代码解释
复制
$('#default-template').find('td:data(name)').each(function(i){
    console.log(i,this);
});

display.js:20 {ip_address:"10.120.11.30/24",router_ip:"10.120.11.1",domain_name_server_ip:"10.120.11.1",服务器:"12.34.56.78",端口:"1337",…} JQuery3.2.1.js:1580未明错误:语法错误,未识别表达式:不支持的伪:数据 在Function.Sizzle.error (jquery-3.2.1.js:1580) 在伪(jquery-3.2.1.js:1927) 在matcherFromTokens (jquery-3.2.1.js:2476) 在Sizzle.compile (jquery-3.2.1.js:2630) 在Sizzle.select (jquery-3.2.1.js:2716) 在Function.Sizzle as find 在jQuery.fn.init.find (jQuery3.2.1.js:2922) 在Object.success (display.js:21) 着火(jQuery3.2.1.js:3317) 在Object.fireWith as resolveWith Sizzle.error @jQuery3.2.1.js:1580 伪@ jquery-3.2.1.js:1927 matcherFromTokens @ jquery-3.2.1.js:2476 Sizzle.compile @ jquery-3.2.1.js:2630 Sizzle.select @ jquery-3.2.1.js:2716 Sizzle @ jquery-3.2.1.js:884 @ jquery-3.2.1.js:2922 成功@ display.js:21 fire @ jquery-3.2.1.js:3317 fireWith @jQuery3.2.1.js:3447 done @ jquery-3.2.1.js:9272 (匿名)@ jquery-3.2.1.js:9514 XMLHttpRequest.send (异步) 发送@ jquery-3.2.1.js:9566 ajax @ jquery-3.2.1.js:9173 (匿名)@ display.js:16 调度@ jquery-3.2.1.js:5206 elemData.handle @jQuery3.2.1.js:5014

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-12-06 06:05:11

只需将其改为:

代码语言:javascript
运行
AI代码解释
复制
$('#default-template td[data-name]').each(function(i){
    console.log(i,this);
});

这就是我们所需要的。

票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/47676180

复制
相关文章
集合:按元素的中文属性排序
1. 要排序的元素类: public static class NameCount implements Comparable<NameCount> { Collator collator = Collator.getInstance(java.util.Locale.CHINA); @ApiModelProperty(value = "名") private String name; @ApiModelProperty(value =
微风-- 轻许--
2020/04/14
1.4K0
XML元素和属性
默认情况下,next()方法不检查是否存在与标记为必需的属性相对应的元素和属性。要使读取器检查此类元素和属性是否存在,请在调用Next()之前将读取器的CheckRequired属性设置为1。出于兼容性原因,此属性的默认值为0。
用户7741497
2022/07/04
1.4K0
JavaScript 操作元素属性
1、html的属性和js里面属性写法一样 2、“class” 属性写成 “className” 3、“style” 属性里面的属性,有横杠的改成驼峰式,比如:“font-size”,改成”style.fontSize”
Devops海洋的渔夫
2019/05/31
1.1K0
按权重随机选择(leetcode 528)
给你一个下标从 0 开始的正整数数组 w ,其中 w[i] 代表第 i 个下标的权重。
恋喵大鲤鱼
2022/10/24
8980
count_if按条件统计元素个数
区别:为什么count那里要加const,这边不要 因为count那里是进行元素比较操作,需要重载==运算符,要让底层识别,所以要加const 而这边是作为条件,将元素放入仿函数中看是否符合条件 总结:最好都加上const
大忽悠爱学习
2021/03/02
1K0
count_if按条件统计元素个数
第91天:CSS3 属性选择器、伪类选择器和伪元素选择器
除了以前学过的:link、:active、:visited、:hover,CSS3又新增了其它的伪类选择器。
半指温柔乐
2018/09/11
1.6K0
属性选择器与类选择器_input属性选择器
1E[att$=”val”]{ sRules } 选择具有att属性且属性值为以val结尾的字符串的E元素。
全栈程序员站长
2022/09/20
1.8K0
Java 对象数组按某个属性排序
新建一个Student对象 public class Student { private String name; private double score; public Student(String name,double score) { super(); this.name = name; this.score = score; } public String getName() { re
赵哥窟
2021/12/16
3K0
WPF 元素裁剪 Clip 属性
在 WPF 的 UIElement 提供了 Clip 属性,这个属性默认是空,但是如果设置了这个属性就会对元素进行裁剪
林德熙
2019/03/13
1.7K0
Zepto这样操作元素属性
已经知道了如何使用attr方法,在开始分析attr实现源码之前,我们先了解一下这几个函数。
IMWeb前端团队
2019/12/03
7990
HTML元素属性及意义
HTML属性可以给元素添加附加信息,设置的时候以 (属性名="属性值")成对出现。
呆呆
2021/11/25
1.1K0
jQuery选择器、元素属性操作--jQuery基础知识点(1)
版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
奋飛
2019/08/15
6580
html+css学习笔记004-元素选择器0背景属性
Author:Mr.柳上原 付出不亚于任何的努力 愿我们所有的努力,都不会被生活辜负 不忘初心,方得始终 零基础 刚开始的时候很难 不仅仅是因为第一次接触代码 还有生活的压力、年龄的压力 我问一个只有高中学历,当兵退伍回来,年纪比我大很多的朋友,你是怎么学成前端的 “没有其他方法,坚持下来就好了。” 现在在阿里巴巴上班的朋友如是说道。 原来成功如此简单,坚持就好了 <!DOCTYPE html> <!-- 文档类型:标准html文档 --> <html lang='en'> <!-- html根标签 翻译
Mr. 柳上原
2018/09/05
5740
Zepto这样操作元素属性
本文作者:IMWeb 谦龙 原文出处:IMWeb社区 未经同意,禁止转载 前言 使用Zepto的时候,我们经常会要去操作一些DOM的属性,或元素本身的固有属性或自定义属性等。比如常见的有a
IMWeb前端团队
2018/01/08
2.4K0
Zepto这样操作元素属性
jquery根据属性选择
有信仰的人不会孤独。——阿列克谢耶维奇 分享一个jquery选择器的小技巧 我们可以通过自定义属性键值选中一个元素 例如如下元素: <div ruben="vampire">阿超</div> 然后我们通过ruben=vampire选中这个div 就可以如下写法: let vampire = $('div[ruben="vampire"]') 我们可以简单测试一下输出里面的内容 <div ruben="vampire">阿超</div> <script type="text/javascript">
阿超
2022/08/17
1.9K0
jquery根据属性选择
HTML元素属性及意义
HTML属性可以给元素添加附加信息,设置的时候以 (属性名="属性值")成对出现。
呆呆
2021/09/28
7600
WPF 元素裁剪 Clip 属性
在 WPF 的 UIElement 提供了 Clip 属性,这个属性默认是空,但是如果设置了这个属性就会对元素进行裁剪
林德熙
2022/08/04
1K0
JavaScript——操作标签元素属性
1. 属性的操作 首先获取的页面标签元素,然后就可以对页面标签元素的属性进行操作,属性的操作包括: 属性的读取 属性的设置 属性名在js中的写法 html的属性和js里面属性大多数写法一样,但是“class” 属性写成 “className” “style” 属性里面的属性,有横杠的改成驼峰式,比如:“font-size”,改成”style.fontSize” <style> .sty01{ font-size:20px; color:red; } .
落雨
2022/04/14
30.3K0
其他html元素和属性
disabled:标识元素不可用,就是用户不可互动,比如 button 的 disabled,就是按钮不能点击
鹤川
2023/03/21
7460
jquery表单属性筛选元素
$(":button") 选择所有按钮元素类型为按钮的元素。 等于$('input[type="button"]') $(":checkbox") 选择所有类型为复选框的元素。 等于$('input[type="checkbox"]') $(":checked") 选择所有勾选的元素。 $( "input:checked" ) $(":disabled") 选择说有被禁用的元素。 $("input:disabled").val("不能输入") $(":enabled"
用户1197315
2018/01/19
1.5K0

相似问题

使用jquery按数据属性选择元素

53

使用jQuery按数据属性选择元素

110

更改后按数据属性选择元素

11

按属性选择元素

170

在CSS中按数据*属性选择元素

11
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
社区富文本编辑器全新改版!诚邀体验~
全新交互,全新视觉,新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能,全面提升创作效率和体验
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文