浅谈JS中的常用选择器及属性、方法的调用

时间：2021-05-18

选择器、属性及方法调用的配合使用：

<style> #a{ width: 200px; height: 100px; background-color: red; } .b{ width: 200px; height: 100px; background-color: green; } .div1{ width: 200px; height: 100px; background-color:aqua; } </style> <body> <div id="a"></div> <div class="b" style="background-color: black;"></div> <div class="b" style="background-color: chartreuse;"></div> <div class="div1">精英教育</div> <input type="text" name="ipt1" /> <input type="checkbox" name="ckb2" / disabled="disabled"> </body> <script> //先选择元素在进行加效果 //ID选择器(使用较高JS) var a = document.getElementById("a"); //检测类型 alert(typeof(document.getElementById("a"))) a.style.backgroundColor="royalblue"; a.innerHTML ="<span>hello<span>"; a.innerText = "<span>hello<span>";// class选择器 var b_class = document.getElementsByClassName("b"); b_class[0].style.backgroundColor="red"; var b_class = document.getElementsByClassName("b"); b_class[1].style.backgroundColor="blueviolet";// 标签选择器 var b_b = document.getElementsByTagName("div"); b_b[1].style.backgroundColor="yellow"; var div_1 = document.getElementsByName("ipt1"); div_1[0].value="文本框"; var ckb2 = document.getElementsByName("ckb2")[0]; ckb2.setAttribute("checked",""); //移除属性 ckb2.removeAttribute("disabled") //创造元素 var a = document.createElement("a"); a.setAttribute("href","http://"); a.innerText = "百度"; document.body.appendChild(a); document.body.removeChild(a); div1.appendChild(a);</script>

以上这篇浅谈JS中的常用选择器及属性、方法的调用就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持。

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章