1 DOM中操作样式的两种方式

1 通过元素的style属性

注意: 通过style属性设置样式时,css中要写单位的属性,在js代码中也要加单位

//html
<div id="box"></div> //js
var box = document.getElementById('box');
box.style.width = '100px';
box.style.height = '100px';
box.style.backgroundColor = 'red'; <div id="box" style="width:100px; height:100px; background-color:red">

2 通过元素的className属性

//html
<div id="box"></div> //css
.show{
width:100px;
height:100px:
background-color:red;
} //js
var box = document.getElementById('box');
box.className = 'show';

javascript总结40:DOM中操作样式的两种方式的更多相关文章

  1. 【javascript】原生js更改css样式的两种方式

    下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3  &quo ...

  2. 基础篇:1.JavaScript运行在html中,引用有几种方式?—— 6.js中常用的输出方式?

    书接上文,上文提到若干条JavaScript的基础性知识,大部分都是一些概念性的东西,本着认真严谨的态度,我们要认真对待,有些条目的问题是某个知识点的周边延伸,为节约篇幅,就一起整理了,如有描述不对的 ...

  3. JavaScript学习12 JS中定义对象的几种方式

    JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...

  4. jQuery中开发插件的两种方式

    jQuery中开发插件的两种方式(附Demo) 做web开发的基本上都会用到jQuery,jQuery插件开发两种方式:一种是类扩展的方式开发插件,jQuery添加新的全局函数(jQuery的全局函数 ...

  5. 原生js更改css样式的两种方式

    下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3  &quo ...

  6. Hadoop之HDFS文件操作常有两种方式(转载)

    摘要:Hadoop之HDFS文件操作常有两种方式,命令行方式和JavaAPI方式.本文介绍如何利用这两种方式对HDFS文件进行操作. 关键词:HDFS文件    命令行     Java API HD ...

  7. web.config文件中配置数据库连接的两种方式

    web.config文件中配置数据库连接的两种方式 标签: 数据库webconfig 2015-04-28 18:18 31590人阅读 评论(1)收藏举报    分类: 数据库(74)  在网站开发 ...

  8. LInux内核分析--使用库函数API和C代码中嵌入汇编代码两种方式使用同一个系统调用

    实验者:江军 ID:fuchen1994 实验描述: 选择一个系统调用(13号系统调用time除外),系统调用列表参见http://codelab.shiyanlou.com/xref/linux-3 ...

  9. Linux内核设计第四周学习总结 使用库函数API和C代码中嵌入汇编代码两种方式使用同一个系统调用

    陈巧然原创作品 转载请注明出处 <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 实验目的: 使用库函数A ...

随机推荐

  1. mysql 存储过程简单学习

    转载自:http://blog.chinaunix.net/uid-23302288-id-3785111.html ■存储过程Stored Procedure 存储过程就是保存一系列SQL命令的集合 ...

  2. Shiro的学习

    Apache Shiro 是 Java 的一个安全(权限)框架.它可以非常容易的开发出足够安全的应用,其不仅可以用在 JavaSE 环境,也可以用在 JavaEE 环境 . Shiro 可以完成:认证 ...

  3. 用PyMOL展示配体和受体相互作用的原子和氢键

    转载于 https://mp.weixin.qq.com/s/P62sjqhSTxmWVicrEAk-RQ 为了简化展示过程,我们设计了一个pml脚本 (脚本内有很详细的解释),只需要修改脚本里面受体 ...

  4. 19_java之List和Set

    01List接口的特点 A:List接口的特点: a:它是一个元素存取有序的集合. 例如,存元素的顺序是11.22.33.那么集合中,元素的存储就是按照11.22.33的顺序完成的). b:它是一 ...

  5. .net Reactor之限指定设备使用

    .net Reactor之license限指定设备使用 上一篇(https://www.cnblogs.com/s313139232/p/9908400.html)中记录了.net Reactor对d ...

  6. html——网页高度

    确定浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条) var w=window.innerWidth || document.documentElement.clientWidth || doc ...

  7. halcon-车牌识别

    halcon代码: 1: read_image(Image,'D:/MyFile/halcon/车牌识别/图片.jpg') 2: decompose3(Image,ImageR,ImageG,Imag ...

  8. 初识tornado

    Tornado 参考:  http://www.cnblogs.com/wupeiqi/articles/5702910.html Tornado 是 FriendFeed 使用的可扩展的非阻塞式 w ...

  9. YUV图像合成原理<转>

    YUV图像合成原理 引言:在视频监控中最常用的就是图像拼接和字符叠加,25FPS的视频流,如果每隔40MS就从各个通道中取一幅图像来合成,则可以看到一个实时的合成视频.合成的过程也就是原始图像的拼接. ...

  10. Squid 反向代理服务器配置

    简介: Squid 反向代理常用于服务器端,客户端访问 Squid 代理服务器的 80 端口,Squid 代理服务器根据配置去请求后端的 web 服务器, 然后将请求到的信息保存在本地并回传给客户端, ...