❶ js怎麼批量修改子元素樣式
<!DOCTYPE html>
<html>
<head></head>
<body>
<div id="div1">
<p>1</p>
<p>2</p>
<p>3</p>
<a>444</a>
</div>
<script type="text/javascript">
Array.from(document.getElementById("div1").children).forEach(function(item){
item.style.background = "#ff0000";
})
</script>
</body>
</html>
❷ JS修改CSS設置的樣式
語法:元素.style.樣式名=樣式值
注意:如果CSS的樣式名中含有-,這種名稱在JS中是不合法的,比如 background-color 。需要將這種樣式名修改為駝峰命名法:去掉-,然後將-後的第一個字母大寫,比如 backgroundColor
我們通過style屬性設置的樣式都是內聯樣式,而內聯樣式有較高的優先順序,所以通過JS修改的樣式往往會立即顯示
但是如果在樣式中寫了!important,則此時樣式會有最高的優先順序,即使通過JS也不能覆蓋該樣式,此時將會導致JS修改樣式失效
所以盡量不要為樣式添加!important
語法:元素.style.樣式名
通過style屬性設置和讀取的都是內聯樣式,無法讀取樣式表中的樣式
語法:元素.currentStyle.樣式名
如果當前元素沒有設置該樣式,則獲取它的默認值
例如: box1.currentStyle.width
這個方法是window的方法,可以直接使用需要兩個參數
第一個:要獲取樣式的元素
第二個:可以傳遞一個偽元素,一般都傳null
該方法會返回一個對象,對象中封裝了當前元素對應的樣式
可以通過對象﹒樣式名來讀取樣式
如果獲取的 樣式沒有設置 ,則會獲取到真實的值,而不是默認值
比如:沒有設置width,它不會獲取到auto,而是 一個長度
注意:通過currentStyle和getComputedstyle()讀取到的樣式都是只讀的,不能修改,如果要修改必須通過style屬性
參數:
obj 要獲取樣式的元素
name 要獲取的樣式名
❸ 用js可以改變網頁頭部css樣式嗎
可以用 改變,程序如下
<script type="text/javascript">
function change_css(n, css){ //n 為想改的第幾個, 0開始, css 為改變後的CSS文件路徑
var o;
o = document.getElementsByTagName('link')[n];
// 或是 link 裡面設置了 ID這個屬性可以改成
// o = document.getElementById(id)
o.href = css;
}
</script>
<input type="button" value="OnClick" onclick="change_css(0, 'new.css')" />
❹ 怎樣實現js改變class功能
用jquery很容易實現,你下個jquery庫,然後JS文件里寫這樣的代碼:
$(function(){
$('ul li').click(){
$(this).removeClass('w1');
$(this).addClass('w2');
}
});
大概是這樣,我好久沒回玩兒JQUERY,如果有問題答給我簡訊吧
❺ Js動態創建的元素,如何設置他們的樣式我知道委託可以綁定事件,但是不知道如何綁定樣式。
可以使用腳本框架,例如jQuery或國人的JSer,
設置樣式如:
jQuery: $(".ad").css("樣式名1", "樣式值").css("樣式名2", "樣式值");
如: $(".ad").css('background-color','red').css('color','green');
JSer除了像上面那樣寫外,還可以這樣:
JSer(".ad").css({backgroundColor:'red', color:'green'});
如果是綁定樣式名的話:
jquery: $(".ad").addClass("xxx").addClass("yyy");
JSer: JSer(".ad").addClass("xxx yyy");
看了下你的補充問題,你可以用JSer,像這樣做:
JSer.exec(function(){
setInterval(function(){
JSer(".ad").remove();
}, 500);
});
因為不清楚那個ad是什麼時候被創建的,因為有可能是網頁載入完後過幾秒創建的。所以上面的代碼創建一個定時器,直接將.ad廣告remove掉。
❻ js如何給目標元素的兄弟元素更改樣式
先獲取兄弟節點對象,然後再修改樣式。如:
vars=document.getElementById("test");
varns=s.nextSbiling;//獲得s的下一個兄弟節點
varps=s.previousSbiling;//得到s的上一個兄弟節點
ns.style.color='red';//字體顏色
ps.className='red';//更改class屬性
用jQuery也封裝了,很多操作樣式的方法。