js中cssText批量修改元素样式
平常编写代码,更改一个元素样式的时候,自己都是用
obj.style.width = "200px";
obj.style.position = "absolute";
obj.style.left = "100px";
之类的代码进行设置,这样的话如果更改样式很多的时候,就要写很多代码。
使用Javascript批量修改样式的方法:
cssText 的使用:
obj.cssText = " width:200px;position:absolute;left:100px;";
注意:cssText会清除之前元素含有的样式
所以得使用
obj.cssText += " width:200px;position:absolute;left:100px;";
但是再注意:在IE中的最后一个分号会被删除
obj.cssText += " ;width:200px;position:absolute;left:100px;";
//这样便能解决在IE中出现的问题了
其他使用cssText的方法:
//使用JSON
function setStyle(obj,json){
for(var i in json)
{
obj.style[i]=json[i];
}
}
使用的时候直接:
setStyle(obj,{width : '200px'; position : 'absolute'; left : '100px';});
js中cssText批量修改元素样式的更多相关文章
- MathType中如何批量修改公式字体和大小
MathType中如何批量修改公式字体和大小 关于MathType : MathType 是由美国Design Science公司开发的功能强大的数学公式编辑器,它同时支持Windows和Macint ...
- js中如何删除某个元素下面的所有子元素?(两种方法)
js中如何删除某个元素下面的所有子元素?(两种方法) 一.总结 方法一:通过元素的innerHTML属性 元素element.innerHTML=""; 方法二:通过元素的remo ...
- 总结:js中4类修改样式的方法
前言 最近在写一个扩展右键菜单的插件,既然是插件,想着一步到位,把相关的style样式设置都丢进js文件中,直接加载一个js文件便可以使用该插件,所以今天就研究了下js批量的插入样式的方法,即addS ...
- Javascript原生之用cssText批量修改样式
一般情况下我们用js设置元素对象的样式会使用这样的形式: var element= document.getElementById(“id”);element.style.width=”20px”;e ...
- 用cssText批量修改样式
一般情况下我们用js设置元素对象的样式会使用这样的形式: var element= document.getElementById(“id”);element.style.width=”20px”;e ...
- Dom修改元素样式
提纲:我们可以通过js来修改元素的大小,颜色,位置等样式 1.element.style 行内样式的操作 2.element.className ...
- 详解MathType中如何批量修改公式字体和大小
MathType应用在论文中时,有时会因为排版问题批量修改公式字体和大小,一个一个的修改不仅费时费力,还容易出现错误,本教程将详解如何在MathType公式编辑器中批量修改公式字体和大小. MathT ...
- cssText批量修改样式
cssText所有浏览器都支持. cssText 的使用 obj.style.cssText = " width:200px;position:absolute;left:100px;&qu ...
- H5在js中向指定的元素添加样式
今天在做一个按钮的功能控制,点击之后,要根据判断条件,修改按钮的样式,然后就发现了一个巨好用的方法, <button type="button" id="btn_A ...
随机推荐
- stream_context_create解析
(PHP 4 >= 4.3.0, PHP 5, PHP 7) stream_context_create — 创建资源流上下文 说明¶ stream_context_create ([ arra ...
- qt5 qmake开发
mkdir hello helloworld.cpp #include <QPushButton> #include <QApplication> int main(int a ...
- MIME类型和Java类型
MIME类型和Java类型 类型转换Spring Cloud Stream提供的开箱即用如下表所示:“源有效载荷”是指转换前的有效载荷,“目标有效载荷”是指转换后的“有效载荷”.类型转换可以在“生产者 ...
- RockBrain USB Server外设虚拟化高可用解决方案(银企直联虚拟化解决方案)
技术指标: 单.双千兆网络界面(支持链路冗余与链路热备.支持双网口均衡负载) 原生USB2.0接口(USB2.0与USB3.0接口均对所有USB版本设备兼容,支持混插) 技术优势: RockBrain ...
- css---【vw,vh】进行自适应布局单位
在进行CSS3自适应布局,会用到 vw 和 vh 进行布局 视口单位(Viewport units) 什么是视口? 在桌面端,视口指的是在桌面端,指的是浏览器的可视区域:而在移动端,它涉及3个视口:L ...
- Difference Between Accuracy and Precision
What Is the Difference Between Accuracy and Precision? https://www.thoughtco.com/difference-between- ...
- 解决 Yii2 assets 不自动更新问题
问题描述:core 里的 Asset (AssetBundle)更新 js 或 css 时,更新内容没有直接同步到其他模块 -- 如果想节约时间,直接拖到文章底部看结果就好~ 一.项目目录结构(大概介 ...
- rtmp_specification_1.0
Copyright Adobe Systems Incorporated H. Parmar, Ed. M. Thornburgh, Ed. Adobe December 21, 2012 Adobe ...
- fidder配置 https设置 手机客户端
1.APP抓包时的手机代理设置: 让手机和PC在同一个局域网下面: 1.如果PC是笔记本,让iOS或Android手机.iPhone或笔记本它们连接同一个wifi网络即可(自己试了不行,未找到原因). ...
- 待补充 MySQL必知必会第29章--------数据库维护
备份数据 由于MySQL数据库是基于磁盘的文件,普通的备份系统和里程就能备份MySQL的数据.但是,由于这些文件总是处于打开和使用状态,普通的文件副本备份不一定总是生效.