JavaScript document.querySelector()方法
querySelector()用于读取HTML里的任何标签
querySelector用于查询页面中第一个符合规则的元素，可以在 Document实例和 Element实例上调用，接收一个选择器字符串参数，如果查找到则返回 HTMLElement 对象，否则返回 null。
console.log(document.querySelector("button"));//用于取得button
例子：用于替换标签内容
<html>
<body>
<p>这是一个例子</p>
<button>
这是一个被替换的按钮
</button>
</body>
<script>
const button1 =document.querySelector("button");//queryselector选择button标签
const p =document.quertSelector("p");
//button1是一个对象（取得的HTML是个对象）
button1.innerHTML="哈哈"; //将button标签中的内容修改
p.innerHTML="卧槽";
</script>
</html>
如果有两个P标签
<html>
<body>
<p>这是一个例子</p>
<p>这是二个例子</p>
<button>
这是一个被替换的按钮
</button>
</body>
<script>
const button1 =document.quertSelector("button");//queryselector选择button标签
const p =document.querySelector("p");
//button1是一个对象（取得的HTML是个对象）
button1.innerHTML="哈哈"; //将button标签中的内容修改
p.innerHTML="卧槽";
</script>
</html>
这样取得P标记只会取得第一个P标签
若想要取得第二个P标签
给P标签加个CLASS或者ID标签
<html>
<body>
<p>这是一个例子</p>
<p class="js-p">这是二个例子</p>
<p id="js-p">这是三个个例子</p>
<button>
这是一个被替换的按钮
</button>
</body>
<script>
const button1 =document.querySelector("button");//queryselector选择button标签
const p =document.querySelector("p");
const p1 =document.querySelector(".js-p");//通过class
const p2 =document.querySelector("#js-p");//通过ID
//button1是一个对象（取得的HTML是个对象）
button1.innerHTML="哈哈"; //将button标签中的内容修改
p.innerHTML="卧槽";
p1.innerHTML="我靠";//通过class
p2.innerHTML="我曹";//通过ID
</script>
</html>