<body>
<!-- 获取id命名的练习 -->
<div id="a1">100</div>
<div id="a2">200</div>
<div id="a3">300</div>
<div id="a4">400</div>
<!-- 获取class命名的练习 -->
<div class="p2">AAAAA</div>
<div class="p2">BBB</div>
<div class="p2">CCCCCCCCC</div>
<div class="p2">DDDDDDD</div>
<!-- 获取--相同元素的节点列表 例：ul元素 -->
<ul>
<li>sfsdfsdfsdf111</li>
<li>ytuyu222</li>
<li>mmmmmmmmmm333</li>
</ul>
<!-- 获取相同名称的节点列表 例：多个div都叫name -->
<div name='a8'>1</div>
<div name='a8'>2</div>
<div name='a8'>3</div>
<div name='a8'>4</div>
<div name='a8'>5</div>
<!-- 获取特定元素节点属性的值 例：获取div的title属性 -->
<div id="box" title="555555"></div>
<!-- 设置特定元素节点属性的值 例：设置div的title属性 -->
<!-- 这个方法可以（沿用或重新var）在上面的基础上来，设置title新的值 -->
<!-- 删除特定元素节点属性 -->
<!-- 把获取title的代码换成删除的代码就可以了getAttribute('title')改为removeAttribute('title') -->
<!-- 返回与该模式匹配的第一个元素，如果没有则返回null -->
<!-- 可以用这个方法来找id命名的div中的具体内容--如果没有则返回null,
可以用来找class命名的div中的具体内容--如果没有则返回null -->
<!-- 返回与该模式匹配的全部元素，如果没有则返回null -->
<!-- 可以用这个方法来找id命名的div中的具体内容--如果没有则返回null
可以用来找class命名的div中的具体内容--如果没有则返回null
而且它还支持选择器-->
<ul class="ul1">
<li>11</li>
<li>22</li>
<li>33</li>
</ul>
<ul class="ul2">
<li>aa</li>
<li>bb</li>
<li>cc</li>
</ul>
<h1 id="title">我就是我 <span>2222</span></h1>
<script>
001获取特定ID元素的节点
var diva=document.getElementById('a1');
console.log(diva); id名具有唯一性能打印一个
002获取特定class元素的节点
var p2s =document.getElementsByClassName('p2');
console.log(p2s)[];需要给具体项添加事件要给这个项填上它的下标再操作---class名可以在打印台都打印出来
(但要注意打印出来是一个伪数组（假的）
所以它并不具备数组的方法)但它可以找下标----例：console.log(p2s[1]);
003获取相同元素的节点列表
var lis = document.getElementsByTagName('li');
console.log(lis[1]); 打印获取相同元素的节点列表（伪数组）、或相同节点对应下标的具体内容[xxx]
004获取相同名称的节点列表
var names =document.getElementsByName('a8');
console.log(names[1]);打印获取相同名称的节点列表或具体哪项里的内容
##A 获取特定元素节点属性的值
var tit = document.getElementById('box').getAttribute('title');
标签.getElementById（属性的名） 属性值
console.log(tit);打印为div的title属性里的值
##B 设置特定元素节点属性的值
var tit = document.getElementById('box').setAttribute('title','000000');
/var tit = document.getElementById('box');
console.log(tit);
##C 删除特定元素节点属性
把获取title的代码换成删除的代码就可以了getAttribute('title')改为removeAttribute('title')
##D 返回与该模式匹配的第一个元素，如果没有则返回null
var a1 =document.querySelector('#a1');找单一的-- 注：id的必须加#号，如果是class的加.
console.log(a1);也可以加[]下标找具体项
##E 返回与该模式匹配的全部元素，如果没有则返回null
这个方法可以包含选择器
var l =document.querySelectorAll('.ul1 li');//找全部的--注：id的必须加#号，如果是class的加.
console.log(l);也可以加[]下标找具体项
##打印到页面两个方法的区别？
var h1 =document.getElementById ('title');
console.log(h1.innerHTML );可以打印到页面，这个也能识别标签
console.log(h1.innerText );可以打印到页面，但不能识别标签会把标签当做文本直接打印到页面
