đặt/nhận thuộc tính tùy chỉnh động

Question

Trình duyệt hiện đại chính hỗ trợ thiết lập/truy xuất thuộc tính tùy chỉnh động, ngoại trừ gia đình IE. Làm cách nào để tôi có thể đặt/nhận thuộc tính tùy chỉnh của mình trong tất cả các trình duyệt?

Đây là những gì tôi đã cố gắng cho đến nay:

HTML:

<input id="myInput" type="text" /> 

JS:

var myInput = document.getElementById('myInput'); 
myInput.setAttribute('custom-attr', 'custom-value'); 
alert(myInput.getAttribute('custom-attr')); 

hoặc

var myInput = document.getElementById('myInput'); 
var customAttr = document.createAttribute('custom-attr'); 
customAttr.value = 'custom-value'; 
myInput.setAttributeNode(customAttr); 
alert(myInput.getAttribute('custom-attr')); 

Trong cả hai trường hợp IE alert() lợi nhuận null.

Answer 1

Tôi đã thử nghiệm mã của bạn trên IE7/8

var myInput = document.getElementById('myInput'); 
myInput.setAttribute('custom-attr', 'custom-value'); 
alert(myInput.getAttribute('custom-attr')); 

và nó chạy tốt. Liệu trường hợp thử nghiệm đơn giản đó có thất bại cho bạn hay bạn thực sự đang làm điều gì đó khác biệt?

Bạn có thể sử dụng ký hiệu khung

var myInput = document.getElementById('myInput'); 
myInput['custom-attr'] = 'custom-value'; 
alert(myInput['custom-attr']); 

Nếu bạn không có - trong tên, bạn có thể sử dụng ký hiệu dấu chấm

var myInput = document.getElementById('myInput'); 
myInput.customAttr = 'custom-value'; 
alert(myInput.customAttr); 

Answer 2

Mã của bạn làm việc tốt trên IE6, IE7, IE8 , FF, Chrome, Opera.