詳解JS中的attribute屬性
Attribute是屬性的意思,文章僅對部分兼容IE和FF的Attribute相關(guān)的介紹。
attributes:獲取一個屬性作為對象getAttribute:獲取某一個屬性的值
object.getAttributes(attribute) getAttribute方法不屬于document對象,所以不能通過document對象獲取,只能通過元素節(jié)點的調(diào)用。例如document.getElementsByTagName("p")[0].
getAttributes("title")
setAttribute:建立一個屬性,并同時給屬性捆綁一個值
允許對屬性節(jié)點做出修改,例如
var shoop=document.getElementsById("psdf'); shoop.setAttribute("tittle","a lot of goods")
createAttribute:僅建立一個屬性
removeAttribute:刪除一個屬性
getAttributeNode:獲取一個節(jié)點作為對象
setAttributeNode:建立一個節(jié)點
removeAttributeNode:刪除一個節(jié)點
attributes可以獲取一個對象中的一個屬性,并且作為對象來調(diào)用,注意在這里要使用“[]”,IE在這里可以使用“()”,考慮到兼容性的問題,要使用“[]”。關(guān)于attributes屬性的使用方式上,IE和FF有巨大的分歧,在此不多介紹。attributes的使用方法:(IE和FF通用)
<body> <div id = "t"> <input type = "hidden" id = "sss" value = "aaa"> </div> </body> <script> var d = document.getElementById("sss").attributes["value"]; document.write(d.name);document.write(d.value);//顯示value aaa </script>
getAttribute,setAttribute,createAttribute,removeAttribute四兄弟的概念比較容易理解,使用方法也比較簡單,唯一需要注意這幾點:
1、createAttribute在使用的時候不需要基于對象的,document.createAttribute()就可以。
2、setAttribute,createAttribute在使用的時候如果是使用的時候不要使用name,type,value等單詞,IE都FF的反應(yīng)都奇怪的難以理解。
3、createAttribute在使用的時候如果只定義了名字,沒有d.nodeValue = "hello";語句定義值,F(xiàn)F會認為是一個空字符串,IE認為是undefined,注意到這點就可以了。
4\getAttribute的使用方法:
<body> <div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div> </body> <script> var d = document.getElementById("sss").getAttribute("value"); document.write(d); //顯示 aaa </script>
setAttribute的使用方法:(你會發(fā)現(xiàn)多了一個名為good的屬性hello)
<body> <div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div> </body> <script> var d = document.getElementById("sss").setAttribute("good","hello"); alert(document.getElementById("t").innerHTML) </script>
createAttribute的使用方法:(多了一個名為good的空屬性)
<body> <div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div> </body> <script> var d = document.createAttribute("good"); document.getElementById("sss").setAttributeNode(d); alert(document.getElementById("t").innerHTML) </script>
removeAttribute的使用方法:(少了一個)
<body> <div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div> </body> <script> var d = document.getElementById("sss").removeAttribute("value"); alert(document.getElementById("t").innerHTML) </script>
getAttributeNode,setAttributeNode,removeAttributeNode三個方法的特點是都直接操作一個node(節(jié)點),removeAttributeNode在一開始的時候總會用錯,但是充分理解了node的含義的時候,就能夠應(yīng)用自如了。
getAttributeNode的使用方法:
<body> <div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div> </body> <script> var d = document.createAttribute("good"); document.getElementById("sss").setAttributeNode(d); alert(document.getElementById("t").innerHTML); </script>
removeAttributeNode的使用方法:
<body> <div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div> </body> <script> var d = document.getElementById("sss").getAttributeNode("value") document.getElementById("sss").removeAttributeNode(d); alert(document.getElementById("t").innerHTML); </script>
以上所述是小編給大家介紹的JS中的attribute屬性,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
關(guān)于在IE下的一個安全BUG --可用于跟蹤用戶的系統(tǒng)鼠標(biāo)位置
本篇文章小編將為大家介紹,關(guān)于在IE下的一個安全BUG --可用于跟蹤用戶的系統(tǒng)鼠標(biāo)位置。需要的朋友可以參考一下2013-04-04JavaScript常用正則驗證函數(shù)實例小結(jié)【年齡,數(shù)字,Email,手機,URL,日期等】
這篇文章主要介紹了JavaScript常用正則驗證函數(shù),結(jié)合實例形式總結(jié)分析了javascript針對年齡、數(shù)字、Email、手機、URL、日期等格式常用正則驗證技巧,需要的朋友可以參考下2017-01-01JS匿名函數(shù)和匿名自執(zhí)行函數(shù)概念與用法分析
這篇文章主要介紹了JS匿名函數(shù)和匿名自執(zhí)行函數(shù)概念與用法,結(jié)合實例形式分析了匿名函數(shù)和匿名自執(zhí)行函數(shù)的概念、功能、應(yīng)用場景及相關(guān)使用技巧,需要的朋友可以參考下2018-03-03原生JS 實現(xiàn)的input輸入時表格過濾操作示例
這篇文章主要介紹了原生JS 實現(xiàn)的input輸入時表格過濾操作,結(jié)合實例形式分析了JavaScript基于頁面元素遍歷、運算、判斷實現(xiàn)的表格過濾相關(guān)操作技巧,需要的朋友可以參考下2019-08-08