<div id="exampleA" class="styleA">
<p>Here could be a default message where the div has specific styling. These are useful for things like default error or loading messages.</p>
</div>
<script>
document.getElementById("exampleA").outerHTML = '<div id="welcome" class="styleB">Welcome to the site</div>';
</script>
The outerHTML is the HTML of an element including the element itself. Contrast this with the innerHTML of the element, which is the HTML contained within an elements opening and closing tags. By definition, elements without both opening and closing tags do not have innerHTML.
Use the outerHTML when you want to completely replace an element and its contents.
You might do this if you have a loading section. The new content with the outerHTML replaces it.
<div id="exampleA" class="styleA">
<p>Here could be a default message where the div has specific styling. These are useful for things like default error or loading messages.</p>
</div>
<script>
document.getElementById("exampleA").outerHTML = '<div id="welcome" class="styleB">Welcome to the site</div>';
</script>
Use innerHTML when you only want to replace the contents inside the element.
An example of this would be if you have default content, but new data could at any point replace it.
outerHTML 最初是元素的非标准 Internet Explorer 属性，但现在具有跨浏览器支持。它返回元素及其子元素的 HTML。对于有父元素的元素，可以设置它来替换该元素及其后代。
outerHTML was originally a non-standard Internet Explorer property of an element, but now has cross-browser support. It returns the HTML of the element and its child elements. For elements that have parents, it can be set to replace the element and its descendants.
发布评论
评论（3）
externalHTML 是元素的 HTML，包括元素本身。将此与元素的innerHTML 进行对比，innerHTML 是元素开始和结束标记中包含的HTML。根据定义，没有开始和结束标签的元素没有innerHTML。
当您想要完全替换元素及其内容时，请使用outerHTML。
如果您有加载部分，则可以这样做。新的内容与outerHTML 将取代它。
当您只想替换元素内的内容时，请使用innerHTML。
例如，如果您有默认内容，但新数据可以随时替换它。
The outerHTML is the HTML of an element including the element itself. Contrast this with the innerHTML of the element, which is the HTML contained within an elements opening and closing tags. By definition, elements without both opening and closing tags do not have innerHTML.
Use the outerHTML when you want to completely replace an element and its contents.
You might do this if you have a loading section. The new content with the outerHTML replaces it.
Use innerHTML when you only want to replace the contents inside the element.
An example of this would be if you have default content, but new data could at any point replace it.
outerHTML最初是元素的非标准 Internet Explorer 属性，但现在具有跨浏览器支持。它返回元素及其子元素的 HTML。对于有父元素的元素，可以设置它来替换该元素及其后代。outerHTMLwas originally a non-standard Internet Explorer property of an element, but now has cross-browser support. It returns the HTML of the element and its child elements. For elements that have parents, it can be set to replace the element and its descendants.