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 ...
随机推荐
- [Web] How to Test React and MobX with Jest
转载自: https://semaphoreci.com/community/tutorials/how-to-test-react-and-mobx-with-jest?utm_content=bu ...
- mybatis自定义之优先从classes目录加载,加载之后遇到相同的类定义时不再加载
如果mybatis中包含了两个相同定义的mapper,启动时出现下列异常: Caused by: java.lang.IllegalArgumentException: Result Maps col ...
- mapdb的适用场景介绍
对于大部分系统来说,mapdb并无太大价值,而且增加了成本.但是如果一级缓存巨大例如数以十GB级别,或占据了整个JVM的1/2以上,mapdb的价值就会体现出来.正如其官网介绍: MapDB prov ...
- 003 docker安装nginx
一:安装与运行nginx 1.查找镜像网站 https://c.163yun.com/hub#/m/home/ 2.pull 3.查看当前在运行的容器 docker ps 4.启动nginx 使用后台 ...
- C#-DllImport 路径问题
原文:C# DllImport 相对路径无法找到dll DllImport DLL查找顺序:1.应用程序所在目录2.Windows目录和Windows\System32目录3.环境变量目录 只需要你把 ...
- django入门7之django template和xadmin常用技巧
django入门7之django template和xadmin常用技巧 <li {% ' == '/course' %}class="active"{% endif %}& ...
- (转)Navicat_12安装与破解,亲测可用!!!
原文:http://www.yq1012.com/jichu/4634.html https://www.52pojie.cn/thread-867986-1-1.html 快速方式:CSDN下载安装 ...
- WebGL学习笔记(九):阴影
3D中实现实时阴影技术中比较常见的方式是阴影映射(Shadow Mapping),我们这里也以这种技术来实现实时阴影. 阴影映射背后的思路非常简单:我们先以光的位置为视角进行渲染,我们能看到的东西都将 ...
- java多线程(一)创建线程的四种方式
1. 什么是并发与并行 要想学习多线程,必须先理解什么是并发与并行 并行:指两个或多个事件在同一时刻发生(同时发生). 并发:指两个或多个事件在同一个时间段内发生. 2. 什么是进程.线程 进 ...
- MacOSX 虚拟机与宿主机的网络配置
环境:MacOSX.VMware Fusion11.5.CentOS6 比较重要的两个网卡 安装虚拟机后,宿主机会多出几个网卡,其中vmnet1对应的Bridge(桥接方式),vmnet8对应NAT方 ...