HTML5选择器

来源：互联网发布：linux中创建文件命令编辑：程序博客网时间：2024/06/05 16:20

http://www.caniuse.com/#index

HTML5新特性的浏览器支持情况

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>选择器</title>    <script type="text/javascript">        window.onload=function(){            //var oDiv=document.querySelector(".box")            //oDiv.style.background='red';//只能改变div1的样式            // var oDiv=document.querySelectorAll(".box");            // alert(oDiv.length);//获取的一组值，要想改变每个元素样式就得用循环            // var oDiv=document.getElementsByClassName('box');//不加点            //  alert(oDiv.length);//获取的一组值            var oDiv=document.getElementById('div3');            alert(oDiv.classList)//box1 box2 box3,类似与数组的对象            alert(oDiv.classList.length);//3            oDiv.classList.add('box4')//添加class名为box4             oDiv.classList.remove('box4')//删除class名为box4        }    </script></head><body>    <div id="div1" class=".box">div1</div>    <div class=".box">div2</div>    <div id="div3" class="box1 box2 box3">div3</div></body></html>----------<!-- querySelector():选择元素，类似于jQuery，元素名，ID名，类名，但只能选择一组中的第一个元素getElementsByClassName():通过class名，不加点，获取一组值classList:获取class列表属性          length：class的长度          add(): 添加class的方法          remove():删除class的方法          toggle():切换class的方法，括号里的class若存在则执行删除，如果不存在则执行添加 -->

阅读全文

0 0