Javascript 如何使用 jQuery 将 HTML 数据值作为字符串获取?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10015505/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 23:30:32  来源:igfitidea点击:

How can I get a HTML data value as a string with jQuery?

javascriptjquery

提问by Samantha J T Star

I have the following in my source HTML:

我的源 HTML 中有以下内容:

<li><a href="#" data-value="01">Test</a></li>

I want to get the value of the data attribute so I am using the following:

我想获取数据属性的值,所以我使用以下内容:

var abc = $(this).data('value');

This works okay BUT not if there is a leading zero. For example the above placed the value "1" into abc.

这可以正常工作,但如果有前导零则不行。例如,上面将值“1”放入 abc。

Is there a way that I can get it not to convert the "01" into "1" ?

有没有办法让它不将“01”转换为“1”?

回答by Juan Mendes

this.dataset.value;

// Or old school
this.getAttribute('data-value');

const a = document.querySelector("a");
console.log('Using getAttribute, old school: ', a.getAttribute('data-value'));
console.log('Using dataset, conforms to data attributes: ', a.dataset.value);
<ul>
  <li><a href="#" data-value="01">Test</a></li>
</ul>

Thanks to @MaksymMelnyk for the heads up on dataset

感谢@MaksymMelnyk 对数据集的提醒

回答by joeschmidt45

You can use the attr() operator of jQuery:

您可以使用 jQuery 的 attr() 运算符:

var abc = $(this).attr('data-value');

回答by Mike

From the jQuery data() documentation, it appears that you have to use .attr() to prevent the automatic type conversion:

jQuery data() 文档来看,您似乎必须使用 .attr() 来防止自动类型转换:

Every attempt is made to convert the string to a JavaScript value (this includes booleans, numbers, objects, arrays, and null) otherwise it is left as a string. To retrieve the value's attribute as a string without any attempt to convert it, use the attr() method. When the data attribute is an object (starts with '{') or array (starts with '[') then jQuery.parseJSON is used to parse the string; it must follow valid JSON syntax including quoted property names. The data- attributes are pulled in the first time the data property is accessed and then are no longer accessed or mutated (all data values are then stored internally in jQuery).

每次尝试将字符串转换为 JavaScript 值(这包括布尔值、数字、对象、数组和空值),否则将其保留为字符串。要将值的属性作为字符串检索而不尝试进行任何转换,请使用 attr() 方法。当数据属性是一个对象(以'{'开头)或数组(以'['开头)时,则使用jQuery.parseJSON来解析字符串;它必须遵循有效的 JSON 语法,包括带引号的属性名称。数据属性在第一次访问数据属性时被拉取,然后不再访问或改变(然后所有数据值都存储在 jQuery 内部)。

So, not to duplicate other answers, but rather to reinforce, the way to access the attribute without doing type conversion is:

因此,不要复制其他答案,而是要加强,无需进行类型转换即可访问属性的方法是:

var abc = $(this).attr('data-value');

回答by Bradley Mountford

$(this).attr('data-value');

This will return the string value with the leading 0.

这将返回带有前导 0 的字符串值。

回答by Josh Siok

have you tried?:

你有没有尝试过?:

$(this).attr('data-value');

or

或者

$(this).attr('data-value').toString();

回答by Shailesh Singh

Try :

尝试 :

this.data('value');

I think this is best way to get data attribute value.

我认为这是获取数据属性值的最佳方式。