国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

JavaScript中獲取樣式的原生方法小結

2019-11-20 14:04:17
字體:
來源:轉載
供稿:網友

ps:是獲取樣式,不是設置樣式。若沒有給元素設置樣式值,則返回瀏覽器給予的默認值。(論壇整理)

1、element.style:只能獲取寫在元素標簽中的style屬性里的樣式值,無法獲取到定義在<style></style>和通過<link href=”css.css”>加載進來的樣式屬性

復制代碼 代碼如下:

var ele = document.getElementById('ele');
ele.style.color;    //獲取顏色

2、window.getComputedStyle():可以獲取當前元素所有最終使用的CSS屬性值。

復制代碼 代碼如下:
window.getComputedStyle("元素", "偽類");

這個方法接受兩個參數:要取得計算樣式的元素和一個偽元素字符串(例如“:before”) 。如果不需要偽元素信息,第二個參數可以是null。也可以通過document.defaultView.getComputedStyle(“元素”, “偽類”);來使用
復制代碼 代碼如下:

var ele = document.getElementById('ele');
var styles = window.getComputedStyle(ele,null);
styles.color;  //獲取顏色

可以通過style.length來查看瀏覽器默認樣式的個數。IE6-8不支持該方法,需要使用后面的方法。對于Firefox和Safari,會把顏色轉換成rgb格式。

3、element.currentStyle:IE 專用,返回的是元素當前應用的最終CSS屬性值(包括外鏈CSS文件,頁面中嵌入的<style>屬性等)。

復制代碼 代碼如下:

var ele = document.getElementById('ele');
var styles = ele.currentStyle;
styles.color;

注意:對于綜合屬性border等,ie返回undefined,其他瀏覽器有的返回值,有的不返回,但是borderLeftWidth這樣的屬性是返回值的

4、getPropertyValue():獲取CSS樣式的直接屬性名稱

復制代碼 代碼如下:

var ele = document.getElementById('ele');
window.getComputedStyle(ele,null).getPropertyValue('color');

注意:屬性名不支持駝峰格式,IE6-8不支持該方法,需要使用下面的方法

5、getAttribute():與getPropertyValue類似,有一點的差異是屬性名駝峰格式

復制代碼 代碼如下:

var test = document.getElementById('test');
window.getComputedStyle(test, null).getPropertyValue("backgroundColor");

注意:該方法只支持IE6-8。

下面的獲取樣式方法兼容IE、chrome、FireFox等

復制代碼 代碼如下:

function getStyle(ele) {
     var style = null;
    
    if(window.getComputedStyle) {
         style = window.getComputedStyle(ele, null);
     }else{
         style = ele.currentStyle;
     }
    
    return style;
}

在JQuery中,常用css()獲取樣式屬性,其底層運作就應用了getComputedStyle以及getPropertyValue方法。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 深州市| 和平县| 西贡区| 东阳市| 尼木县| 肇庆市| 平凉市| 湖南省| 黄龙县| 南阳市| 常德市| 三门县| 平果县| 巫山县| 泸水县| 长宁县| 个旧市| 玉林市| 肃宁县| 龙山县| 洛阳市| 柳河县| 石棉县| 宕昌县| 白河县| 兴宁市| 蒲江县| 资中县| 张家界市| 于田县| 内江市| 安顺市| 吴堡县| 澄迈县| 凤凰县| 秦皇岛市| 昌黎县| 景宁| 临邑县| 彰化市| 柳江县|