04 jQuery的屬性操作

2022-09-06 12:54:26 字數 1816 閱讀 5402

jquery的屬性操作模組分為四個部分:html屬性操作,dom屬性操作,類樣式操作和值操作

設定屬性值或者 返回被選元素的屬性值

//獲取值:attr()設定乙個屬性值的時候 只是獲取值

var id = $('div').attr('id')

console.log(id)

var cla = $('div').attr('class')

console.log(cla)

//設定值

//1.設定乙個值 設定div的class為box

$('div').attr('class','box')

//2.設定多個值,引數為物件,鍵值對儲存

移除屬性

//刪除單個屬性

$('#box').removeattr('name');

$('#box').removeattr('class');

//刪除多個屬性

$('#box').removeattr('name class');

prop() 方法設定或返回被選元素的屬性和值。

當該方法用於返回屬性值時,則返回第乙個匹配元素的值。

當該方法用於設定屬性值時,則為匹配元素集合設定乙個或多個屬性/值對。

語法:返回屬性的值:

$(selector).prop(property)
設定屬性和值:

$(selector).prop(property,value)
設定多個屬性和值:

$(selector).prop()

男女提交

1.是有true,false兩個屬性使用prop();

2.其他則使用attr();

為每個匹配的元素新增指定的類名。

$('div').addclass("box");//追加乙個類名到原有的類名
還可以為匹配的元素新增多個類名

$('div').addclass("box box2");//追加多個類名
從所有匹配的元素中刪除全部或者指定的類。

移除指定的類(乙個或多個)

$('div').removeclass('box');
移除全部的類

$('div').removeclass();
可以通過新增刪除類名,來實現元素的顯示隱藏

**如下:

var tag  = false;

$('span').click(function()else

})

**如下:

如果存在(不存在)就刪除(新增)乙個類。

語法:toggleclass('box')

$('span').click(function())
獲取值:

語法;html() 是獲取選中標籤元素中所有的內容

$('#box').html();
設定值:設定該元素的所有內容 會替換掉 標籤中原來的內容

獲取值:

text() 獲取匹配元素包含的文字內容

語法:

$('#box').text();
設定值:

設定該所有的文字內容

注意:值為標籤的時候 不會被渲染為標籤元素 只會被當做值渲染到瀏覽器中

獲取值:

val()用於表單控制項中獲取值,比如input textarea select等等

設定值:

$('input').val('設定了表單控制項中的值');

04 jQuery的屬性操作

jquery的屬性操作模組分為四個部分 html屬性操作,dom屬性操作,類樣式操作和值操作 設定屬性值或者 返回被選元素的屬性值 獲取值 attr 設定乙個屬性值的時候 只是獲取值 var id div attr id console.log id var cla div attr class c...

04 jQuery的屬性操作

jquery的屬性操作模組分為四個部分 html屬性操作,dom屬性操作,類樣式操作和值操作 設定屬性值或者 返回被選元素的屬性值 獲取值 attr 設定乙個屬性值的時候 只是獲取值 var id div attr id console.log id var cla div attr class c...

04 jQuery擴充套件

原理 我們只需要以固定的時間間隔 例如,0.1秒 每次dom元素的css樣式修改一點 例如,高寬各增加10 看起來就像動畫了 裡面寫最終效果 dom元素的css樣式 time表示時間,毫秒為單位,1秒 1000毫秒。如 dd animate 3000 3秒內,寬高都變成100px,透明度為50 fu...