如何使用jQuery添加新內(nèi)容

如何使用jQuery添加新內(nèi)容？相信很多沒有經(jīng)驗的人對此束手無策，為此本文總結(jié)了問題出現(xiàn)的原因和解決方法，通過這篇文章希望你能解決這個問題。

添加新內(nèi)容的四個 jQuery 方法區(qū)別如下：

append() - 在被選元素（里面）的結(jié)尾插入內(nèi)容

prepend() - 在被選元素（里面）的開頭插入內(nèi)容

//jQuery append() 方法在被選元素的結(jié)尾插入內(nèi)容。
$("p").append("Some appended text.");

//jQuery prepend() 方法在被選元素的開頭插入內(nèi)容。
$("p").prepend("Some prepended text.");

通過 append() 和 prepend() 方法添加若干新元素

function appendText()
{
var txt1="<p>Text.</p>";        // 以 HTML 創(chuàng)建新元素
var txt2=$("<p></p>").text("Text.");  // 以 jQuery 創(chuàng)建新元素
var txt3=document.createElement("p"); // 以 DOM 創(chuàng)建新元素
txt3.innerHTML="Text.";
$("p").append(txt1,txt2,txt3);     // 追加新元素
}

after() - 在被選元素（外面）之后插入內(nèi)容

before() - 在被選元素（外面）之前插入內(nèi)容

$("img").after("Some text after");

$("img").before("Some text before");

通過 after() 和 before() 方法添加若干新元素

function afterText()
{
var txt1="<b>I </b>";          // 以 HTML 創(chuàng)建新元素
var txt2=$("<i></i>").text("love ");   // 通過 jQuery 創(chuàng)建新元素
var txt3=document.createElement("big"); // 通過 DOM 創(chuàng)建新元素
txt3.innerHTML="jQuery!";
$("img").after(txt1,txt2,txt3);     // 在 img 之后插入新元素
}

jquery是什么

jquery是一個簡潔而快速的JavaScript庫，它具有獨特的鏈?zhǔn)秸Z法和短小清晰的多功能接口、高效靈活的css選擇器，并且可對CSS選擇器進行擴展、擁有便捷的插件擴展機制和豐富的插件，是繼Prototype之后又一個優(yōu)秀的JavaScript代碼庫，能夠用于簡化事件處理、HTML文檔遍歷、Ajax交互和動畫，以便快速開發(fā)網(wǎng)站。

看完上述內(nèi)容，你們掌握如何使用jQuery添加新內(nèi)容的方法了嗎？如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容，歡迎關(guān)注億速云行業(yè)資訊頻道，感謝各位的閱讀！