欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery學(xué)習(xí)3：操作元素屬性和特性

 更新時(shí)間：2010年02月07日 10:09:42   投稿：mdxy-dxy  
今天主要總結(jié)一下jQuery操作元素屬性的一些知識(shí)，學(xué)習(xí)jquery的朋友可以參考下

先看一個(gè)例子：

復(fù)制代碼 代碼如下:

<a id="easy" href="#">http://www.dbjr.com.cn</a>現(xiàn)在要得到a標(biāo)簽的屬性id。有如下方法：

復(fù)制代碼 代碼如下:

jQuery("#easy").click(function() {
    alert(document.getElementById("easy").id); //1
    alert(this.id); //2
    alert(jQuery(this).attr("id"));  //3
});

方法1使用的是javascript原始方法；方法2用到了this，this就相當(dāng)于一個(gè)指針，返回的是一個(gè)dom對(duì)象，本例中返回a標(biāo)簽對(duì)象。所以this.id可直接得到id。方法3將dom對(duì)象轉(zhuǎn)換成了jQuery對(duì)象，再利用jQuery封裝的方法attr()得到a標(biāo)簽的ID。

可見(jiàn)，有時(shí)候用javascript配合jQuery會(huì)很方便。下邊著重總結(jié)一下jQuery操作元素屬性。

◦attr(name)             取得元素的屬性值
◦attr(properties)    設(shè)置元素屬性，以名/值形式設(shè)置
◦attr(key,value)       為元素設(shè)置屬性值
◦removeAttr(name) 移除元素的屬性值

下邊以實(shí)例說(shuō)明每種方法的具體用法。

復(fù)制代碼 代碼如下:

<div id="test">
    <a id="hyip" href="javascript:void(0)">腳本之家</a>
    <a id="baidu" href="javascript:void(0)">百度</a>
    <img id="show" />
</div>

復(fù)制代碼 代碼如下:

jQuery("#test a").click(function() {
    //得到ID
    jQuery(this).attr("id"); //同this.id

    //為img標(biāo)簽設(shè)置src為指定圖片;title為百度.
    var v = { src: "http://www.baidu.com/img/bdlogo.gif", title: "百度" };
    jQuery("#show").attr(v);

    //將img的title設(shè)置為baidu，同上邊的區(qū)別是每次只能設(shè)定一個(gè)屬性
    jQuery("#show").attr("title", "baidu");

    //移除img的title屬性
    jQuery("#show").removeAttr("title");
});

大家可能已經(jīng)發(fā)現(xiàn)了，在jQuery中attr()方法，既可以獲得元素的屬性值，又能設(shè)置元素的屬性值。是的，在jQuery中，類似的方法還有很多，現(xiàn)在將它們總結(jié)下來(lái)，以后用起來(lái)也會(huì)比較容易。

方法有：

◦html()  獲取或設(shè)置元素節(jié)點(diǎn)的html內(nèi)容
◦text()  獲取或設(shè)置元素節(jié)點(diǎn)的文本內(nèi)容
◦height()  獲取或設(shè)置元素高度
◦ width()  獲取或設(shè)置元素寬度
◦ val()  獲取或設(shè)置輸入框的值

以html()為例，其余的相似：

復(fù)制代碼 代碼如下:

<div id="showhtml">baidu</div>

復(fù)制代碼 代碼如下:

//獲得html，結(jié)果為baidu
jQuery("#showhtml").html();
//設(shè)置html，結(jié)果為I love baidu
jQuery("#showhtml").html("I love baidu");

以上這些就是jQuery操作元素屬性的一些基本方法了，經(jīng)過(guò)本次的總結(jié)，相信大家在使用jQuery時(shí)，會(huì)更加的熟練。

以下是其它網(wǎng)友的補(bǔ)充：

下面就列出jQuery中提供的方法：

操作元素屬性：each(iterator)遍歷包裝集里所有元素，為各元素分別調(diào)用傳遞進(jìn)來(lái)的迭代器函數(shù)。參數(shù)iterator 一個(gè)函數(shù)，為匹配集中的各元素分別調(diào)用一次。傳遞到函數(shù)的參數(shù)被設(shè)置為包裝集里當(dāng)前元素的下標(biāo)（從0開(kāi)始），而當(dāng)前元素可通過(guò)函數(shù)this屬性來(lái)訪問(wèn)。

復(fù)制代碼 代碼如下:

$('img').each(function(n){
this.alt='This is image['+n+'] with an id of'+this.id;
})

獲取特性值：attr(name)獲取指派到包裝集里第一個(gè)元素指定特性的值。參數(shù) name為特性的名稱，該特性的值將被獲取。如果沒(méi)有該特性則返回undefined值。

<img id="myImage" src="image.gif" alt="An image" class="someClass" title="This is an image" custom="some value">

$("#myImage").attr("custom") 得到值就是some value。

設(shè)置特性值：attr(name,value)為包裝集里的所有元素的name特性設(shè)置傳遞進(jìn)來(lái)的值。name將被設(shè)置的特性的名稱，value指定特性的值。

復(fù)制代碼 代碼如下:

$('*').attr('title',function(index) {
　　return 'I am element' '+ index +' and my name is ' +(this.id?this.id:'unset');
});

該函數(shù)是設(shè)置頁(yè)面上的所有元素的title特性為一個(gè)字符串。由DOM中元素的下標(biāo)和各個(gè)特定元素id特性值所組成的字符串。

attr()還可以一次設(shè)置多個(gè)特性到包裝集里所有元素的快速簡(jiǎn)便的方式。attr(attributes)。

復(fù)制代碼 代碼如下:

$('input').attr(
{value:'',title:'please enter a value'}
);

該函數(shù)把所有<input>元素的value設(shè)置為空字符串，同時(shí)把title設(shè)置為字符串Please enter a value。

相關(guān)文章

最新評(píng)論