javascript中的:DOM对象

Document Object Model（文档对象模型）简称DOM,可以随便的去修改网页的内容，实现各种网页特效,HTML 中的所有的标签都会当成对象来对待

目录

1. 获取 DOM 对象

2. 修改 DOM 对象

1. 获取 DOM 对象

• document.querySelector(css的选择器)

// 1. 标签选择器
// 通过标签选择器获取 DOM 对象
let el = document.querySelector("div");
console.log(el); // 对象类型

// 2. 类选择器
// 通过类选择器获取 DOM 对象
let el2 = document.querySelector(".three");
console.log(el2); // 对象类型

// 3. 后代选择器
let el3 = document.querySelector("ul li");
console.log(el3);

// 4. 子选择器
let el4 = document.querySelector("ul > li");
console.log(el4);

• document.querySelectorAll(css的选择器)

• 其它 document.getElementsByTagName() document.getElementById() ... 

2. 修改 DOM 对象

• 修改内容

•  修改属性

let picture = document.querySelector("img");
picture.src = "xxx.jpg";
let content = document.querySelector("input");
content.value = "xxx";
content.type = "xxx";