在日常 web 開發中，經常遇到需要操作html dom
今天我們來總結下通過jquery來動態新增 html
首先我們來對這些方法做個總結
01、html()
html() 函式的作用原理是先移除匹配元素內部的html**，然後將新的html新增到匹配元素
設定內容
當使用該方法返回乙個值時，它會返回第乙個匹配元素的內容
語法： $(selector).html();
示例：hello world12
34設定元素內容
當使用該方法設定乙個值時，它會覆蓋所有匹配元素的內容。
語法：$(selector).html(content)
示例：hello world12
3402、prepend()
prepend() 方法向匹配元素集合中的每個元素開頭插入由引數指定的內容
語法：$(selector).prepend(content)
示例：hello world12
3403、prependto()
prependto() 方法向目標結尾插入匹配元素集合中的每個元素
語法：$(content).prependto(selector)
示例：hello world
示例：say
示例：say
before() 方法在每個匹配的元素之前插入內容
語法：$(selector).before(content)
示例:say:hello world 212
3407、insertbefore()
insertbefore() 把匹配的元素插入到另乙個指定的元素集合的前面
語法：$(content).insertbefore(selector)
示例:hello world 212
34注釋：如果該方法用於已有元素，這些元素會被從當前位置移走，然後被新增到被選元素之前。
插入已有元素示例：
hello world12
34508、after()
after() 在匹配的元素之後插入內容
語法：$(selector).after(content)
示例:hello world12
3409、insertafter()
insertafter() 方法在被選元素之後插入 html 標記或已有的元素
語法：$(content).insertafter(selector)
示例hello world12
34注釋：如果該方法用於已有元素，這些元素會被從當前位置移走，然後被新增到被選元素之後。
插入已有元素示例：
hello world
動態新增html
多瀏覽器情況下，動態新增html文字時會出現無法獲取動態插入的內容，需要改動.html 方法。textarea無法通過id進行賦值，換用 其他方式。同時，由於 動態新增文字時，firefox 用innertext 在頁面上看不到文字，故使用innerhtml 對textarea進行賦值 functi...
iframe動態新增html
最近專案中有個詳細預覽功能，詳細中的某個字段存放的是完整的html，在頁面中需要正常展示。那麼問題來了 1 需要展示的html中的樣式會與外面的頁面衝突。2 直接載入資料中的html，可能存著一些指令碼錯誤。首先想到的解決辦法是用iframe，但是iframe是直接載入某個頁面。所以需要動態的新增h...
jquery動態新增繫結事件
場景 在使用jquery的方式為元素繫結事件時，我經常使用bind或者click,但這只能為頁面已經載入好的元素繫結事件。像需要用ajax的方式請求遠端資料來動態新增頁面元素時，顯然以上幾種繫結事件的方式是無效的。解決方案 1.7之後也就是1.8開始，就不推薦用live 官方推薦用on 又稱事件委託...