13518219792
选中标签，然后用style设置样式
成都网络公司-成都网站建设公司成都创新互联公司十多年经验成就非凡，专业从事成都做网站、网站建设，成都网页设计，成都网页制作，软文发布平台，1元广告等。十多年来已成功提供全面的成都网站建设方案，打造行业特色的成都网站建设案例，建站热线：028-86922220，我们期待您的来电！
div id="h5course"HTML5学堂（WX号），技术干货文章分享/div
script
var box = document.getElementById('h5course');
box.style.color = '#39f';
box.style.border = '2px solid #000';
/script
如果网页中一个
id为“no”的标签，暂且当div标签来tell；
想要在js中设置这个div的css样式，很一般的做法是：
var
obj
=
document.getElementByIdx_x_x('no');
obj.style.width
=
'400px';
obj.style.height
=
'300px';
如果要设置一堆又一堆的css样式呢，太麻烦了把、
一般情况下都会结合css来添加className或者改变className达到想要的效果，但是如果你create一个元素，难道还想这样简单点？那就要想别的办法了~
于是大家就写了一个又一个的函数，经典的两个是：
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"});
当然还有更简单的，cssText：
var
obj
=
document.getElementByIdx_x_x('no');
obj.style.cssText
=
"width:400px;
height:300px;";
当然这种方法对于create的元素初始化css样式来说很简单很方便。
以上就是小编为大家带来的js中用cssText设置css样式的简单方法的全部内容了，希望对大家有所帮助，多多支持脚本之家~
动态加载外部css样式及css样式，参考代码如下：
// 动态加载外部js文件
var flag = true;
if( flag ){
loadScript( "js/index.js" );
};
function loadScript( url ){
var script = document.createElement( "script" );
script.type = "type/javascipt";
script.src = url;
document.getElementsByTagName( "head" )[0].appendChild( script );
};
// 动态加载js
if( flag ){
var script = document.createElement( "script" );
script.type = "text/javascript";
script.text = " ";
document.getElementsByTagName( "head" )[0].appendChild( script );
};
// 动态加载外部css样式
if( flag ){
loadCss( "css/base.css" );
};
function loadCss( url ){
var link = document.createElement( "link" );
link.type = "text/css";
link.rel = "stylesheet";
link.href = url;
document.getElementsByTagName( "head" )[0].appendChild( link );
};
// 动态加载css样式
if( flag ){
var style = document.createElement( "style" );
style.type = "text/css";
document.getElementsByTagName( "head" )[0].appendChild( style );
var sheet = document.styleSheets[0];
insertRules( sheet,"#gaga1","background:#f00",0 );
};
function insertRules( sheet,selectorTxt,cssTxt,position ){
if( sheet.insertRule ){ // 判断非IE浏览器
sheet.insertRule( selectorTxt + "{" + cssTxt +"}" ,position );
}else if( sheet.addRule ){ //判断是否是IE浏览器
sheet.addRule( selectorTxt ,cssTxt ,position )
}
}
js是无法直接修改css文件的，但可以通过取对象的方式修改对象的样式，通常有两种方法：
1、改变className，但首先在样式表中预设定样式类。
例如：document.getElementById('obj').className='...';
2、改变cssText。
例如：document.getElementById('obj').style.height='100px';
在页面内用JS操作CSS除非用AJAX，但操作页面内的样式的话，是可以的。操作样式分为改变直接样式，改变className和改变cssText三种
一、局部改变样式
调用方法：
改变className
div id="demo"测试/div
script
document.getElementById('demo').className="test";
/script
改变直接样式
div id="demo"测试/div
script
document.getElementById('obj').style.backgroundColor="#003366";
/script
二、全局改变样式
可以通过改变外链样式的的href的值实现网页样式的实时切换
link rel = "stylesheet" type="text/css" id="css" href="firefox.css" /
span on click="javascript:document.getElementById('css').href = 'ie.css'"点我改变样式/span
