一、JavaScript-元素内容操作
<div>
我是div
<h1>我是标题</h1>
<p>我是段落</p>
</div>
(1).获取元素内容
1.innerHTML 获取的内容包含标签, innerText / textContent 获取的内容不包含标签;
2.innerHTML / textContent获取的内容不会去除两端的空格, innerText获取的内容会去除两端的空格;
let oDiv = document.querySelector("div");
console.log(oDiv.innerHTML);
console.log(oDiv.innerText);
console.log(oDiv.textContent);
(2).设置元素内容
特点:
无论通过innerHTML / innerText / textContent 设置内容, 新的内容都会覆盖原有的内容;
区别:
如果通过 innerHTML 设置数据, 数据中包含标签, 会转换成标签之后再添加;
如果通过 innerText / textContent 设置数据, 数据中包含标签, 不会转换成标签, 会当做一个字符串直接设置;
let oDiv = document.querySelector("div");
// oDiv.innerHTML = "123";
// oDiv.innerText = "456";
// oDiv.textContent = "789";
// oDiv.innerHTML = "<span>我是span<