新方法

// 根据选择器去抓取一个元素
let div = document.querySelector("div");
console.log(div);

// 根据选择器抓取多个元素
let divs = document.querySelectorAll("div"); //.div1
console.log(divs[0]);
console.log(divs[1]);

console.log(div.innerText); // 获取元素内部的文本，不会获取到内部的HTML标签
console.log(div.innerHTML); // 获取元素内部的所有内用，包括HTML标签

// 改变元素的内容
div.innerText = "123";
div.innerHTML = "<h1>456</h1>";

// 改变input里的文本
let username = document.querySelector("#username");
username.value = "123123";

传统方法

// 根据id去抓取HTML元素
let div1 = document.getElementById("div1");
console.log(div1);

// 根据class抓取HTML元素，得到的是一堆元素
let divs = document.getElementsByClassName("div1");
console.log(divs[0]);

// 根据标签抓取HTML元素，得到的是一堆元素
let divs = document.getElementsByTagName("div");
console.log(divs[0]);