原文地址: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. GitHub万星项目:黑客成长技术清单

    最近有个GitHub项目很火,叫"Awesome Hacking",这个项目是由Twitter账号@HackwithGithub 维护,喜欢逛Twitter的安全爱好者应该了解,在 ...

  2. jQuery.event详细解析

    介绍之前先介绍jQuery的一个方法 jQuery.event.fix(event || window.event); 此方法个浏览器的event对象转换为 jQuery.event; 如果您的事件是 ...

  3. LintCode: Single Number II

    一篇解析比较详细的文章:http://www.acmerblog.com/leetcode-single-number-ii-5394.html C++ 解法(1) 求出每个比特位的数目,然后%3,如 ...

  4. 关于Windows勒索病毒以及445端口防护

    前两天,与这个周末,5月12日起,Onion.WNCRY两类敲诈者病毒变种在全国乃至全世界大范围内出现爆发态势,大量个人和企业.机构用户中招. 与以往不同的是,这次的新变种病毒添加了NSA(美国国家安 ...

  5. Vue - 起手式

    0x00:前言 这次前言不想扯太多. 本文主要是记录一下自己的学习历程,顺带做一个总结. 当中有參考 Vue.js 的中文文档,也有去查看其它大大们给出的总结. 最后也是一个期盼,希望能够帮助到其它有 ...

  6. python 解析top文件格式

    top - 16:14:35 up 2 days, 3:04, 7 users, load average: 2.22, 1.84, 1.77 Tasks: 512 total, 2 running, ...

  7. 亲历H5移动端游戏微信支付接入及那些坑(四)——参考文档

    写完三篇后,我觉得微信支付的文档确实比较乱,所以在此做一个整理汇总 支付流程相关文档 一下文档已经按照接入顺序排列,请依次参考阅读 微信公众号网页授权两种access_token区别,获取用户open ...

  8. jqPlot图表插件学习之折线图-散点图-series属性

    一.准备工作 首先我们需要到官网下载所需的文件: 官网下载(笔者选择的是jquery.jqplot.1.0.8r1250.zip这个版本) 然后读者需要根据自己的情况新建一个项目并且按照如下的方式加载 ...

  9. 初始化ArrayList的两种方法[转]

    方式一:  ArrayList<String> list = new ArrayList<String>();  String str01 = String("str ...

  10. ORA-01034: ORACLE not available解决

    问题现象: alter user scott account unlock; ERROR at line 1:ORA-01034: ORACLE not availableProcess ID: 0S ...