你好!我想通过getElementById找到带有id的所有元素,但元素过多时要写很多类似代码,我想了如下方法去找到每个带有id的元素。这种方法在chrome和IE上是可以的,但是到了Firefox上就不行了,那么请问,有什么简洁方法找到所有带有id的元素吗?(最好是简单的方法,DOM的我还没学,毕竟我是小白 (。・_・。)ノ)
//我的意思是想问:如何简化这种代码???
var n1= document.getElementById('n1');
var n2= document.getElementById('n2');
var n3= document.getElementById('n3');
var n4= document.getElementById('n4);
var n5= document.getElementById('n5');
var n6= document.getElementById('n6');
var ...= document.getElementById('...');
第一种方法:
<script>
var arrid=['bt','bl','bm','bb','bp','bol','bot','dbt','dbl','dbm','dbb','dbp','dbol','dbot','dst','dsl','dsm','dsb','dsp','dsol','dsot','B','S','bod','pbig','psma','btnbod','btnpBig','btnpSma','p11','texttop','textleft','textmar','textbor','textpad','textwidth','textheight','btnsubm','btnBodyab','btnBodyre','btnBodyno','btnBigab','btnBigre','btnBigno','btnSmaab','btnSmare','btnSmano','dis']
for (var v=0;v<arrid.length;v++)
{
sid(arrid[v]);
function sid(aa){ var aa = document.getElementById([aa]);}
}
</script>
第二种方法:
<script>
</script>
<script>
var arrid=['bt','bl','bm','bb','bp','bol','bot','dbt','dbl','dbm','dbb','dbp','dbol','dbot','dst','dsl','dsm','dsb','dsp','dsol','dsot','B','S','bod','pbig','psma','btnbod','btnpBig','btnpSma','p11','texttop','textleft','textmar','textbor','textpad','textwidth','textheight','btnsubm','btnBodyab','btnBodyre','btnBodyno','btnBigab','btnBigre','btnBigno','btnSmaab','btnSmare','btnSmano','dis']
var scri= document.getElementsByTagName('script')[0];
for (var v=0;v<arrid.length;v++)
{
sid(arrid[v]);
function sid(aa){scri.innerHTML+='var'+' '+aa+'= document.getElementById('+aa+');';}
}
</script>
用jQuery或者其他。
用jqurey,
$("[id]")
,这段代码的意思是选择所有带id
属性的元素节点。或者
用
document.querySelectorAll()
,这里有querySelectorAll的中文介绍。通过CSS选择器来实现:document.querySelectorAll('[id]')
参考:
http://stackoverflow.com/questions/11496645/how-to-get-css-to-select-id-that-begins-with-a-string-not-in-javascript
http://www.w3schools.com/jsref/met_document_queryselector.asp
http://stackoverflow.com/questions/3685047/select-all-element-with-a-not-null-id-in-jquery