get dữ liệu thuộc tính trong mã JavaScript

Question

Tôi có html tiếp theo:

<span data-typeId="123" data-type="topic" data-points="-1" data-important="true" id="the-span"></span> 

Có thể để có được những thuộc tính mà bắt đầu với data-, và sử dụng nó trong Javascript mã như mã dưới đây? Hiện tại tôi nhận được kết quả là null.

document.getElementById("the-span").addEventListener("click", function(){ 
    var json = JSON.stringify({ 
     id: parseInt(this.typeId), 
     subject: this.datatype, 
     points: parseInt(this.points), 
     user: "Luïs" 
    }); 
}); 

Answer 1

Bạn cần truy cập vào dataset property:

document.getElementById("the-span").addEventListener("click", function() { 
    var json = JSON.stringify({ 
    id: parseInt(this.dataset.typeid), 
    subject: this.dataset.type, 
    points: parseInt(this.dataset.points), 
    user: "Luïs" 
    }); 
}); 

Kết quả:

// json would equal: 
{ "id": 123, "subject": "topic", "points": -1, "user": "Luïs" } 

Answer 2

Bạn có thể truy cập vào nó như

element.dataset.points 

vv Vì vậy, trong trường hợp này: this.dataset.points

Answer 3

Vì dataset bất động sản không được hỗ trợ bởi trình duyệt Internet Explorer cho đến khi phiên bản 11, bạn có thể muốn sử dụng getAttribute() thay vì:

document.getElementById("the-span").addEventListener("click", function(){ 
    console.log(this.getAttribute('data-type')); 
}); 

Dataset documentation

getAttribute documentation

Answer 4

Hãy thử điều này thay vì mã của bạn :

var type=$("#the-span").attr("data-type"); 
alert(type);