JQuery總結二 樣式篇

2021-08-18 12:58:25 字數 1890 閱讀 5409

基礎-樣式篇

1.引入

2.獲取特定dom節點

$('*')  所有元素引用

$('div')   所有div的引用

$('#idname')  獲取id為idname的引用

$('.classname')  獲取class為classname的引用

$(this)    把js裡的this指標包裝成jq物件

3.操作節點(可以連續操作節點)

$('#idname').html();  獲取html文件結構

$('#idname').html('this is the new content!');  重寫html文件結構

$('#idname').text();  獲取文字內容

$('#idname').text('this is the new content!');  重寫文字內容

$('#idname').val();  獲取value值(表單元素的)

$('#idname').val('new value');  重置value值(表單元素的)

$('#idname').css('color','red');   重置樣式

$('div').get(0);   獲取第乙個div(返回html物件)

$('div').eq(0);   獲取第乙個div(返回jq物件)

$('input:checkbox').attr('checked','true');   設定屬性

$('input:checkbox').attr('checked');   獲取屬性

$('input:checkbox').

removeattr

('checked');   刪除屬性

4.事件

//頁面載入完成

$(document).ready(function()

});14.刪除樣式

$('p').removeclass(classname)  刪除類

$('.right > div:first').removeclass(function(index,classname));

15.樣式切換

$('p').toggleclass(classname);    有則刪除類,無則加上類

$('p').toggleclass(classname,true);    true則p應該儲存類,false則刪除類

16.操作css

$('p').css('color')   獲得計算後的color值

$('p').css(['color','position']);  獲取多個css值

$('p').css('color','red');   設定color值

$('p').css();   傳入乙個物件,同時設定多個樣式

17.資料儲存

$('.right').click(function() );

//通過.data方式取出資料

var reset = ele.data("a") + "

" + ele.data("b").name

})其他

//選中所有緊接著沒有checked屬性的input元素後的p元素,賦予顏色

$('input:not(:checked) + p ').css("background-color", "#cd00cd");

//查詢所有class='div'中dom元素中包含"contains"的元素節點

並且設定顏色

$(".div:contains(':contains')").css("color", "#cd00cd");

//查詢所有class='div'中dom元素中包含"span"的元素節點

並且設定顏色

$('.div:has(span)').css("color", "blue");

html系統學習之二 《樣式,錨》

參考資料 w3school 測試錨html樣式其實就是指元素的style屬性,它提供了一種改變所有 html 元素的樣式的通用方法。注意樣式的寫法,首先在是乙個屬性,所以最外層是 style 引號裡面的寫法注意了,形式為 屬性 值 其中值不需要引號,用分號隔開,看個例子 style backgrou...

jQuery 4 樣式操作

一.操作css方法 jquery可以使用css方法來修改簡單元素樣式 也可以操作類,修改多個樣式。1.引數只寫屬性名,則是返回屬性值 i f this css color 2.引數是屬性名,屬性值,逗號分隔,是設定一組樣式,屬性必須加引號,值如果是數字可以不用跟單位和引號 this css colo...

JQuery知識快覽之四 樣式

前面我們獲取了物件集,本文介紹怎麼控制物件集的樣式 在乙個html頁面中,我們有兩種方式來控制乙個物件的樣式,用html attribute控制,或者用css類來控制,這兩種方法雖然都能控制物件的樣式,但是通過css來控制物件的樣式,將內容和呈現分離開來是更為推薦的一種方法。jquery提供了豐富的...