jQuery創(chuàng)建DOM元素實例解析

更新時間：2015年01月19日 10:55:59 投稿：shichen2014

這篇文章主要介紹了jQuery創(chuàng)建DOM元素的方法,實例分析了jQuery使用$直接創(chuàng)建DOM元素的技巧,具有一定參考借鑒價值,需要的朋友可以參考下

本文實例講述了jQuery創(chuàng)建DOM元素的使用技巧。分享給大家供大家參考。具體分析如下：

利用DOM方法創(chuàng)建元素節(jié)點，通常要將document.createElement()、document.createTextNode()、appendChild()配合使用，十分麻煩。

而jQuery使用$就可以直接創(chuàng)建DOM元素

復(fù)制代碼代碼如下:

var oNewP = $("<p>使用jQuery創(chuàng)建的內(nèi)容</p>");

以上代碼等同于javascript

復(fù)制代碼代碼如下:

var oNewP2 = document.createElement("p");

var oText = document.createTextNode("這是使用javascript方法創(chuàng)建的內(nèi)容");

oNewP2.appendChild(oText);

例：使用jQuery創(chuàng)建DOM

復(fù)制代碼代碼如下:

</script>
<div id="display"></div>

使用jQuery大大縮短了代碼長度。節(jié)省了編寫時間。

希望本文所述對大家的jQuery程序設(shè)計有所幫助。

您可能感興趣的文章:

相關(guān)文章

jquery清空表單數(shù)據(jù)示例分享
這篇文章主要介紹了jquery清空表單數(shù)據(jù)的示例,需要的朋友可以參考下
2014-02-02
jQuery實現(xiàn)表格行和列的動態(tài)添加與刪除方法【測試可用】
這篇文章主要介紹了jQuery實現(xiàn)表格行和列的動態(tài)添加與刪除方法,涉及jQuery針對頁面元素的動態(tài)添加與刪除相關(guān)技巧,非常簡便實用,需要的朋友可以參考下
2016-08-08
jquery實現(xiàn)手機號碼選號的方法
這篇文章主要介紹了jquery實現(xiàn)手機號碼選號的方法,涉及jquery針對手機號碼的分析與篩選技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-07-07
jquery通過ajax加載一段文本內(nèi)容的方法
這篇文章主要介紹了jquery通過ajax加載一段文本內(nèi)容的方法,是jQuery針對Ajax的靈活應(yīng)用,具有一定參考借鑒價值,需要的朋友可以參考下
2015-01-01
jquery 中多條件選擇器,相對選擇器,層次選擇器的區(qū)別
jquery 中多條件選擇器,相對選擇器,層次選擇器的區(qū)別介紹，需要的朋友可以參考下
2012-07-07
jquery插件開發(fā)注意事項小結(jié)
Jquery是繼prototype之后又一個優(yōu)秀的Javascrīpt框架。它是輕量級的js庫(壓縮后只有21k) ，它兼容CSS3，還兼容各種瀏覽器 (IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)
2013-06-06
jQuery Ajax提交表單查詢獲得數(shù)據(jù)實例代碼
用戶輸入一個表單，輸入準(zhǔn)考證和驗證碼，驗證用戶是否輸入表單，點擊查詢提交，然后從服務(wù)器得到返回的數(shù)據(jù)并顯示出來
2012-09-09
在jQuery中使用$而避免跟其它庫產(chǎn)生沖突的方法
這篇文章主要介紹了在jQuery中使用$而避免跟其它庫產(chǎn)生沖突的方法,總共羅列了三種,需要的朋友可以參考下
2015-08-08
jquery中ajax使用error調(diào)試錯誤的方法
這篇文章主要介紹了jquery中ajax使用error調(diào)試錯誤的方法,實例分析了Ajax的使用方法與error函數(shù)調(diào)試錯誤的技巧,需要的朋友可以參考下
2015-02-02
基于jQuery實現(xiàn)的向下滑動二級菜單效果代碼
這篇文章主要介紹了基于jQuery實現(xiàn)的向下滑動二級菜單效果代碼,通過jquery鼠標(biāo)事件控制針對頁面元素的鏈?zhǔn)讲僮鲗崿F(xiàn)菜單切換的功能,非常簡單實用,需要的朋友可以參考下
2015-08-08