更改元素样式

<div style="width:100px;height:100px;text-align:center;line-height:100px;">
        This is div</div>

一般更改的样式比较少的话,我们直接给style属性赋值

div.style.width = "200px";
div.style.height = "200px";
div.style.lineHeight = "200px";

但是一旦需要更改的样式很多的话,可以使用cssText来设置

div.style.cssText = "width:200px;height:200px;line-height:200px";

但是cssText会覆盖行内样式,不会覆盖<style>标签内的样式,不会覆盖外部样式,所以为了解决这个问题,采用样式叠加的方式。

div.style.cssText += "width:200px;height:200px;line-height:200px";

但是IE9以下的浏览器div.style.cssText会省略cssText中的最后一个分号

console.log(div.style.cssText);结果为:HEIGHT: 100px; WIDTH: 100px; TEXT-ALIGN: center; LINE-HEIGHT: 100px; BACKGROUND-COLOR: red

所以为了解决IE中的这个小问题

div.style.cssText += ";width:200px;height:200px;line-height:200px";

CSS之cssText的更多相关文章

  1. CSS SandBox

    引言 本篇文章主要介绍的是关于CSS Sandbox的一些事情,为什么要介绍这个呢?在我们日常的开发中,样式问题其实一直是一个比较耗时的事情,一方面我们根据 UI 稿不断的去调整,另一方面随着项目越来 ...

  2. 大流量网站性能优化:一步一步打造一个适合自己的BigRender插件

    BigRender 当一个网站越来越庞大,加载速度越来越慢的时候,开发者们不得不对其进行优化,谁愿意访问一个需要等待 10 秒,20 秒才能出现的网页呢? 常见的也是相对简单易行的一个优化方案是 图片 ...

  3. C#将HTML导出Excel

    首先这个 不能用ajax 操作,不过 我现在讲的 这个方法和ajax 的效果一样. 你在你需要导出的页面写个方法 function DaoChu () { location.href = " ...

  4. BigRender

    当一个网站越来越庞大,加载速度越来越慢的时候,开发者们不得不对其进行优化,谁愿意访问一个需要等待 10 秒,20 秒才能出现的网页呢? 常见的也是相对简单易行的一个优化方案是 图片的延迟加载.一个庞大 ...

  5. 高性能javascript

    高性能javascript开发 标签(空格分隔): javascript DOM访问与修改 访问DOM元素是具有代价的,修改元素代价较为昂贵,会导致浏览器重新计算页面的几何变化. 尽量减少DOM访问, ...

  6. 第十二篇 C# 将HTML 直接转成Excel

    前些天写项目的时候,客户要求用HTML表格把信息展示出来,后面还要用展示的内容要导出Excel.本来想想在后台操作的话估计是要做死了,但是经过细想,Excel能够发布成HTML,一定也可以由HTML转 ...

  7. C# HTML转EXCEL的方法

    private void ToExcel(string html) { Response.ContentType = "application/force-download"; R ...

  8. 控制元素的div属性

    1.需求分析 改变元素的宽.高.颜色.显示.重置等属性. 2.技术分析 基础的css.html.js 3.详细分析 如图,单击按钮,改变元素属性: 3.1 HTML部分 根据视图不难发现,内容分两大不 ...

  9. 基于px2rpx-loader,探讨一下loader的封装思想

    本文以px2rpx-loader的源码为学习对象,了解其工作机制以及loader封装的思想. 1.前言 最近在了解mpvue框架的时候,对于其能够实现一套代码兼容web和微信小程序(以下简称小程序)的 ...

随机推荐

  1. The 2015 China Collegiate Programming Contest A. Secrete Master Plan hdu5540

    Secrete Master Plan Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 65535/65535 K (Java/Othe ...

  2. ccc 函数中写函数

    attackOnTarget: function (atkDir, targetPos) { var self = this; let deg = cc.radiansToDegrees(cc.pAn ...

  3. ccc 模拟重力 正太分布

    ball.js cc.Class({ extends: cc.Component, properties: { x_vel:{ default:0 }, y_vel:{ default:0 }, gr ...

  4. Android: Service中创建窗口显示

    WindowManager.LayoutParams: int TYPE_SYSTEM_ALERT  Window type: system window, such as low power ale ...

  5. 彻底弄明白之数据结构中的排序七大算法-java实现

    package ds; /* * author : codinglion * contact: chenyakun@foxmail.com */ import java.util.Random; pu ...

  6. NOI 题库 1792

    1792  迷宫 描述 一天Extense在森林里探险的时候不小心走入了一个迷宫,迷宫可以看成是由n * n的格点组成,每个格点只有2种状态,.和#,前者表示可以通行后者表示不能通行.同时当Exten ...

  7. Android --RatingBar的使用

    1.效果图

  8. Linux之网络配置(不断更新中)

    ========================================================================================== 配置文件 ==== ...

  9. IEqualityComparer<T>

    在linq中使用union和distinct都不起作用,结果发现必须传入一个实现了IEqualityComparer<T>的比较器 public class CompareUser : I ...

  10. zip ubuntu使用

    http://www.cnblogs.com/daizhuacai/p/3174885.html 安装: sudo apt-get install zip 解压: unzip -d path file ...