如何获得数据-id属性？

Question

如何获得数据-id属性？我正在使用jQuery流沙插件。我需要获取单击项的数据id，并将其传递给webservice。如何获得数据-id属性？我用的是.on()方法重新绑定排序项的单击事件。$("#list li").on('click', function() {  //  ret = DetailsView.GetProject($(this).attr("#data-id"), OnComplete, OnTimeOut, OnError);  alert($(this).attr("#data-id"));});<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script><ul id="list" class="grid">  <li data-id="id-40" class="win">    <a id="ctl00_cphBody_ListView1_ctrl0_SelectButton" class="project" href="#">      <img src="themes/clean/images/win.jpg" class="project-image" alt="get data-id" />    </a>  </li></ul>

Answer 1

如果我们想使用现有的本机属性检索或更新这些属性JavaScript，然后我们可以使用getAttribute和setAttribute方法这样做，如下所示：

通过JavaScript

<div id='strawberry-plant' data-fruit='12'></div><script>// 'Getting' data-attributes using getAttributevar plant = document.getElementById
('strawberry-plant');var fruitCount = plant.getAttribute('data-fruit'); // fruitCount = '12'
// 'Setting' data-attributes using setAttributeplant.setAttribute('data-fruit','7'); // Pesky birds</script>

通过jQuery

// Fetching datavar fruitCount = $(this).data('fruit');OR 
// If you updated the value, you will need to use below code to fetch new value // otherwise above gives the old value which is intially set.
// And also above does not work in ***Firefox***, so use below code to fetch valuevar fruitCount = $(this).attr('data-fruit');
// Assigning data$(this).attr('data-fruit','7');

阅读本文档

Answer 2

重要的注意事项。请记住，如果您调整data- 属性动态地通过JavaScript，它将不会反映在data()jQuery函数你必须通过data()功能也一样。

<a data-id="123">link</a>

联署材料：

$(this).data("id") // returns 123$(this).attr("data-id", "321"); //change the attribute$(this).data("id") 
// STILL returns 123!!!$(this).data("id", "321")$(this).data("id") // NOW we have 321