querySelector和getElementById方法

第一次接触DOM选择符 querySelector，笔记一下 querySelector和 getElementById的使用和区别

两者区别

• 相同点：都是对DOM进行操作，返回HTMLElement对象。
• getElementById：动态对象元素，会随着文档的操作而改变。
• querySelector：静态对象，返回第一个符合匹配条件的对象。可以使用id、target、class，所以在效率上不敌getElementById。
• querySelectorAll：静态对象数组，使用数组返回所有符合条件的对象。

getElementById使用案例

网上太多了，暂时就没有举栗子，后面有空再补吧

querySelector使用案例

<div id="demo" class="demo">
	<p class="c_p">DOM选择符使用demo</P>
	<a target="t_a1">有target属性的a标签</a><br/>
	<a target="t_a2">另一个有target属性的a标签</a>
</div>

• 根据id获取DOM

let element = document.querySelector("#demo");

• 根据元素获取DOM

document.querySelector("p");

• 根据css获取DOM

document.querySelector(".c_p");

• 根据target获取DOM

document.querySelector("a[target]");

复杂css选择

document.querySelector("div.demo a[target='a_t2']");

后面再补充吧！