css 更改text样式,JavaScript 中用 cssText 设置 CSS 样式

如果网页中一个 id 为“id1”的标签；

想要在 JavaScript 中设置这个元素的 CSS 样式，很一般的做法是：var obj = document.getElementById("id1");

obj.style.width = "400px";

obj.style.height = "300px";

如果要设置一堆又一堆的 CSS 样式呢，太麻烦了吧。

一般情况下都会结合 CSS 来添加 className 或者改变 className 达到想要的效果，但是如果你 create 一个元素，难道还想这样简单点？那就要想别的办法了。

于是大家就写了一个又一个的函数，经典的两个是：var obj = document.getElementById("id1");

function setStyle(obj, css)

{

for(var attr in obj)

{

obj.style[attr] = css[attr];

}

setStyle(obj, { width:"400px", height:"300px" } );

当然还有更简单的，cssText：var obj = document.getElementById("div1");

obj.style.cssText = "width:400px; height:300px;";

当然这种方法对于create的元素初始化css样式来说很简单很方便。

(cssText 的本质就是设置元素的 style 属性。千一网络编辑注)

css 更改text样式,JavaScript 中用 cssText 设置 CSS 样式相关推荐

html js 设置样式,原生js设置样式笔记：JS设置CSS样式的几种方式
document(id名).style.backgroundColor = "ren" css里的属性有-的就去掉将首字母大写. js如何添加CSS样式中的class添加属性用J ...
【响应式Web前端设计】css如何设置边框的圆角样式？border-radius属性设置圆角样式（图文）
border-radius包含5种设置圆角样式方式: border-radius :同时设置4个边框的圆角样式. border-top-left-radius :设置左上角边框的圆角样式. borde ...
jquery 判断控件css样式,jQuery获取并设置CSS类
jQuery获取并设置CSS类通过 jQuery,可以很容易地对 CSS 元素进行操作. jQuery 操作 CSS jQuery 拥有若干进行 CSS 操作的方法.我们将学习下面这些: • add ...
html字体下划线下移,CSS下划线与文字间距距离设置(CSS文字下划线距离设置)
CSS设置下划线与文字间距距离(CSS文字下划线距离设置) css下划线与文字上下距离设置,文字字体下划线样式技巧篇,如何改变文字与下划线距离间距?这里CSS5为大家介绍通过下边框border-bot ...
wpf修改theme中的样式_WPF Mahapps.Metro 设置主题样式
/// /// 设置App样式 /// /// 窗口标题栏样式 /// 背景样式 private void ChangeTheme(string accentName, string themeNam ...
实现js动态设置css样式，js动态设置全局样式主题色
需求: 1.设置一个全局的样式 2. 样式是需要动态改变的,改变的内容是通过请求后台接口获取的,因此需要js能够对css进行改变实现: 或许你可能不相信,代码只需要几行 js代码: // 设置主题色 ...
【CSS】盒子模型圆角边框 ( 通过设置 border-radius 样式设置圆角矩形圆角半径 )
文章目录一.盒子模型圆角边框二.代码示例 1.代码示例 - 正常矩形边框 2.代码示例 - 圆形边框 3.代码示例 - 圆角矩形边框 4.代码示例 - 综合对比示例一.盒子模型圆角边框在 CS ...
【CSS】盒子边框 ① ( 网页布局本质 | 盒子模型 | 盒子边框 Border | border-width 宽度 | border-style 边框样式 | 边框颜色 | 边框设置综合写法 )
文章目录一.网页布局本质二.盒子模型三.盒子边框 Border 1.CSS 2.0 文档查询 2.边框设置语法 3.边框设置综合写法一.网页布局本质构建一个网页 , 首先 , 创建盒子模型 ...
html5hover鼠标悬停,不使用hover外部CSS样式实现hover鼠标悬停改变样式
不能使用外部CSS样式实现hover鼠标悬停改变样式在DIV+CSS网页布局中,有时我们不能直接使用外部CSS样式控制DIV样式,比如对a设置a:hover样式. 可以使用onMouseOver(鼠 ...

css 更改text样式,JavaScript 中用 cssText 设置 CSS 样式

css 更改text样式,JavaScript 中用 cssText 设置 CSS 样式相关推荐

最新文章

热门文章