描述：在編寫選擇器的時(shí)候遇到的一根問題，我需要實(shí)現(xiàn)Jquery的選擇器功能，第一個(gè)根據(jù)ID獲取Element非常簡單，第二個(gè)根據(jù)類（class）去獲取Element集合，這個(gè)相對復(fù)雜，而根據(jù)name和根據(jù)class的返回值是一樣的，下面是詳細(xì)說明：

首先我寫了一個(gè)方法，這個(gè)方法是獲得當(dāng)前HTML的所有元素（標(biāo)簽），然后遍歷尋找需要的元素。代碼如下：

function getElementsByClassName (className) { //獲得所有的元素 all是元素集合var all = document.all ? document.all : document.getElementsByTagName('*');var elements = new Array();for (var e = 0; e < all.length; e++) { //根據(jù)class的名稱與元素集合內(nèi)的class比較if (className==all[e].className) { //寫入新的數(shù)組elements[elements.length] = all[e];}} //返回篩選后的數(shù)組return elements;} 點(diǎn)擊查看代碼

在上訴代碼中，可以根據(jù)修改屬性去完成別的篩選，比如name,value等等。返回的是一個(gè)elements數(shù)組，大家不要忽略了。對于返回結(jié)果，下面還是演示個(gè)小的Demo，跳過了取值階段，直接調(diào)用上面的function.

function test(){ var a=getElementsByClassName("abc"); for(int i=0;i<a.length;i++) { a[i].style.color="blue"; } } 點(diǎn)擊查看代碼

即所有的class為abc的元素，他們的文字顏色都變?yōu)榱怂{(lán)色。在寫的過程中看到了style，順帶提一下style的用法，上面的直接style.color是一種寫法，大家要是為了方便的話可以直接使用style.cssText屬性。使用方式：

style.cssText="border:1px solid #000;margin-ledt:10px;background-color:#66CCFF";

類似在元素標(biāo)簽內(nèi)直接寫style樣式的方式。

?

轉(zhuǎn)載于:https://www.cnblogs.com/nozer1993/p/4371140.html

總結(jié)

以上是生活随笔為你收集整理的(Lesson2)根据类名称和属性获得元素-JavaScript面向对象的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。