jquery 提供了remove() 方法,用來移除被選元素,包括所有文本和子節點。因此只需根據添加的div的id即可將其刪除:
創新互聯專注于企業成都全網營銷推廣、網站重做改版、旅順口網站定制設計、自適應品牌網站建設、H5高端網站建設、商城建設、集團公司官網建設、外貿網站制作、高端網站制作、響應式網頁設計等建站業務,價格優惠性價比高,為旅順口等各大城市提供網站開發制作服務。
$(div_id).remove();
實例演示如下:
HTML結構
input?type="button"?value="刪除"
div?id="test"這是示例的DIV/div
jquery代碼
$(function(){?? $("input[type='button']").click(function()?{????????$("div#test").remove();?? });
添加元素的方法有好幾種:
append() - 在被選元素的結尾插入內容
prepend() - 在被選元素的開頭插入內容
after() - 在被選元素之后插入內容
before() - 在被選元素之前插入內容
如:
$("p").append("Some");
$("p").prepend("Some");
$("img").after("Some text after");
$("img").before("Some text before");
刪除元素/內容:
remove() - 刪除被選元素(及其子元素)
empty() - 從被選元素中刪除子元素
如:
$("#div1").remove();
$("#div1").empty();
1、首先jquery中有remove方法可以把元素從dom中刪除
2、想要獲取到添加的元素,那就得在添加完成之后獲取添加的元素,然后執行remove方法就會刪除掉添加的元素
寫個例子
$('.fix').append('span?class=“box”/span');//我添加了一個類名是box的span標簽
$('.box').remove();//在之后我獲取到改元素,執行remove方法,就會把類名是box的元素刪掉
要注意類名是否重復,不能誤刪,如果是這種需求的話,可以像這樣試一下
例如使用attr()方法來獲取p元素的class,JQuery代碼如下:var
p_class
=
$("p").attr("class");
//獲取p元素的class使用attr()方法來設置p元素的class,JQuery代碼如下:1
$("p").attr("'class",
"high");
//設置p元素的class為
"high"
在大多數情況下,它是將原來的class替換為新的class,而不是在原來的基礎上追加新的class。追加樣式
什么是追加class呢?假如p元素原本的class為myClass,那么追加一個名叫high的class后,class屬性變為
“myClass
high”,即myClass和high兩種樣式的疊加。JQuery提供了專門的addClass()方法來追加樣式。為了使例子更容易理解,首先在
style標簽里添加另一組樣式:1
.high{
color:red;
}
2
.another{
font-style:italic;
color:blue;
}
然后在網頁中添加一個“追加class類”的按鈕,按鈕的事件代碼如下:1
$("#btn_3").click(function(){
2
$("#nm_p").addClass("another");
//
追加樣式
3
});
最后當單擊“追加class類”按鈕時,p元素樣式就會變為斜體,而先前的紅色字體也會變為藍色。此時p元素同時擁有兩個class值,即"high"和"another"。在CSS中有以下兩條規定。1.如果給一個元素添加了多個class值,那么就相當于合并了它們的樣式。
2.如果有不同的class設定了同一樣式屬性,則后者覆蓋前者。
在上例中,相當于給p元素添加了如下樣式:1
color
:
red;
/*
字體顏色設置紅色*/
2
font-style:italic;
3
color:blue;
在以上的樣式中,存在兩個“color”屬性,而后面的“color”屬性會覆蓋前面的“color”屬性,因此最終的“color”屬性的值為“blue”,而不是“red”。移除樣式
如果用戶單擊某個按鈕時,要刪除class的某個值,那么可以使用與addClass()方法相反的removeClass()方法來完成,它的
作用是從匹配的元素中刪除全部或者指定的class。例如可以使用如下的JQuery代碼來刪除p元素中值為“high”的class:1
$("p").removeClass("high");
//移除p元素中值為"high"的class
如果要把p元素的兩個class都刪除,就要使用兩次removeClass()方法,代碼如下:1
$("p").removeClass("high").removeClass("another");
JQuery提供了更簡單的方法。可以以空格的方式刪除多個class名,代碼如下:1
$("p").removeClass("high
another");
另外,還可以利用removeClass()方法的一個特性來完成同樣的效果。當它不帶參數時,就會將class的值全部刪除,JQuery代碼如下:1
$("p").removeClass();
//移除p元素的所有class
切換樣式
JQuery中有一個方法toggle(),JQuery代碼如下:
1
toggleBtn.toggle(function(){
2
//元素顯示
代碼③
3
},
function(){
4
//元素隱藏
代碼④
5
})
toggle()方法此處的作用是交替執行代碼③和代碼④兩個函數,如果元素原來是顯示的,則隱藏它:如果元素原來是隱藏的,則顯示它。此時,toggle()方法主要是控制行為上的重復切換。另外JQuery還提供了一個toggleClass()方法控制樣式上的重復切換。如果類名存在則刪除它,如果類名不存在則添加它。例如對p元素進行toggleClass()方法操作。1
$("p").toggleClass("another");
//重復切換類名“another”
當不斷單擊“切換樣式”按鈕時,p元素的class的值就會在“myClass”和“myClass
another”之間重復切換。判斷是否含有某個樣式
hasClass()可以用來判斷元素中是甭含有某個class,如果有,則返回true,否則返回false。例如可以使用下面的代碼來判斷p元素中是否含有“another”的class:1
$("p").hasClass("another");
這個方法是為了增強代碼可讀性面產生的。
分享題目:jquery添加刪除,jquery添加刪除記錄的題目
標題網址:http://vcdvsql.cn/article2/dsdgsoc.html
成都網站建設公司_創新互聯,為您提供軟件開發、外貿建站、域名注冊、網站策劃、全網營銷推廣、網頁設計公司
聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯