javascript - getElementById简化代码问题
黄舟
黄舟 2017-04-10 16:38:42
0
3
431

你好!我想通过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>
黄舟
黄舟

人生最曼妙的风景,竟是内心的淡定与从容!

모든 응답(3)
刘奇

用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

최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!