//html
<div id="div1" style="background:red;">
修改背景颜色
</div>
<button type="button" onclick="update();">修改背景</button> //js
update = function (){
var div1 = document.getElementById('div1');
div1.style.backgroundColor="black";
}

在线演示

https://jsfiddle.net/fozero/90y75s48/

JS操作css样式用法的更多相关文章

  1. 11-13 js操作css样式

    1.Js操作css样式 Div.style.width=”100px”.在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性,跟实际项目是不符. ...

  2. js操作css样式、js的兼容问题

    一.js操作css样式 div . style . width="200px" 在div标签内我们添加了一个style属性,并设定width值.这种写法会给标签带来大量的style ...

  3. js操作css样式,null和undefined的区别?

    1.js操作css的样式 div.style.width="100px"在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性, ...

  4. JS操作CSS样式

    一.样式表(css) 使用样式表可以更好的显示WEB文档,也可以结合javascript从而实现很好的控制样式表. 样式(css)与内容(html): HTML是处理文档结构的,HTML可以实现如何把 ...

  5. js中css样式

    1.js操作css样式 例如 div . style . width=“100px”. 就是在div标签内我们添加一个style属性,并设定了width值,这种写法会给标签带来大量的style属性,跟 ...

  6. jq选择器(jq 与 js 互相转换),jq操作css样式 / 文本内容, jq操作类名,jq操作全局属性,jq获取盒子信息,jq获取位置信息

    jq选择器(jq 与 js 互相转换) // 获取所有的页面元素jq对象 $('css3选择器语法'); var $box = $(".box:nth-child(1)"); 获取 ...

  7. js改变css样式

      CreateTime--2017年10月31日15:14:12 Author:Marydon js改变css样式 1.js改变单个css样式 HTML部分 <div id="tes ...

  8. 前端(十二)—— JavaScript基础操作:if语句、for循环、while循环、for...in、for...of、异常处理、函数、事件、JS选择器、JS操作页面样式

    JavaScript基础操作 一.分支结构 1.if语句 if 基础语法 if (条件表达式) { 代码块; } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通 ...

  9. js设置css样式.

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

随机推荐

  1. hdu1181 变形课(vector容器+dfs)

    变形课 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/65536 K (Java/Others) Total Submi ...

  2. 解决EditText跟ScrollView滑动冲突

    etContent.setOnTouchListener(new OnTouchListener() { @Override public boolean onTouch(View v, Motion ...

  3. EularProject 43: 带条件约束的排列组合挑选问题

    Sub-string divisibility Problem 43 The number, 1406357289, is a 0 to 9 pandigital number because it ...

  4. Microsoft Graph Web应用程序极致开发体验

    作者:陈希章 重写于 2017年5月24日 前言 这篇文章最早写于2017年5月2日,当时的想法是从最简单的方式来写如何在一个ASP.NET MVC应用程序中集成Microsoft Graph,但实际 ...

  5. Java web轻量级开发面试教程的前言

    本文来是从 java web轻量级开发面试教程从摘录的. 为什么要从诸多的Java书籍里选择这本?为什么在当前网络信息量如此大的情况下还要买这本书,而不是自己通过查阅网络资料学习?我已经会开发Java ...

  6. XMind常用快捷方式汇总

    快捷键(Windows) 快捷键(Mac) 描述 Ctrl+N Command+N 建立新工作簿 Ctrl+O Command+O 开启工作簿 Ctrl+S Command+S 储存目前工作簿 Ctr ...

  7. android studio 使用adb命令传递文件到android设备

    一:文件传输 在android开发中,有时候需要将文件从pc端传递至android,或者将软件运行的日志,从android设备传递到pc进行分析,我们可以使用windows的cmd窗口,或者andro ...

  8. Solr4.10与tomcat整合并安装中文分词器

    1.solr Solr 是Apache下的一个顶级开源项目,采用Java开发,它是基于Lucene的全文搜索服务器.Solr提供了比Lucene更为丰富的查询语言,同时实现了可配置.可扩展,并对索引. ...

  9. java 对象的初始化过程

    PersonDemo p=new PersonDemo("lisi",20);这句话都做了什么事情? 因为new用到了PersonDemo.class,所以会先找到PersonDe ...

  10. KVO等具体实现步骤以及注意事项

    KVO是一种设计模式,名为观察者. addObserver:forKeyPath:options:context: 通知其他对象的方法,这个方法在NSObject中就已经申明了,也就是说任何继承自NS ...