免费视频淫片aa毛片_日韩高清在线亚洲专区vr_日韩大片免费观看视频播放_亚洲欧美国产精品完整版

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
Jquery元素追加和刪除
介紹
   DOM是Document Object Modeule的縮寫,一般來說,DOM操作分成3個方面。
  1、DOM Core
    DOM Core并不專屬于javascript,任何一種支持DOM的程序設(shè)計(jì)語言都可以使用它,用途也遠(yuǎn)不止僅限于網(wǎng)頁,也可以用來處理任何一種使用標(biāo)記語言編寫出來的文檔,如XML。
    例如:document,getElementsByTagName(“form”);//使用DOM Core來獲取表單對象的方法。
  2、HTML-DOM
    在使用Javascript和DOM為HTML文件編寫腳本時,有許多屬于HTML-DOM的屬性,HTML-DOM的出現(xiàn)甚至比DOM Core還要早,他提供了一些更簡明的記號來描述各種HTML元素的屬性。
    例如:document.forms //HTML-DOM提供了一個forms對象。
  PS:可以看出,獲取對象、屬性即可以用DOM Core來實(shí)現(xiàn)民,也可以用HTML-DOM實(shí)現(xiàn)。
  3、CSS-DOM
     CSS-DOM是針對CSS的操作,在javascript中,CSS-DOM主要的作用是獲取和設(shè)置style對象的各種屬性,由此達(dá)到網(wǎng)頁呈現(xiàn)出各種不同的效果.
    例如:element.style.color=”red”;//設(shè)置某元素的字體顏色的方法。
常用方法
   1.查找元素節(jié)點(diǎn)
     var $li = $(“ul li:eq(0)”);//獲取ul標(biāo)記下的第一個li,也可以寫成 $(“#ulID li:eq(0)”);
   2.查找元素屬性
   利用jquery的attr()方法來獲取元素的各種屬性的值,attr()方法的參數(shù)可以是一個,也可以是兩個。
         當(dāng)參數(shù)是一個時,則是要查詢的屬性名稱。
         當(dāng)參數(shù)是兩個時,則可以設(shè)置屬性的值。
      alert($(“#id”).attr(“title”)); //輸出元素的title屬性.一個參數(shù)
      $(“#id”).attr(“title”,”改變title值”); //改變元素的title屬性值.二個參數(shù)
   3.添加元素節(jié)點(diǎn)
      $(html) 簡單說明一下$(html)方法會根據(jù)傳入的html標(biāo)記字符串創(chuàng)建一個dom對象,并將這個dom對象包裝成一個jquery對象返回,總之就是把標(biāo)記所有html代碼都放到$()工廠里面就行了!
      例:
         var $htmlLi = $(”  <li title=’香蕉’>香蕉</li>”);  //創(chuàng)建DOM對象
         var $ul = $(“ul”);   //獲取UL對象
         $ul.append($htmlLi); //將$htmlLi追加到$ul元素的li列表
      下面列出部分插入節(jié)點(diǎn)的方法
方法描述示例
Append()向每個匹配的元素內(nèi)追加內(nèi)容HTML代碼

 

<ul></ul>

JQuery代碼

$(“ul”).append(“<li>AA</li>”);

結(jié)果

<ul>

<li>AA</li>

</ul>

 

appendTo()

注意大小寫,我試驗(yàn)時appendto沒通過。

該方法和Append()相反,a.Append(b)是將b追加到a中,而appendTo()是將b追求到a中HTML代碼

 

<ul></ul>

JQuery代碼

$ (“<li>AA</li>”).appendTo (“ul”).;

結(jié)果

<ul>

<li>AA</li>

</ul>

 

Prepend()向每個匹配的元素內(nèi)部前置內(nèi)容HTML代碼

 

<p>哈哈</p>

JQuery代碼

$(“p”).prepend(“<b>ABC</b>”);

結(jié)果

<p><b>ABC</b>哈哈</p>

prependTo()該方法和Prepend()相反,a. Prepend (b)是將b前置到a中,而prependTo ()是將b前置到a中HTML代碼

 

<p>哈哈</p>

JQuery代碼

$(“<b>ABC</b>”).prependTo.(“p”);

結(jié)果

<p><b>ABC</b>哈哈</p>

After()在每個匹配的元素之后插入內(nèi)容,是之后HTML代碼

 

<p>AAA</p>

JQuery代碼

$(“p”).After(“<b>cc</b>”);

結(jié)果

<p>AAA</p><b>cc</b>

insertAfter()和After()相反HTML代碼

 

<p>AAA</p>

JQuery代碼

$ (“<b>cc</b>”).After(“p”);

結(jié)果

<p>AAA</p><b>cc</b>

Before()在每個匹配的元素之前插入內(nèi)容HTML代碼

 

<p>AAA</p>

JQuery代碼

$(“p”). Before (“<b>cc</b>”);

結(jié)果

<b>cc</b><p>AAA</p>

insertBefore()和Before()相反HTML代碼

 

<p>AAA</p>

JQuery代碼

$ (“<b>cc</b>”). insertBefore (“p”);

結(jié)果

<b>cc</b><p>AAA</p>

 

   好了,不要齋看,自己動手試試吧:)
   4.刪除元素節(jié)點(diǎn)
   由于我們需要經(jīng)常動態(tài)去改變DOM元素,因此Jquery提供了兩種刪除節(jié)點(diǎn)的方法,即remove()和empty();
    4.1 remove()方法
     $(“p”).remove();//    我們可以獲取到要刪除的元素,然后調(diào)用remove()方法
     $(“ul li:eq(0)”).remove().appendTo(“ul”);// 刪除ul下面的第一個li標(biāo)記,然后再把刪除的li標(biāo)記重新加到ul里面,remove()方法返回刪除元素的引用,這時你可以繼續(xù)使用
     $(“ul li”).remove(“l(fā)i[title!=ABC]“);//remove可以接受通過參數(shù)來選擇性的刪除符合條件的元素;
   4.2 empty()方法
     嚴(yán)格來講,empty()方法并不是刪除元素,而是清空
     例:
      HTML代碼
       <ul>
          <li title=”AAA”>AAA</li>
       </ul>
      JQuery代碼
       $(“ul li:eq(0)”).empty();
      結(jié)果
      <ul>
          <li title=”AAA”></li>
       </ul>
      記住,只會清空內(nèi)容,不會請空屬性;
本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點(diǎn)擊舉報(bào)。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
jQuery 學(xué)習(xí)筆記之六 (jQuery DOM的操作)
二. JQuery中的DOM操作
鋒利的jQuery學(xué)習(xí)筆記(4)-DOM操作
(jQuery中的DOM操作
jQuery性能優(yōu)化指南(2)
JS中獲取元素屬性的方法
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服