JS設定CSS樣式的幾種方式

1. 直接設定style的屬性某些情況用這個設定 !important值無效

如果屬性有'-'號，就寫成駝峰的形式（如textalign）  如果想保留 - 號，就中括號的形式  element.style['text-align'] = '100px';

element.style.height = '100px';

element.setattribute('height', 100);

element.setattribute('height', '100px');

element.setattribute('style', 'height: 100px !important');

element.style.setproperty('height', '300px', 'important');

因js獲取不到css的偽元素，所以可以通過改變偽元素父級的class來動態更改偽元素的樣式

element.classname = 'blue';

element.classname += 'blue fb';

element.style.csstext = 'height: 100px !important';

element.style.csstext += 'height: 100px !important';

function addnewstyle(newstyle) 

}addnewstyle('.box ');

8. 使用addrule、insertrule

// 在原有樣式操作

document.stylesheets[0].addrule('.box', 'height: 100px');

document.stylesheets[0].insertrule('.box ', 0);

// 或者插入新樣式時操作

var styleel = document.createelement('style'),

stylesheet = styleel.sheet;

stylesheet.addrule('.box', 'height: 100px');

stylesheet.insertrule('.box ', 0);

筆記 JS設定CSS樣式的幾種方式

用js來動態設定css樣式，常見的有以下幾種 1.直接設定style的屬性 某些情況用這個設定 important值無效 如果屬性有 號，就寫成駝峰的形式 如textalign 如果想保留 號，就中括號的形式 element.style text align 100px element.style....

原生JS設定CSS樣式的幾種方式

用js來動態設定css樣式，常見的有以下幾種 1.直接設定style的屬性 某些情況用這個設定 important值無效 如果屬性有 號，就寫成駝峰的形 式 如textalign 如果想保留 號，就中括號的形式 element.style text align 100px element.style...

Js中設定css樣式

css div.style style js window.onload function false script html div 按鈕 button body 方法1.使用obj.style來修改css obj.style.屬性名 屬性值 此方法設定的是內聯樣式，而且有 時需要使用駝峰命名法 ...