HTML DOM Element innerHTML 属性

您所在的位置：网站首页 › getelementbyid的返回值类型 › HTML DOM Element innerHTML 属性

HTML DOM Element innerHTML 属性

2023-10-01 21:46| 来源: 网络整理| 查看: 265

w3school 在线教程 HTML 系列教程浏览器脚本服务器脚本编程教程 XML 系列教程建站手册参考手册 JS 参考手册 JS 参考手册（类别排序） JS 参考手册（字母排序） JavaScript JS Array JS Boolean JS Class JS Date JS Error JS Global JS JSON JS Math JS Number JS RegExp JS String JS 对象 JS 运算符 JS 语句 JS 类型化数组 Window Window 对象 Window Console Window History Window Location Window Navigator Window Screen HTML DOM HTML Document HTML Element HTML Attribute HTML Event HTML Event 对象 HTML Collection HTML NodeList HTML DOMTokenList HTML Style Web API API Console API Fetch API Fullscreen API Geolocation API History API MediaQueryList API Storage API Validation API Web HTML 对象 - button checkbox color date datetime datetime-local email file hidden image month number password radio range reset search submit text time url week
其他参考手册 CSSStyleDeclaration JS 类型转换建站手册网站构建万维网联盟 (W3C) 浏览器信息网站品质语义网职业规划网站主机关于 W3School 帮助 W3School HTML DOM Element innerHTML 属性 id innerText HTML DOM Elements 对象定义和用法
innerHTML 属性设置或返回元素的 HTML 内容（内部 HTML）。
另请参阅：
innerText 属性

textContent 属性
实例例子 1
获取 id="myP" 元素的 HTML 内容：
let html = document.getElementById("myP").innerHTML;
亲自试一试
例子 2
更改 id="demo" 元素的 HTML 内容：
document.getElementById("demo").innerHTML = "I have changed!";
亲自试一试
例子 3
获取 id="myList" 的元素的 HTML 内容：
let html = document.getElementById("myList").innerHTML;
亲自试一试
例子 4
删除 id="demo" 的
元素的 HTML 内容：
element.innerHTML = "";
亲自试一试
例子 5
更改两个元素的 HTML 内容：
let text = "Hello Dolly."; document.getElementById("myP").innerHTML = text; document.getElementById("myDIV").innerHTML = text;
亲自试一试
例子 6
重复元素的 HTML 内容：
element.innerHTML += element.innerHTML;
亲自试一试
例子 7
更改链接的 HTML 内容和 URL：
element.innerHTML = "W3School"; element.href = "";
亲自试一试
语法
返回 innerHTML 属性：
element.innerHTML
设置 innerHTML 属性：
element.innerHTML = text 属性值值描述字符串。 HTML 内容。返回值类型描述字符串元素的 HTML 内容。 innerHTML、innerText 与 textContent 的区别 innerText 属性返回：
只返回元素及其所有子元素的文本内容，没有 CSS 隐藏文本间距和标签，除了和元素。
innerHTML 属性返回：
元素的文本内容，包括所有空白和内部 HTML 标签。
textContent 属性返回：
元素和所有后代的文本内容，带有空白和 CSS 隐藏文本，但没有标签。
HTML 实例
This element has extra spacing and contains a span element.
JavaScript 实例 let text = document.getElementById("myP").innerText; let text = document.getElementById("myP").innerHTML; let text = document.getElementById("demo").textContent;
亲自试一试

在上面的例子中：

innerText 属性返回：
This element has extra spacing and contains a span element.
innerHTML 属性返回：
This element has extra spacing and contains a span element.
textContent 属性返回：
This element has extra spacing and contains a span element. 浏览器支持
所有浏览器都支持 element.innerHTML：
Chrome IE Edge Firefox Safari Opera Chrome IE Edge Firefox Safari Opera 支持支持支持支持支持支持 id innerText HTML DOM Elements 对象 JavaScript 和 HTML DOM 参考手册 JavaScript 实例 JavaScript 测验 JavaScript 教程
W3School 简体中文版提供的内容仅用于培训和测试，不保证内容的正确性。通过使用本站内容随之而来的风险与本站无关。版权所有，保留一切权利。

使用条款隐私条款技术支持：赢科蒙ICP备06004630号

【本文地址】

HTML DOM Element innerHTML 属性

HTML DOM Element innerHTML 属性

今日新闻

推荐新闻