从IE9开始DOM开始支持支持CSS的选择器了,DOM提供了两个接口querySelector 得到一个DOMquerySelectorAll 得到一组DOM一个个的解释这些选择器也没有必要,我们结合前面的数组知识,写一段代码来说明。页面上有一组元素,然后会依据我们数组中的预订选 ...
从IE9开始DOM开始支持支持CSS的选择器了,DOM提供了两个接口
querySelector 得到一个DOM
querySelectorAll 得到一组DOM
一个个的解释这些选择器也没有必要,我们结合前面的数组知识,写一段代码来说明。页面上有一组元素,然后会依据我们数组中的预订选择值选择相应元素,并将背景变红色,同时提示选择器的含义。这样的代码便于运行理解和扩展。
html的结构部分
<body> <div> <input type="button" value="开始测试" /> <span></span><span></span> </div> <ol> <li title="abc1"> <h2 title="abc"> Hello</h2> </li> <li title="abc2"> <input type="checkbox" checked="checked" /> <input type="checkbox" /> <input type="checkbox" /> </li> <li title="abc3"></li> <li title="abc4"> <ul> <li title="41abc"> <input type="text" readonly="true" /> <input type="text" /> </li> <li title="42abc"> <input type="button" value="disabled" disabled="disabled" /> </li> <li title="43abc4"></li> <li title="44abc4"> <input type="radio" checked="checked" /> <input type="radio" /> <input type="radio" checked="checked" /> </li> </ul> </li> <li title="abc5"></li> <li title="abc6"></li> <li title="abc7"></li> <li title="abc8"><a href="#">go</a></li> <li title="abc9"></li> </ol> <p> text</p> <a href="http://hovertree.com/">何问起</a></body>
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:新增的querySelector、querySelectorAll测试
关键词:
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。