English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Método simples de configuração de estilos CSS usando cssText no JavaScript

Se houver um elemento com id "no" na página, vamos considerar que é um tag div para tell;

Para definir estilos CSS deste div no JavaScript, a maneira mais comum é:

var obj = document.getElementByIdx_x_x('no');
obj.style.width = '"400px';
obj.style.height = '"300px';

Se precisar definir uma série de estilos CSS, é muito complicado.

Geralmente, combinam css para adicionar className ou mudar className para alcançar o efeito desejado, mas se você criar um elemento, quererá simplesmente isso? Então, precisa pensar em outra maneira~

Então, escreveram uma função atrás da outra, duas clássicas são:

var obj = document.getElementByIdx_x_x('no');
function setStyle(obj, css) {
for(var attr in obj){
obj.style[attr] = css[attr];
}
}
setStyle(obj,{width:"400px",height:"300px"});

Claro, há maneiras ainda mais simples, cssText:

var obj = document.getElementByIdx_x_x('no');
obj.style.cssText = "width:400px; height:300px;";

Claro, este método é muito simples e conveniente para inicializar estilos CSS para elementos criados.

Isso é tudo que o editor trouxe para você sobre a maneira simples de definir estilos CSS usando cssText no JavaScript, esperamos que ajude, apóie mais o tutorial gritar~

Você também pode gostar