语法：
document.getElementById()例子：
<body> <p id="p1">你好</p> <script> var a1=document.getElementById('a1') console.log(p1); </script> </body>或者
<body> <p id="p2">你好</p> <script> console.log(document.getElementById('p2')); </script> </body>注意：如果有相同id的元素，只能获取靠前的那个元素
使用js可以设置元素的css样式，但是要遵循两个原则
元素.style.css属性的方式设置属性拼写与css属性并不完全一致 –如果属性是一个单词，如color.width.height等，可以原样书写 -如果属性是由-连接的多个单词组成，如background-color，则应该将第一个单词的首字母小写，其他单词的首字母大写，并去除连接符(-)根据id只能获取一个元素，如果向同时获取多个元素，可以根据标签获取
getElementsByTagName方法的返回值是一个数组类型（伪数组），即使只获取了一个元素，也会以致组的形式返回getElementsByTagName方法返回的是数组，不能直接为其设置css属性，只能为一个元素通过.style的方式设置css属性，所以必须使用循环，遍历每一个元素，为其设置css属性语法：
<body> <p id="aa" class="a1">你好</p> <h3 class="a1">我很好</h3> <script> var AB=document.getElementsByClassName('a1') console.log(AB); for (var i=0;i<AB.length;i++){ AB[i].style.color='blue' } </script>注意： queryselecotr 方法只能获取一个元素，当存在多个同名元素时，只会获取第一个
queryselecotrAll 方法可以获取多个元素
<body> <p>我很好</p> <p id="aa">你好</p> <p class="aa">你也很好</p> <script> document.querySelector('#aa').style.color='green' document.querySelector('p').style.color='red' document.querySelector('.aa').style.color='blue' var ABC=document.querySelectorAll('p') console.log(ABC); </script> </body>开始标记和结束标记之间就是元素内容
获取内容
<body> <p><span>111</span></p> <script> var p=document.querySelector('p') console.log(p.innerHTML); // 设置内容 // p.innerHTML='张三' console.log(p.innerText); </script> </body> <body> <p><span>111</span></p> <script> var p=document.querySelector('p') console.log(p.innerHTML); p.innerHTML='张三' console.log(p.innerText); </script> </body>另外一种情况
<body> <p><span>111</span></p> <script> var p=document.querySelector('p') console.log(p.innerHTML); console.log(p.innerText); p.innerHTML='<p>张三</p>' </script> <body> <p><span>111</span></p> <script> var p=document.querySelector('p') console.log(p.innerHTML); console.log(p.innerText); // p.innerHTML='<p>张三</p>' p.innerText='<p>张三</p>' </script> </body>