我經(jīng)常會寫些類似這樣的代碼,
<input type="button" value="">
<input type="button" value="">
<input type="checkbox" name=""value="" />
<input type="button" value="">
<input type="text" value="" >
<input type="radio" value="" >
<input type="button" value="" >
為了把button都取出來,不得不
var btn=document.getElementsByTagName("input");
然后再對btn這個對象集合進(jìn)行近一步處理.每當(dāng)這時都不勝其煩吶!
后來想了另一個辦法.就是在input上給name屬性:
<input type="button" name="button" value="">
<input type="button"name="button" value="">
<input type="checkbox" name=""value="" />
<input type="button" name="button" value="">
<input type="text" value="" >
<input type="radio" value="" >
<input type="button" name="button" value="" >
var btn=document.getElementsByName("button");
這樣就可以一步到位的取出button集合.
看起來問題是解決了.但是呢,身為強(qiáng)迫癥患者,看著html里新加的那一片name="button"就各種難受.難道就不能像css屬性選擇器那樣,直接input[type="button"]一下搞定嗎?
直到我遇見了如此迷人的你 document.querySelectorAll()
document.querySelectorAll()
HTML5中引入的新方法钥组，
返回文檔中匹配的CSS選擇器的所有元素節(jié)點列表
自此以后,再也不用做二次處理,或是添加看著就臃腫的name;
干凈,直接,一次搞定.
var btn=document.querySelectorAll("input[type='button']");
贊美你!!!
