2012-02-08 19 views
24

the dataset spec'a göre, element.dataset veri niteliklerini silmek anlamına geliyor? Düşünün:HTML5 veri kümesini kullanarak data- * öznitelikleri nasıl kaldırılır

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

Bunu yaparsanız:

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 ve Firefox'ta bu dönüşür:

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

Krom/Firefox uygulaması taklit setAttribute. Temel olarak ilk olarak .toString()'u uygular. Bu, null tedavisi dışında benim için mantıklı geliyor çünkü null'un özniteliği kaldırmasını beklerdim. Boole özellikleri hakkında

elem.removeAttribute('data-a'); 

Ve ne: Aksi veri kümesi API eşdeğer yapar nasıl

<p data-something> Hmm <p data-something=""> eşdeğerdir.

cevap

32

Veri silme öğesini silmek istemediniz mi? Örn .:

<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> 
+0

'elem.dataset.foo' eserler silin! – ryanve

+8

Not; v.dataset.foo sil; 'Safari'de çalışmaz. Bir çapraz tarayıcı çözümü; v.removeAttribute ('data-foo') ' –

+0

@maximdim, lütfen yanıtınızı Jeremy'den gelen yorumu eklemek için güncelleyebilir misiniz? Safari 10'da bile, bu hala bir sorun. Safari 11 bunu düzeltir (Safari Technical Preview ile kontrol edilir) – Dogoku

-5
<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. 
}); 
+1

http: //jsfiddle.net/shakeellal/EjV5u/ – Shakeel

İlgili konular