js中用cssText设置css样式

(2012-08-21 10:40:22)

标签:

js

 
如果网页中一个 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样式来说很简单很方便

cssText设置css样式的更多相关文章

  1. js设置css样式.

    在js设置css样式做法 var obj = document.getElementById('div'); obj.style.width = '100px'; obj.style.height = ...

  2. JS设置CSS样式的几种方式

    用JS来动态设置CSS样式,常见的有以下几种 1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保 ...

  3. JS设置CSS样式的几种方式【转】

    用JS来动态设置CSS样式,常见的有以下几种 1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保 ...

  4. 关于jquery中用函数来设置css样式

    关于jquery中用函数来设置css样式 2016-12-21 23:27:55 1.jquery语法 $(selector).css(name,function(index,value)) name ...

  5. 3.通过js代码设置css样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 5、通过js代码设置css样式

    1.页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  7. react学习(四)之设置 css样式 篇

    react中设置css样式 方法一: 行内样式:使用{{  }},与正常jsx中插入js代码不一样,这里需要两个括号. <div style={ { float: 'right',} }> ...

  8. JSX设置CSS样式详解

    JSX设置CSS样式详解 1. 使用className设置样式(CSS的其他选择器也是同理) (1)定义一个CSS文件style.css,和普通CSS一样定义class选择器 .sty1{//和普通C ...

  9. PHP使用echo输出标签设置CSS样式问题

    使用php是可以输出HTML标签的,这为页面设计带来很大方便. 在此记录php输出标签设置CSS样式的问题: echo可使用''.""或你不用引号,如果想要输出带CSS样式的HTM ...

随机推荐

  1. NOSql之redis的学习

    /** * 这里是我的虚拟机相关的启动命令 /usr/local/redis/bin/redis-server /usr/local/redis/etc/redis.conf /usr/local/r ...

  2. python 自动化之路 day 面向对象基础

    1.面向對象基础概述 面向过程: 根据业务逻辑从上到下垒代码(如果程序修改,对于依赖的过程都需要进行修改.) 函数式: 将某功能代码封装到函数中,如后便无需重复编写,仅需要调用函数即可 面向对象: 世 ...

  3. http 常用状态码及含义

    http://www.kuaipan.cn/developers/document_status.htm

  4. Kivy中文显示

    Win7系统 下载 DroidSansFallback.ttf字体(android设备上自带了) 源代码第一行增加#-*- coding:utf-8 -*- 创建widget值定font_name s ...

  5. 【python之旅】python的基础三

    目录: 1.装饰器 2.迭代器&生成器 3.Json & pickle 数据序列化 4.软件目录结构规范  一.装饰器 定义:本质是函数,(装饰其他函数)就是为其他函数添加附加功能 原 ...

  6. web2py相关-------------------------------(一)初遇

    在第一次换工作的时候,希望转行 做编程,就面试了很多家,很多人问我 懂不懂html 书写,我非常诚实的告诉他们不会. 当然那时我很天真的认为,只要自己愿意学习这些都不是问题,事实证明人的学习能力是很快 ...

  7. WARNING L15: MULTIPLE CALL TO SEGMENT

    原网页:http://www.cnblogs.com/CuriosityWzk/archive/2011/12/25/2301090.html WARNING L15: MULTIPLE CALL T ...

  8. IntelliJ 一键添加双引号

    IntelliJ IDEA(目前最新版本为2016.2.5) 不直接支持一键向选取内容添加双引号,但可以通过配置 Live Template 实现此功能. 以下为配置方法(针对2016.2.5版,其它 ...

  9. django中form表单的提交:

    一,关于表单: 表单在百度百科的解释:   表单在网页中主要负责数据采集功能.一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法. 表单域 ...

  10. 【poj3070】矩阵乘法求斐波那契数列

    [题目描述] 我们知道斐波那契数列0 1 1 2 3 5 8 13…… 数列中的第i位为第i-1位和第i-2位的和(规定第0位为0,第一位为1). 求斐波那契数列中的第n位mod 10000的值. [ ...