jquery怎么獲取style里面的屬性值

jquery獲取style的屬性值有兩種方法

成都創(chuàng)新互聯(lián)公司專注于企業(yè)成都營銷網(wǎng)站建設(shè)、網(wǎng)站重做改版、海東網(wǎng)站定制設(shè)計、自適應(yīng)品牌網(wǎng)站建設(shè)、H5建站、商城網(wǎng)站開發(fā)、集團(tuán)公司官網(wǎng)建設(shè)、外貿(mào)營銷網(wǎng)站建設(shè)、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁設(shè)計等建站業(yè)務(wù)，價格優(yōu)惠性價比高，為海東等各大城市提供網(wǎng)站開發(fā)制作服務(wù)。

第一種是getElementById() 方法。它可以返回對擁有指定 ID 的第一個對象的引用。在操作文檔的一個特定的元素時，最好給該元素一個 id 屬性，為它指定一個（在文檔中）唯一的名稱，然后就可以用該 ID 查找想要的元素。

第二種是getElementsByName() 方法，它可以返回帶有指定名稱的對象的集合。該方法與getElementById() 方法相似，但是它查詢元素的 name 屬性，而不是 id 屬性。另外，因為一個文檔中的 name 屬性可能不唯一（如 HTML 表單中的單選按鈕通常具有相同的 name 屬性），所有 getElementsByName() 方法返回的是元素的數(shù)組，而不是一個元素。

jquery如何獲取頁面使用指定樣式的個數(shù)

思路：在頁面設(shè)計時就將指定的樣式設(shè)置為一個class，然后應(yīng)用到需要的元素上。那么此時可以通過類選擇器來獲取使用指定樣式的個數(shù)

$("some_class").length;??//?獲取應(yīng)用了some_class的元素的個數(shù)

實例演示：本例將紅色設(shè)置為一個類 red，并應(yīng)用到不同的元素中去，然后可以通過上述方法獲取應(yīng)用的個數(shù)

創(chuàng)建Html元素

div?class="box"

span?class="red"點擊按鈕獲取應(yīng)用了紅色樣式的元素的個數(shù)：/spanbr

div?class="content"

table

trtd1/tdtd2/tdtd3/td/tr

trtd4/tdtd?class="red"5/tdtd6/td/tr

trtd7/tdtd8/tdtd9/td/tr

/table

ul

??liGlen/li

??li?class="red"Tane/li

??liJohn/li

??li?class="red"Ralph/li

/ul

/div

input?type="button"?value="獲取應(yīng)用了紅色樣式的元素的個數(shù)"

/div

設(shè)置css樣式

div.box{width:300px;padding:20px;margin:20px;border:4px?dashed?#ccc;}

div.boxspan{color:#999;font-style:italic;}

div.content{width:250px;margin:10px?0;padding:20px;border:2px?solid?#ff6666;}

table{border-collapse:collapse;}

td{width:30px;height:30px;line-height:30px;text-align:center;border:1px?solid?green;}

li{margin:5px;list-style:?none;}

.red{color:red?!important;}

編寫jquery代碼

$(function(){?

$("input:button").click(function()?{

alert($(".red").length);

});

});

觀察效果

jquery怎么獲取下一個具有指定樣式（class）的元素呢？

分為以下2種情況：?

1.如果css寫成行內(nèi)樣式，可以通過獲取style屬性的值來判斷，示例如下：?

判斷id為divid的div元素是否有font-size樣式：

2.如果css寫成類樣式，可以通過獲取class屬性的值來判斷，示例如下：?

判斷id為divid的div元素是否含有類樣式divclass：

描述: 為每個匹配的元素添加指定的樣式類名

$('div').addClass('className');//為所有div添加名為className的class1

removeClass?

描述: 移除集合中每個匹配元素上一個，多個或全部樣式。

$('div').removeClass('className');//將所有div上名為className的class移除1

toggleClass?

描述: 在匹配的元素集合中的每個元素上添加或刪除一個或多個樣式類,取決于這個樣式類是否存在或值切換屬性。即：如果存在（不存在）就刪除（添加）一個類。

$('div').toggleClass('className');//如果div上有這個class就刪除，沒有就添加。

jQuery獲取CSS樣式中的顏色值的問題,不同瀏覽器格式不同的解決辦法

使用jQuery獲取樣式中的background-color的值時發(fā)現(xiàn)在獲取到的顏色值在IE10以下版本中是以HEX格式顯示【#ffff00】，而IE10,、Chrome、Firefox中則是以GRB格式顯示【rgb(255,0,0)】，由于需要對顏色值進(jìn)行判斷處理，所以需要得到統(tǒng)一的顏色格式，最好是HEX格式的，方便處理點。搜索了一下，從國外的一個網(wǎng)站上得到一段代碼：

復(fù)制代碼

代碼如下:

$.fn.getHexBackgroundColor

=

function()

{

var

rgb

=

$(this).css('background-color');

rgb

=

rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);

function

hex(x)

{return

("0"

+

parseInt(x).toString(16)).slice(-2);}

return

rgb=

"#"

+

hex(rgb[1])

+

hex(rgb[2])

+

hex(rgb[3]);

}

上面定義的是一個jQuery函數(shù)，我們可以通過

$("#bg").getHexBackgroundColor();

獲取到標(biāo)簽id="bg"的background-color的RGB值。

下面做一下小小的修改，就是加一個判斷，如果是顯示HEX值（IE10以下）就直接拿值，如果是非IE瀏覽器則將值轉(zhuǎn)換成RGB格式：

復(fù)制代碼

代碼如下:

$.fn.getBackgroundColor

=

function()

{

var

rgb

=

$(this).css('background-color');

if(rgb

=

0)

return

rgb;//如果是一個hex值則直接返回

else{

rgb

=

rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);

function

hex(x)

{return

("0"

+

parseInt(x).toString(16)).slice(-2);}

rgb=

"#"

+

hex(rgb[1])

+

hex(rgb[2])

+

hex(rgb[3]);

}

return

rgb;

}

jQuery中,$(“p”).css()方法是設(shè)置或獲取對象的樣式屬性的。A、對B、錯？

對，使用css()可以實現(xiàn)，寫兩個參數(shù)是設(shè)置，寫一個參數(shù)是獲取。

但是獲取的樣式不一定全等于設(shè)置的，比如顏色，設(shè)置是“red”，獲取是rgb(255, 0, 0)

JQuery中如何獲取樣式屬性的值？

css方法：

1、取得第一個段落的color樣式屬性的值。

$("p").css("color");

2、將所有段落的字體顏色設(shè)為紅色并且背景為藍(lán)色。

$("p").css({?color:?"#ff0011",?background:?"blue"?});

html

head

titleJQuery中如何獲取樣式屬性的值/title

script?type="text/javascript"?src="jquery.js"/script

style

.top?{

background:?url(Tupian.jpg)?no-repeat;

width:?75px;

height:?90px;

}

/style

script?type="text/javascript"

$(function?()?{

var?url?=?$("div.top").css("background-image");

alert(url);

})

/script

/head

body

div?class="top"/div

/body

/html

本文題目：jquery獲取樣式,jquery獲取樣式屬性值
瀏覽地址：http://chinadenli.net/article44/dsgcdhe.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供微信公眾號、用戶體驗、網(wǎng)站營銷、網(wǎng)站排名、企業(yè)網(wǎng)站制作、網(wǎng)站內(nèi)鏈

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)