除了outHTML和innerHTML外,第三种插入标记方法inserAdjacentHTML()方法

insertAdjacentHTML()方法最早在IE中出现,它接受两个参数:插入位置和要插入的HTML文本。
第一个参数必须是下列值之一:
1"beforebegin",当前元素之前插入一个紧邻的同辈元素;
2"afterbegin",在当前元素之下插入一个新的子元素或在第一个子元素之前再插入一个新的子元素
3"beforeend",在当前元素之下插入一个新的子元素或在最后一个子元素之后在插入新的子元素
4"afterend",在当前元素之后插入一个紧邻的同辈元素
注意,这些值都必须是小写形式,第二个参数是一个HTML字符串(与innerHTML和outerHTML的值相同),
如果浏览器无法解析该字符串,就会抛出错误。以下是这个方法的基本用法示例。

  //作为前一个同辈元素插入
  div.insertAdjacentHTML("beforebegin", "<p>Hello World!</p>")
  //作为第一个子元素插入
  div.insertAdjacentHTML("afterbegin","<p>Hello World!</p>")
  //作为最后一个子元素插入
  div.insertAdjacentHTML("beforeend", "<p>Hello World!</p>")
  //作为后一个同辈元素插入
  div.insertAdjacentHTML("afterend","<p>Hello World!</p>")

支持insertAdjacentHTML()方法的浏览器有IE、Firefox8+、Opera和Chrome.

posted @ 2019-04-16 15:50  小安排  阅读(463)  评论(0编辑  收藏  举报