Tag: 自定义数据属性

JQuery。数据()不工作?

最近我正在编码,我遇到了一个奇怪的问题。 我试图分配一个数据属性到我创build的一个新元素(通过jQuery),只发现它不会实际分配的属性。 有关示例,请参阅下面的链接,代码如下所示: http://jsfiddle.net/y95p100c/1/ 任何想法为什么发生这种情况? 我从来没有偶然发现过 var div = $("<div />") $(div).data("foo", "bar") console.log($(div)[0].outerHTML) // prints <div></div>

使用knockoutjs attr写入数据*属性

我遇到了knockout.js中data *属性的问题。 用attr写出来。 我可以做到这一点没有问题: <input data-bind='text: Title, attr: {name: "Events[" + viewModel.events.indexOf($data) + "].Title"}'/> 但如果我想使用data-id ,常规的方式不起作用,所以我把一个单引号围绕属性: <input data-bind='text: Title, attr: {'data-id': "Events[" + viewModel.events.indexOf($data) + "].Title"}'/> 这给了我 Error: Unable to parse bindings. Message: SyntaxError: missing } in compound statement; Bindings value: attr: { http://127.0.0.1:21254/Scripts/knockout/knockout-2.2.0.js 有人可以看到这里出了什么问题吗? 干杯!

使用旧版浏览器的HTML5“data- *”属性有什么问题吗?

我想将一些自定义数据与一些HTML节点相关联。 我打算使用新的HTML5风格的“data- *”属性。 例如: <tr class="foo" data-typeid="7">…然后我打算select这个HTML节点,通过读取$(node).attr("data-typeid") 。 然而,这个网页也需要使用旧版浏览器。 我没有使用data- *属性作为一个特殊的属性,但我想知道是否旧的浏览器将忽略,擦除,或无法访问此属性,因为它不是有效的HTML4。

使用HTML data-attribute来设置CSS background-image url

我打算为一个朋友build立一个自定义的照片库,我确切地知道我将如何生产HTML,但是我遇到了一个CSS的小问题。 (如果可能的话,我宁愿不要使页面样式依赖于jQuery) 我的问题问候: HTML中的Data-Attribute 在CSS中的Background-image 我为我的html缩略图使用这种格式: <div class="thumb" data-image-src="images/img.jpg"></div> 我假设CSS应该看起来像这样: .thumb { width:150px; height:150px; background-position:center center; overflow:hidden; border:1px solid black; background-image: attr(data-image-src);/*This is the question piece*/ } 我的目标是从我的HTML文件中的div.thumb中获取data-image-src ,并将其用于CSS文件中的每个div.thumb (s) background-image源文件。 这是一个Codepen笔为了得到我正在寻找的一个dynamic的例子: http://codepen.io/thestevekelzer/pen/rEDJv

获取数据属性的jQuery与JavaScript

我有一个默认设置的自定义数据属性: data-equipment="0" 如果我改变它与jQuery使用.data() $(this).data("equipment", 10) 然后使用getAttribute() this.getAttribute("data-equipment") 我得到旧的价值(0),而不是新的(10)。 但是,如果我使用 $(this).data("equipment")我得到新值(10)。 这应该是这样的工作,还是我错过了什么? 谢谢!

jQuery的:select不是空的数据属性?

我试图select具有不为空的data-go-to属性的所有元素。 我已经尝试过$('[data-go-to!=""]')但奇怪的是,如果我这样做,似乎是select页面上的每一个元素。

将数据属性添加到DOM

$('div').data('info', 1); alert($('div').data('info')); //this works $('div[data-info="1"]').text('222'); //but this don't work 我在jQuery中创build元素。 之后,我想添加属性“数据”。 他就像和被添加,但在DOM中,这是不明显的,我不能得到该项目,使用 $('div[data-example="example"]').html() 的jsfiddle

自定义数据属性上的jQueryselect器使用HTML5

我想知道哪些select器可用于HTML5随附的这些数据属性。 以这段HTML为例: <ul data-group="Companies"> <li data-company="Microsoft"></li> <li data-company="Google"></li> <li data-company ="Facebook"></li> </ul> 有没有select器得到: 在"Companies"下面的data-company="Microsoft"所有元素 所有元素与data-company!="Microsoft"下面的"Companies" 在其他情况下,是否可以使用其他select器,如“包含,小于,大于等…”。

为什么我应该用“data-”来预定我的自定义属性?

所以我使用的任何自定义数据属性应该以“data-”开头: <li class="user" data-name="John Resig" data-city="Boston" data-lang="js" data-food="Bacon"> <b>John says:</b> <span>Hello, how are you?</span> </li> 如果我忽略这个,会不会发生什么事? 即: <li class="user" name="John Resig" city="Boston" lang="js" food="Bacon"> <b>John says:</b> <span>Hello, how are you?</span> </li> 我想一个坏的是,我的自定义属性可能会与具有特殊含义(例如, name )的HTML属性发生冲突,但除此之外,只写“example_text”而不是“data-example_text”会出现问题吗? (它不会validation,但谁在乎?)

获取数据属性

在我的HTML我有一个span元素: <span class="field" data-fullText="This is a span element">This is a</span> 我想获得data-fullText属性。 我尝试了这两种方式,但他们没有工作(都返回undefined ): $('.field').hover(function () { console.log('using prop(): ' + $(this).prop('data-fullText')); console.log('using data(): ' + $(this).data('fullText')); }); 然后我search,发现这些问题: 如何获得data-id属性? 和jquery不能获得数据属性值 。 两者的答案是"Use .attr('data-sth') or .data('sth')" 。 我知道.attr()已被弃用(在我使用的jQuery-1.11.0),但是,我试过了。 它工作! 有人能解释为什么吗?