标签: custom-data-attribute

我默认设置了自定义数据属性:

data-equipment="0"

如果我用jquery使用.data()更改它

$(this).data("equipment", 10)

然后使用getAttribute()

this.getAttribute("data-equipment")

我得到旧值(0)而不是新值(10).但如果我使用

$(this).data("equipment") 我得到了新的价值(10).

这应该是这样工作还是我错过了什么？

谢谢!

我遇到了knockout.js中数据*属性的问题,即.用它们写出来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

谁能看到这里出了什么问题？

干杯!

我想将一些自定义数据与一些HTML节点相关联.我打算使用新的HTML5风格'data-*'属性.例如:<tr class="foo" data-typeid="7">…,然后我将通过读取值来选择此HTML节点并显示/隐藏它等$(node).attr("data-typeid").

但是,此网页也需要与旧版浏览器一起使用.我没有使用data-*属性作为特殊属性,但我想知道旧浏览器是否会忽略,擦除或使该属性不可访问,因为它不是有效的HTML4.

如何使用jquery获取数据属性.data()？在哪种情况下,html5 data-*属性转换为小写和camelcase？使用自定义属性存储数据时要遵循的主要规则是什么？

<input type="button" class="myButton" value="click me" data-productId="abc"/>
<input type="button" class="myButton" value="click me" data-product-id="abc"/>
<input type="button" class="myButton" value="click me" data-PRODUCT-ID="abc"/>
<input type="button" class="myButton" value="click me" data-ProDUctId="abc"/>

我正在读取数据属性字段中的一些值.我已经看到了两种简单的方法来读取数据,如下所示:

var webappData = document.getElementById('web-app-data'),
    rating = webappData.dataset.rating;

要么

var effectData = $('.effects-list li'),
    creative = effectData.filter('[data-creative]').data("creative");

我的问题是哪些具有更好的性能还是它们真的不同？

我有一个页面,我正在访问许多数据属性,我想使用具有最佳性能的方法.

任何有关理解两者之间差异的指导将不胜感激.虽然我正在考虑性能,如果有其他原因使用一个而不是另一个,我也想知道这一点.

在PHP中,我json_encode()用来回显HTML5数据属性中的数组.由于JSON需要 - 并json_encode()生成 - 由双引号封装的值.我因此用单引号包装我的数据属性,如:

<article data-tags='["html5","jquery","php","test's"]'>

正如您所看到的,最后一个标记(test)包含单引号,并且json_encode()在没有选项的情况下使用会导致解析问题.

于是我就用json_encode()与JSON_HEX_APOS参数,并解析是好的,因为我的单引号进行编码,但我不知道:有一个缺点做这样的吗？

我可以有

%a{href: '#', data_toggle_description_length: 'toggle_me_ajax'}

它给了我强调的不是破折号,即

<a href="#" data_toggle_description_length="toggle_me_ajax"></a>

但是我想拥有HTML5 data-属性,即

<a href="#" data-toggle-description-length="toggle_me_ajax"></a>

但是当我尝试用破折号替换下划线时,即

%a{href: '#', data-toggle-description-length: 'toggle_me_ajax'}

我得到语法错误:

/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: syntax error, unexpected tLABEL
...data-toggle-description-length: 'toggle_me_ajax')}>\n    tog...
...                               ^
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: syntax error, unexpected ')', expecting '}'
...ption-length: 'toggle_me_ajax')}>\n    toggleMeAjax\n  </a>\...
...                               ^
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: unknown regexp options - pa
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: syntax error, unexpected $undefined
... toggleMeAjax\n  </a>\n</span>\n", -1, false);::Haml::Util.h...
...                               ^
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: unterminated string meets end of file
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: syntax error, unexpected $end, expecting '}'

我在使用数据属性方面遇到了一些麻烦,因为某些原因我无法正常工作所以我一定做错了:

组:

$('#element').data('data1', '1'); //Actually in my case the data is been added manually 

这有什么区别吗？

得到:

$('#element').data('data1');

选择:

$('#element[data1 = 1]')

这对我来说都不起作用,我是在制作它还是它是什么？

我必须使用Jquery Datatables进行一些自定义排序.我不想为每个自定义排序编写自定义排序函数.

我想定义一个要排序的值,并且如果定义了值,则Datatables会忽略原始列值.

例如:

<td data-sort="111123">E 1.111,23</td>

我希望Jquery Datatables以数字方式对此列进行排序111123.

<td data-sort="19801220">20-12-1980</td>

我希望Jquery Datatables以数字方式对此列进行排序19801220.

<td>a string</td>

我希望Jquery Datatables按原始值对此列进行排序a string.

http://www.datatables.net/plug-ins/sorting有"隐藏标题数字排序",它接近我想要的,但要求我指定这个自定义排序适用于哪一列的每个数据表.我有太多不同大小的数据表,可以在合理的时间内完成.我只想让Datatables总是对这个隐藏的值/ data-*属性进行排序(如果它存在).无需在特定列上进行自定义排序定义.

相关:jQuery DataTables:如何按自定义参数值而不是单元格的内容进行排序？但遗憾的是,没有回答如何简单地通过自定义参数进行排序,而是指向自定义排序脚本.

最近一直困扰我的是使用HTML5数据属性,什么时候适合使用它们.

通常,在对我的服务器执行大量AJAX调用的页面上,我要求ID代表正在查看的页面.我现在一直将它存储在<input>页面上的隐藏元素中,然后在我的jQuery doc ready调用的顶部访问并存储在JS变量中.

我一直在考虑将它移动到data-idbody元素的属性,然后我将使用jQuery访问它$('body').data('id');.

使用HTML5数据是否有任何优势？反之亦然？性能？安全？"最佳实践"？

我的理解是所有浏览器都可以访问数据属性,因此处理IE不是一个问题.