CSS操作与属性设置方法概览.pdfVIP

一、层叠样式CSS设置

1利用ID来获取元素，改变样式

2或者用className设置class类

3更改或获取或设置某个属性的值：设置

document.styheets[[]].ru[[].style.值。样式表

的集合为styheets，样式表的规则集合为ru。

Demo:!DOCTYPEHTMLhtmll

angzh‑CNheadmetacharset

UTF‑8title文档对象的样式操作/

titlestyletypetext/css#first{

width:200px;height:200px;

border:1pxsolidgreen;color:#aaa;}

/stylescripttypet

ext/javascriptfunctioncssrule

(a,b){varaa||0;varbb||0;

一、层叠样式CSS设置

1利用ID来获取元素，改变样式

2或者用className设置class类

3更改或者获取或者设置某个属性的值

设置document.styheets[下标].ru[下标].style.属性值

样式表的集合styheets

样式表的ru规则集合

Demo:

!DOCTYPEHTML

htmllang=en-US

head

metacharset=UTF-8

title文档对象的样式操作/title

styletype=text/css

#first{

width:200px;

height:200px;

border:1pxsolidgreen;

color:#aaa;

}

/style

scripttype=text/javascript

functioncssrule(a,b){

vara=a||0;

varb=b||0;

if(document.all){//IEreturndocument.styheets[a].

ru[b].style;}else{returndocument.styheets[a].

cssRu[b].style;//FF}}window.onloadfunction(){var

firstdocument.getElementById(first);varmyone

document.getElementById(myone);varbtn

document.getElementById(btn);btn.onclickfunction(){//

alert(cssrule().width);//第一个style中规则width

cssrule().width400px;//改变宽度}}/script/head

bodydividfirsth3我是大黑哥/h3/divinputtype

buttonvalue移动idbtn/dividmyone/div/

body/html

4动态添加和删除样式CSS

添加document.styheets[下标].insertRule(‘选择器{属性:值}’,位

置);FF删除delete(document.styheets[下标].deleteRule(‘位置’));