jquery可以為頁面添加元素嗎

WBOY
發布: 2022-06-09 16:47:13
原創
1744 人瀏覽過

jquery可以為頁面新增元素。新增方法:1、利用「元素物件.append("插入內容")」在元素的結尾加入元素;2、利用「元素物件.prepend("插入內容")」在元素的開頭加上元素;3、利用「元素物件.after("插入內容")」在被選元素後加入元素;4、利用「元素物件.before("插入內容")」在被選元素後加入元素。

jquery可以為頁面添加元素嗎

本教學操作環境:windows10系統、jquery3.4.1版本、Dell G3電腦。

jquery可以為頁面新增元素嗎

jquery可以為頁面新增元素

  • append() -在被選元素的結尾插入內容

$(selector).append(content,function(index,html))
登入後複製

範例如下:

    12   

这是一个段落。

这是另一个段落

  1. 列表项 1
  2. 列表项 2
  3. 列表项 3
登入後複製

輸出結果:

jquery可以為頁面添加元素嗎

  • prepend() - 在被選元素的開頭插入內容

##範例如下:


$(document).ready(function(){ $("#btn1").click(function(){ $("p").prepend(" 插入文本."); }); $("#btn2").click(function(){ $("ol").prepend("
  • 插入项
  • "); }); });
    登入後複製

    輸出結果:

    jquery可以為頁面添加元素嗎

    • #after() - 在被選元素之後插入內容

    • $(document).ready(function(){ $("#btn1").click(function(){ $("p").after(" 插入文本."); }); $("#btn2").click(function(){ $("ol").after("
    • 插入项
    • "); }); });
      登入後複製
    輸出結果:

    jquery可以為頁面添加元素嗎

    • #before() - 在被選元素之前插入內容

    • $(document).ready(function(){ $("#btn1").click(function(){ $("p").before(" 插入文本."); }); $("#btn2").click(function(){ $("ol").before("
    • 插入项
    • "); }); });
      登入後複製
      輸出結果:

      jquery可以為頁面添加元素嗎

      影片教學推薦:

      jQuery影片教學
      #

      以上是jquery可以為頁面添加元素嗎的詳細內容。更多資訊請關注PHP中文網其他相關文章!

    相關標籤:
    來源:php.cn
    本網站聲明
    本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
    熱門推薦
    熱門教學
    更多>
    最新下載
    更多>
    網站特效
    網站源碼
    網站素材
    前端模板
    關於我們 免責聲明 Sitemap
    PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!