用javascript添加控件自定義屬性解析

2019-11-20 21:35:41

字體：大中小

來(lái)源：轉(zhuǎn)載

供稿：網(wǎng)友

前面說(shuō)過(guò)為HTML元素添加自定義的屬性，是通過(guò)手動(dòng)在HTML控件中加上，其實(shí)可以在javascript中動(dòng)態(tài)添加：如有一文本框：

復(fù)制代碼代碼如下:

如想增加idvalue屬性(值為”自定義值”)，可以在javascript中這樣寫:

復(fù)制代碼代碼如下:

var txt = document.getElementById("txtInput");
txt.setAttribute("idvalue","自定義值");

setAttribute中第一個(gè)參數(shù)是指明自定義屬性的名稱，第二個(gè)參數(shù)是初始值

代碼如下:

復(fù)制代碼代碼如下:

<html>
<head>
    <title>用javascript添加控件自定義屬性</title>
    <script language="javascript">
        function addCustomAttribute()
        {
            var txt = document.getElementById("txtInput");
            txt.setAttribute("idvalue","自定義值");
        }

        function showIdValue()
        {
                var txt = document.getElementById("txtInput");
                alert(txt.attributes["idvalue"].nodeValue);
        }
    </script>
</head>
<body onload="addCustomAttribute();">
    <input type="text" id="txtInput" name="txtInput" value="自定義文本">
    <input type="button" value="顯示idValue" onclick="showIdValue();">
</body>
</html>