Rumah >hujung hadapan web >tutorial js >Kaedah JavaScript untuk mendapatkan nod seterusnya kemahiran dom_javascript
Gunakan javascript untuk menulis kaedah menambah nombor dengan mengklik butang tambah dan tolak pada halaman.
html yang mudah mungkin seperti ini. Hanya faham dan jangan risau tentang butiran ini
<input type="button" value="+" onclick="jia(this)" /> <label class="num">0</label> <input type="button" value="-" onclick="jian(this)" />
Ia kelihatan seperti ini
Kod javascript adalah seperti berikut
<script type="text/javascript"> function jia(a) { var nextnode = a.nextElementSibling;//获取下一个节点 alert(nextnode.innerHTML); var a = parseInt(nextnode.innerHTML) a += 1; nextnode.innerHTML = a; } function jian(a) { var previousnode = a.previousElementSibling; var a = parseInt(previousnode.innerHTML) a -= 1; a = a > 0 ? a : 0; previousnode.innerHTML = a; } </script>
Terangkan:
fungsi jian(a) dan
fungsi jia(a) ialah objek yang sedang diklik. Tambahkan ini pada kaedah acara onclick;
- nextElementSibling Mendapat nod seterusnya nod semasa (mendapat nod adik beradik seterusnya)
- previousElementSibling mendapat nod sebelumnya bagi nod semasa
Penjelasan di atas bermaksud menggunakan nextElementSibling dan previousElementSibling untuk mendapatkan nod adik beradik seterusnya dan nod adik beradik sebelumnya Anda boleh mengalih keluar pemisah baris, ruang, dsb., dan terus mencari elemen label kami. Tetapi dua berikut
Adik Beradik seterusnya
previousSibling juga merujuk kepada nod adik beradik seterusnya dan nod adik beradik sebelumnya, tetapi ia mudah digunakan dalam IE
--------------------Penjelasan kata kunci
a = a > a : 0;----ungkapan ternari.