document.createElement()創建元素，再用appendChild( )添加

動態引入jquery：

var scriptElement=document.createElement("script"); scriptElement.type="text/javascript"; scriptElement.src="https://code.jquery.com/jquery-3.4.1.min.js"; scriptElement.charset="utf-8"; document.getElementsByTagName('head')[0].appendChild(scriptElement);

如果屬性有特殊字符怎么辦(比如屬性名為http-equiv)？使用setAttribute方法添加屬性。動態添加meta元素，指定5秒后刷新：

var meta=document.createElement("meta"); meta.setAttribute("http-equiv","refresh"); meta.setAttribute("content","5"); document.getElementsByTagName('head')[0].appendChild(meta);

使用innerHTML

使用innerHTML就隨意的多了，將要添加的html拼成字符串即可。替換html > body中的內容：

var bodyElement = document.getElementsByTagName("body"); bodyElement[0].innerHTML = "<H1>Hello World!</H1>";

jQuery

jQuery封裝了很對好用的方法，動態添加更隨意。替換html > body中的內容：

var newElement= $("<H1>Hello World!</H1>"); $("body:first").append(newElement);

總結

以上是生活随笔為你收集整理的动态添加html元素的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。