通過JavaScript

Question

添加HTML標籤內的額外屬性，假設我們有像

<div id="slide1" class="slide"></div> 
<div id="slide2" class="slide"></div> 
<div id="slide3" class="slide"></div> 

我試圖到div標籤一樣key='post'從陣列[post, get, search]添加額外的屬性，每個標籤的一組HTML標籤分別。 是否有可能使用JavaScript？

我也想KNW如果什麼輸入是哈希，而不是像數組

{"post" : ["0","1"], "get": ["0","2"], "search": ["2","1"]} 

Answer 1

是的，它是可能的，只是使用element.setAttribute（）這樣的：

var element = document.getElementById("slide1"); 
element.setAttribute('key','post'); 

Answer 2

套裝屬性您正在查找的是：

https://developer.mozilla.org/en-US/docs/DOM/element.setAttribute

var d = document.getElementById("slide1"); 
d.setAttribute("key", "post"); 

Answer 3

var attrs = ['post', 'get', 'search']; 
for (var i = 0, n = attrs.length; i < n; ++i) { 
    var el = document.getElementById('slide' + (i + 1)); 
    el.setAttribute('key', attrs[i]); 
} 

或者，如果正在使用jQuery（並假設只有這三個要素具有slide類）：

var attrs = ['post', 'get', 'search']; 
$('.slide').attr('key', function(i) { 
    return attrs[i]; 
}); 

問題的更新的部分（使用對象「散列」，而不是一個數組）不會工作，因爲一個對象沒有定義的順序。你可以獲得標籤，但他們不會以確定性的順序出現：。

var myobj = {"post" : ["0","1"], "get": ["0","2"], "search": ["2","1"]}; 
var attrs = Object.keys(myobj); 
... // as above 

查看MDN網站documentation for Object.keys，包括舊版瀏覽器的墊片。