通过class改变样式
1.判断class属性
判断一个元素中是否含有指定的class属性值
function hasClass(obj,cn){
//创建正则表达式
var reg=new RegExp("\\b"+cn+"\\b");
return reg.test(obj.className);
}
2.添加class属性
定义一个函数,用来向一个元素中添加指定的class属性值
参数:
obj 要添加class属性的元素
cn 要添加的class值
function addClass(obj,cn){
//检查obj中是否含有cn
if(!hasClass(obj,cn)){
obj.className+=" "+cn
}
}
3.删除class属性
function removeClass(obj,cn){
var reg=new RegExp("\\b"+cn+"\\b");
obj.className=obj.className.replace(reg,"");
}
4.切换class属性
元素中具有该类则删除,没有则添加
function toggleClass(obj,cn){
if(hasClass(obj,cn)){
removeClass(obj,cn)
}else{
addClass(obj,cn)
}
}
通过class改变样式的更多相关文章
- web appbuilder 改变样式和添加自定义widget
一.改变样式 要实现的效果是添加cyan样式 1.将FoldableTheme/style下的cyan copy到TabTheme下的同一目录下: 2.打开TabTheme下的manifest,cop ...
- 标签(改变样式style)
id可以换为class,class对应的名字可以多个一样 <div class="box">box1</div> <div class="b ...
- ng-repeat动态改变样式
当我们使用AngularJs的ng-repeat时候动态绑定数据时,遇到遍历出来的标签样式都一样,这时候希望根据数组的下标分别对应不同的样式 解决:使用$index获取数组下标根据下标改变样式 < ...
- 自己定义RatingBar,能依据设置改变样式
项目在我的GITHUB上 mirsfang的GitHub 一个简单的自己定义View ,为了一个 比較奇葩的需求而搞出来的.他的功能就是能让你自己设置图片和图片的大小以及星星的数量,是一个组合型的 ...
- 微信小程序,动态改变样式
小程序目前没有修改样式api,但是可以利用数据绑定实现动态改变样式,可以用view标签模拟page然后改变view标签的样式,以下案例演示了如果改变page背景颜色: <view class=& ...
- 5.JavaScript改变样式,验证用户输入
① x=document.getElementById("demo") //找到元素 x.style.color="#ff0000"; //改变样式 ② if ...
- vue点击时动态改变样式 ------- 最简单的方法
vue点击时动态改变样式 template中 <li :class="{ active:index==isActive }" @click="changeValue ...
- vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改
vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改.vue <div class="commonHeader" v-bind:class=" ...
- javascript和jquery 移除事件 和 改变样式
javascript移除事件: document.getElementById("word").onmouseover = null; javascript改变样式: docume ...
- 使用datasest属性改变样式
使用datasest属性改变样式 传统做法 对于html中的标签我们可以自定义标签中的属性,例如给input加一个aaa属性 <input type="text" aaa=& ...
随机推荐
- elasticsearch head添加索引并设置mapping
直接用put方法创造一个东西出来 然后post请求,设置mapping
- 【Python全栈】HTML <!--...--> 注释 、CSS/JS //注释 和 /*.....*/ 注释
HTML <!--...--> 注释 .CSS/JS //注释 和 /*.....*/ 注释 <!-- -->是HTML的注释标签,使用 < 和 > 是符合HTML ...
- sql 范式:1NF、2NF、3NF、BCNF(函数依赖)
第一范式(1NF) 每个属性都是不可分的基本数据项.(必须有主键,列不可分) eg:非第一范式的表:(列可再分) 学院名称 高级职称人数 教授 副教授 信电学院 3 34 管理学院 5 23 外语学院 ...
- Ethzasl MSF源码阅读(1):程序入口和主题订阅
关于IMU融合知乎上的一篇问答:有哪些开源项目是关于单目+imu做slam的? Ethz的Stephen Weiss的工作,是一个IMU松耦合的方法. 1.程序入口:ethzasl_msf\msf_u ...
- 467A
#include <stdio.h> int main() { int n; int p, q; int rooms=0; scanf("%d", &n); i ...
- python安装simplejson
import simplejson 报错:ImportError: No module named simplejson simplejson是ansible一个很重要的依赖,经测试在python 2 ...
- ubuntu 安装完后对于开发需要做的事情
是从 https://www.osboxes.org/ubuntu/ 下载的vdi文件,估计vmware对应的应该也有. 1. 安装 openssh-server apt-get install op ...
- hisicv200 exfat支持
由于项目中需要128Gsd卡支持.所以内核里面需要支持exfat 1.exfat 由于版权问题,所以linux kernel一直都没法支持,由于某些公司在linux kernel 3.9版本开源exf ...
- java4/9 异常处理
- K8S学习笔记之二进制部署Kubernetes v1.13.4 高可用集群
0x00 概述 本次采用二进制文件方式部署,本文过程写成了更详细更多可选方案的ansible部署方案 https://github.com/zhangguanzhang/Kubernetes-ansi ...