Bagaimana untuk mengubah suai atribut nod elemen dalam javascript

Kaedah pengubahsuaian: 1. Gunakan kaedah setAttribute() untuk mengubah suai nilai atribut nod, sintaks "node.setAttribute(nama atribut, nilai)" 2. Gunakan kaedah removeAttribute() untuk memadam atribut yang ditentukan, sintaks "node .removeAttribute(nama atribut)".

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi JavaScript 1.8.5, komputer Dell G3.

javascript mengubah suai atribut nod elemen

kaedah setAttribute() menetapkan nilai atribut

Gunakan kaedah setAttribute() elemen boleh menetapkan nilai atribut elemen. Penggunaannya adalah seperti berikut:

setAttribute(name, value)

Nama dan nilai parameter masing-masing mewakili nama atribut dan nilai atribut. Nama harta dan nilai harta mesti dihantar sebagai rentetan. Jika atribut yang ditentukan wujud dalam elemen, nilainya akan dimuat semula jika ia tidak wujud, kaedah setAttribute() akan mencipta atribut untuk elemen dan menetapkan nilai.

<div id="red">红盒子</div>
<div id="blue">蓝盒子</div>
<script>
    var red = document.getElementById("red");  //获取红盒子的引用
    var blue= document.getElementById("blue");  //获取蓝盒子的引用
    red.setAttribute("title", "这是红盒子");  //为红盒子对象设置title属性和值
    blue.setAttribute("title", "这是蓝盒子");  //为蓝盒子对象设置title属性和值
</script>

kaedah removeAttribute() mengalih keluar atribut

Gunakan kaedah removeAttribute() elemen untuk mengalih keluar atribut yang ditentukan. Penggunaannya adalah seperti berikut:

removeAttribute(name)

Nama parameter mewakili nama atribut elemen.

Contoh:

<script>
    window.onload = function () {  //绑定页面加载完毕时的事件处理函数
        var table = document.getElementByTagName("table")[0];  //获取表格外框的引用
        var del = document.getElementById("del");
        var reset = document.getElementById("reset");
        del.onclick = function () {
            table.removeAttribute("border");
        }
        reset.onclick = function () {
            table.setAttribute("border", "2");
        }
</script>
<table width="100%" border="2">
    <tr>
        <td>数据表格</td>
    <tr>
</table>
<button id="del">删除</button><button id="reset">恢复</button>

Dalam contoh di atas, dua butang direka bentuk dan terikat pada fungsi pengendalian acara yang berbeza. Klik butang "Padam" untuk memanggil kaedah removeAttribute() jadual untuk mengosongkan sempadan jadual, dan klik butang "Pulihkan" untuk memanggil kaedah setAttribute() jadual untuk menetapkan semula ketebalan.

[Cadangan berkaitan: tutorial pembelajaran javascript]

Atas ialah kandungan terperinci Bagaimana untuk mengubah suai atribut nod elemen dalam javascript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!