Question

我的源HTML中有以下内容：

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

我想获取data属性的值，因此我使用以下内容：

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

这样可以正常但是如果有一个前导零。例如以上将值“1”放入abc。

有没有办法可以让它不将“01”转换为“1”？

Answer 1

this.dataset.value;

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

＆＃13;

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);

＆＃13;

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

＆＃13;

感谢@MaksymMelnyk前往dataset

Answer 2

您可以使用jQuery的attr（）运算符：

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

Answer 3

从jQuery data() documentation开始，您似乎必须使用.attr（）来阻止自动类型转换：

每次尝试都将字符串转换为JavaScript值（包括布尔值，数字，对象，数组和null），否则将其保留为字符串。要将值的属性检索为字符串而不尝试转换它，请使用attr（）方法。当data属性是一个对象（以'{'开头）或数组（以'['开头）时，则使用jQuery.parseJSON来解析字符串;它必须遵循有效的JSON语法，包括引用的属性名称。数据属性在第一次访问数据属性时被拉出，然后不再被访问或变异（所有数据值都在内部存储在jQuery中）。

因此，不要复制其他答案，而是强调，在不进行类型转换的情况下访问属性的方法是：

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

Answer 4

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

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

Answer 5

你尝试过吗？：

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

或

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

Answer 6

尝试：

this.data('value');

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

Answer 7

<article id="electric-cars" data-columns="3"data-index-number="12314" data-parent="cars">

</article>


const article = document.querySelector('#electric-cars');
 
article.dataset.columns // "3"
article.dataset.indexNumber // "12314"
article.dataset.parent // "cars"

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

7 个答案: