技術分享 如何識別控制DHTML和JS中的頁面元素
你知道如何控制每一個頁面元素嗎,這里向大家簡單介紹一下DHTML和JS中頁面元素的識別控制,相信你一定會感興趣的。
DHTML和JS中頁面元素的識別控制
在動態網頁制作過程中,經常需要對相應的頁面元素進行相應的操作,這就需要我們能夠準確的控制每一個頁面元素。
一般網頁中的元素,都可以用多種方式來標識,例如可以通過上下文關系識別,或者觸發元素識別,等等。
網頁中最常用的元素標識方法有三種,它們是ID、CLASS和NAME,表示給單個元素標識,而CLASS用于給同類型的命名,而NAME給一般元素命名。
例如,可以在如下命名:
- <imgid="pic"src="..">
- ?。?/span>spanname="kuai"></span>
- ?。?/span>divclass="layer"></div>
當我們在JAVASCRIPT中調用這些元素時,就可以用document.all.pic、document.all.kuai來識別了。
一般情況下,一個名稱只用于一個元素的命名,但也不完全如此,有時候同一類型的元素要同樣的效果,不僅可以用CLASS來標識,還可以用ID或者NAME標識,引用時就可以對全部同樣的ID和NAME一起操作了。
但這樣就帶來一個問題,如何識別其中的某一個元素。
這種情況下的識別和單一命名識別的區別在于加上數字索引,如前面的pic也可以用document.all.pic[1]來識別,其他的就按照它們在頁面中出現的順序來用相應的數字識別。
很多情況下,是由相應的事件觸發了控制函數,我們就可能會用到引發事件的元素,這時可以用eventElement來識別,它代表的就是觸發事件的哪個元素。
同時,還可以用parentElement和childrenElement來識別觸發事件元素的上級元素和下級元素。
當用eventElement獲得一個觸發元素后,我們還可以獲得它的標識名稱。例如,用eventElement.tagName獲得的是元素的HTML標識名,用eventElement.id獲得的是元素的名字,用eventElement.name獲得的是元素的name名稱。
【編輯推薦】
- 解析JS中定義Function的兩種實用方法
- JS中Array數組的三大屬性用法揭秘
- prototype.js的Ajax對IE8兼容問題解決方案
- 詳解JS中event使用方法
- JavaScript調試工具解決IE6等多版本共存問題