找到html標記對應的腳本屬性

2020-10-23 18:48:43

字體：大中小

來源：轉載

供稿：網友

javascript中可以創建以及引用一個元素，進而通過這個元素來取得或者設置屬性。然而一個元素的屬性卻不是和腳本中使用的屬性一一對應的。一個較偏僻的屬性，甚至google也很難找到其對應的腳本屬性。今天我就遇到了這個問題：我需要創建一個label標記來對應一個復選框，使得點擊這個label標記也能選中復選框。這是很常用的技術，比如如下的代碼：

<input type="checkBox" id="cbTop"/>
<label for="cbTop">置頂</label>
就能夠使得點擊“置頂”兩個字時也能選中復選框。
在正常情況下，這段代碼是直接寫到文件里的，很容易完成。當是我需要通過腳本創建，就遇到了問題，一般腳本屬性和標記中寫的屬性是一樣的，如鏈接標記a的目標屬性href就保持一致。但因為for是javascript中的保留字，不能作為屬性。我在網上找了很久也沒找到for對應的腳本屬性是什么，于是就醞釀出下面的辦法來找到一個標記屬性對應的腳本屬性，現在就以找label的for屬性對應的腳本屬性為例：
<label for="abcd" id="lblTest">test</label>
<script type="text/javascript">
var lbl=document.getElementById("lblTest");
for(var p in lbl){
var s=eval("lbl."+p);
if(s=="abcd")alert(p);
}
</script>
原理是這樣，我先寫一個html標記到文檔中，然后給要找的屬性賦一個唯一值，例子中是給label的for屬性復制"abcd"，然后通過javascript引用這個元素，并且遍歷它的所有屬性，如果一個屬性的值等于abcd，那么就可以認為這個屬性的名稱就是其對應的腳本屬性。就是通過這個方法，發現了label的for屬性對應的腳本屬性應該是：htmlFor。嘿嘿，還是比較怪異的哦。類似的方法還可以應用在找css的腳本屬性上，大家不妨試試。

上一篇：小三角的做法與使用

下一篇：實用的標簽效果