Как удалить атрибуты data- * с помощью набора данных HTML5

по данным спецификация набора данных, а как элемент.набор данных предназначен для удаления атрибутов данных? Подумайте:

<p id="example" data-a="string a" data-b="string b"></p>

если вы сделаете это:

var elem = document.querySelector('#example');
elem.dataset.a = null;
elem.dataset.b = undefined;
elem.dataset.c = false;
elem.dataset.d = 3;
elem.dataset.e = [1, 2, 3];
elem.dataset.f = {prop: 'value'};
elem.dataset.g = JSON.stringify({prop: 'value'});

DOM становится таким в Chrome и Firefox:

<p id="example" 
   data-a="null" 
   data-b="undefined" 
   data-c="false" 
   data-d="3" 
   data-e="1,2,3" 
   data.f="[object Object]" 
   data.g="{"prop":"value"}"
></p>

реализация Chrome / Firefox имитирует setAttribute. Это в основном применяется .toString() первый. Это имеет смысл для меня, за исключением лечения null потому что я ожидаю, что null удалил бы атрибут. В противном случае, как API набора данных делает эквивалент:

elem.removeAttribute('data-a');

а как насчет булевых атрибутов:

<p data-something> эквивалентно <p data-something=""> Мда.

28
html5-data javascript web-standards

2 ответов

не "удалить" удалить элемент dataset? Например:

<div id="a1" data-foo="bar">test</div>

<script>
var v = document.getElementById('a1');  
alert(v.dataset.foo);
delete v.dataset.foo;
alert(v.dataset.foo);
</script>
38
<div data-id="test">test</div>

$(document).ready(function(){
  $("div").removeAttr("data-id"); // removing the data attributes.
  console.log($("div").data("id")); // displays in the console.
});
-5