原文地址：https://www.cnblogs.com/xiangru0921/p/6514225.html

<body>

        <div id="div">这是一个盒子</div>

        <script type="text/javascript">

            var div = document.getElementById("div");

            //第一种:用cssText

            div.style.cssText='width:600px;height:250px;border:1px red solid;text-align: center;line-height: 250px;';

            //第二种：用setProperty()

            div.style.setProperty('width','700px');

            div.style.setProperty('height','300px');

            div.style.setProperty('line-height','300px');

            div.style.setProperty('background','#f00');

            div.style.setProperty('color','#fff');

            div.style.setProperty('border','1px solid blue');

            div.style.setProperty('text-align','center');

            //第三种：使用css属性对应的style属性

            div.style.width = "800px";

            div.style.height = "250px";

            div.style.lineHeight = "250px";

            div.style.background = "#000";

            div.style.color = "#fff";

            div.style.border = "1px solid #111";

            div.style.textAlign = "center";

        </script>

    </body>

JavaScript三种方式改变标签css的更多相关文章

  1. jquery.validate+jquery.form提交的三种方式

    原文:http://www.cnblogs.com/datoubaba/archive/2012/06/06/2538873.html jquery.validate+jquery.form提交的三种 ...

  2. CSS控制样式的三种方式优先级对比验证

    入职已经一个月了,自此后,就好久没有写过博客了,在此先跟关注我的博友们说声抱歉.今天,在公司的一个培训作业的驱动以及伟哥那句“再不写博客就开除你”的监督下,我终于重拾旧爱,再次登录博客园,继续与大家分 ...

  3. JavaScript 基础——使用js的三种方式，js中的变量，js中的输出语句，js中的运算符；js中的分支结构

    JavaScript 1.是什么:基于浏览器 基于(面向)对象 事件驱动 脚本语言 2.作用:表单验证,减轻服务器压力 添加野面动画效果 动态更改页面内容 Ajax网络请求 () 3.组成部分:ECM ...

  4. css文件引人的三种方式

    前言 1995年,W3C发布了CSS草案 1996年,W3C正式推出CSS1 1998年,推出CSS2 2001年从CSS3开始,CSS这门语言分割成多个独立的模块,每个模块独立分级,且只包含一小部分 ...

  5. python 中增加css样式的三种方式

    增加css样式的三种方式: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  6. 引入CSS的三种方式

    虽然入职已经大半年,并自诩前端工程师,但是我真的不会……(有一种我有罪我该死的感觉 从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌入式和外部式三种. 1.内联式 内联式css样式表就 ...

  7. JavaScript判断图片是否加载完成的三种方式

    JavaScript判断图片是否加载完成的三种方式 有时需要获取图片的尺寸,这需要在图片加载完成以后才可以.有三种方式实现,下面一一介绍. 一.load事件 1 2 3 4 5 6 7 8 9 10 ...

  8. JavaScript声明全局变量的三种方式

    JavaScript声明全局变量的三种方式   JS中声明全局变量主要分为显式声明或者隐式声明下面分别介绍. 声明方式一: 使用var(关键字)+变量名(标识符)的方式在function外部声明,即为 ...

  9. 使用javascript实现在页面打印的效果的三种方式

    <div id="console"></div> <script type="text/javascript"> var c ...

随机推荐

  1. 【Eclipse】如何在Eclipse中使用命令行？

    如何在Eclipse中使用命令行? 虽然我们已经有了像 Eclipse 这样高级的 IDE,但是我们有时候也是需要在开发的时候使用 Windows 的命令行,来运行一些独立的程序.在两个程序中切换来切 ...

  2. 互联网公司linux运维生产场景常用软件工具一览

    linux的世界真的很精彩,还没入门的朋友赶紧进来吧! 操作系统:Centos※,Freebsd,Ubuntu,Redhat linux,suse linux网站服务:apache※,nginx※,l ...

  3. C#.NET常见问题(FAQ)-如何把定义存放类实例的数组

    数组存放的可以是普通的int,double,string类型,也可以是自定义的类的实例   如果数组长度未知,可以用list对象存放   更多教学视频和资料下载,欢迎关注以下信息: 我的优酷空间: h ...

  4. SWIFT学习笔记05

    1.Swift 无需写break,所以不会发生这样的贯穿(fallthrough)的情况.2.//用不到变量名,可用"_"替换 for _ in 1...power { answe ...

  5. centos7默认安装没有连接到网络

    1.显示所有连接 # nmcli con show 2.连接到网络 # nmcli con up enp0s3 这个ens33是通过显示所有连接查到的

  6. linux cp 命令详解

    /home/lee#cp --help 用法:cp [选项]... 来源 目的地 或:cp [选项]... 来源... 目录 或:cp [选项]... --target-directory=目录 来源 ...

  7. mybatis批量删除（逻辑删除）

    在Mapper.xml文件中 <!-- 批量删除 --> <delete id="deleteAd" parameterType="java.util. ...

  8. 请指出document load和document ready的区别？

    共同点:这两种事件都代表的是页面文档加载时触发. 异同点: ready 事件的触发,表示文档结构已经加载完成(不包含图片等非文字媒体文件). onload 事件的触发,表示页面包含图片等文件在内的所有 ...

  9. js 实现继承的6种方式(逐渐优化)

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  10. error：No buffer space available (maximum connections reached

    2015-02-02 17:49:09,035 ERROR basic.DBManager - Failded to establish the connection. com.mysql.jdbc. ...