html中的替换元素是什么？

html-css011

html中的替换元素是什么？,第1张

html：

<div id='divContainer'>

<div id='divBeReplaced'>被替换的元素</div>

</div>

1.使用DOM对象添加元素

var elemOld = document.getElementById('divBeReplaced')

var elemParent = elemOld.parentNode

var elemNew = document.createElement('div')

elemNew.innerHTML = '新的元素'

elemParent.replaceChild(elemNew, elemOld)

2.使用JQuery添加元素

$("#divBeReplaced").replaceWith("<b>Hello world!</b>")

空元素，可能是 HTML，SVG，或者 MathML 里的一个不存在子节点（例如内嵌的元素或者元素内的文本）的element。但是空元素可以有自己的属性，要区分属性和节点。

空元素中嵌套子节点是没有语义含义的。

空元素一般是没有闭合标签的，如果空元素使用了闭合标签，例如：<input></input>，那么一般这个标签就会变得无效。

常见的空元素：

可替换元素的展现效果不是由 CSS 来控制的。这些元素是一种外部对象，它们外观的渲染，是独立于当前文档使用的 CSS样式 的。一般来说当前文档的CSS样式唯一能够控制的是可替代元素在当前文档的位置。

常见的可替换元素：

典型的可替换元素

特定情况下的可替换元素

<input>

<input>在type为image的情况下可以像<img>一样被当做可替换元素，但是其他type类型下，被明确地列为非可替换元素。

CSS 中的 content

用 CSS content 属性插入的对象是匿名的可替换元素。它们并不存在于 HTML 标记中，因此是“匿名的”。

html是替换，而append是追加

例如 <div id="div1">内容</div>

$(#div1").html("<div>这是内容</div>")

这样的最终结果就是 <div>这是内容</div> //也就是把原来的内容替换了

$(#div1").append("<div>这是内容</div>")

这样的最终结果就是 <div id="div1">内容</div><div>这是内容</div>

//也就是把内容追加到你这个元素的后面。