原生javascript操作class-元素查找-元素是否存在-添加class-移除class
- //判断元素是否有class
function hasClass(ele, cls) {- return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
- }
//元素增加class- function addClass(ele, cls) {
- if (!hasClass(ele, cls)) ele.className += " "+cls;
- }
//元素移除class- function removeClass(ele, cls) {
- if (hasClass(ele, cls)) {
- var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
- ele.className = ele.className.replace(reg, ' ');
- }
- }
- /* className, rootId(限制范围id名), tagName(标签名称)*/
- function getElementsByClassName(cls, rid, tag) {
- root = rid && document.getElementById(rid) || document;
- if (root.getElementsByClassName) {
- return root.getElementsByClassName(cls);
- }
- tag = tag || '*';
- var elems = root.getElementsByTagName(tag);
- var ret = [];
- for (var i = 0, len = elems.length; i < len; i++) {
- var elem = elems[i];
- if ((' ' + elem.className + ' ').indexOf(' ' + cls + ' ') > -1) {
- ret.push(elem);
- }
- }
- return ret;
- }
原生javascript操作class-元素查找-元素是否存在-添加class-移除class的更多相关文章
- 使用原生 JavaScript 操作 DOM
原文:https://www.sitepoint.com/dom-manipulation-vanilla-javascript-no-jquery/ 微软官方放弃了 IE10-,所以现在可以放心使用 ...
- 表格的一些原生js操作(隔行变色,高亮显示,添加删除,搜索)
看着网上的视频教程,虽说还是有点简单,但还是不免想记录下.这些操作包括(隔行变色,高亮显示,添加删除,搜索功能),而这儿就是涉及table的原有属性“tBodies” “rows” “cells”等几 ...
- 原生JavaScript技巧大收集100个
原生JavaScript技巧大收集 1.原生JavaScript实现字符串长度截取function cutstr(str, len) { var temp; var icount = 0; var p ...
- 原生 JavaScript 代替 jQuery【转】
目录 用原生JavaScript代替jQuery Query Selector CSS & Style DOM Manipulation Ajax Events Utilities Promi ...
- 100个常用的原生JavaScript函数
1.原生JavaScript实现字符串长度截取 复制代码代码如下: function cutstr(str, len) { var temp; var icount = 0; var ...
- WEB前端工程师整理的原生JavaScript经典百例
一.原生JavaScript实现字符串长度截取 二.原生JavaScript获取域名主机 三.原生JavaScript转义html标签 四.原生JavaScript时间日期格式替换 Date.prot ...
- 原生 JavaScript 实现 AJAX、JSONP
相信大多数前端开发者在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的 ...
- 原生JavaScript实现AJAX、JSONP
相信大多数前端开发者在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的 ...
- 原生JavaScript如何解决父元素查找指定类名的子元素的问题
问题:已知一个元素的类名是right并且这个元素的祖先元素的类名为parent,现在想通过原生JavaScript获得这个类名为right的元素. 我的思路:利用递归.先判断已知的祖先元素(题中的pa ...
随机推荐
- (8/18)重学Standford_iOS7开发_协议、block、动画_课程笔记
第八课: 1.协议 另一种安全处理id类型的方式如:id <MyProtocol> obj a.声明 //协议一般放于.h文件中或者在类的.h文件中 @protocol Foo <X ...
- Quartz定时任务学习(七)Cron 触发器
Cron表达式 Quartz使用类似于Linux下的Cron表达式定义时间规则,Cron表达式由6或7个由空格分隔的时间字段组成,如表1所示: 位置 时间域名 允许值 允许的特殊字符 1 秒 0-59 ...
- linux系统下安装apache与tomcat
apache的安装 把安装包放到/soft 下 [root@localhost ~]#cd /soft [root@localhost soft]#tar jxvf httpd-2.2.25.tar. ...
- 【web开发学习笔记】ibatis学习总结
ibatis学习总结 ibatis数据库配置文件 <?xml version="1.0" encoding="UTF-8" ?> <!DOCT ...
- uva-10487 - Closest Sums
暴力枚举后去重最后二分加推断找答案 #include<iostream> #include<map> #include<string> #include<cs ...
- Struck: Structrued Output Tracking with Kernels 论文笔记
Main idear Treat the tracking problem as a classification task and use online learning techniques to ...
- 手动安装 mysqldb 与[ pip easy_install]
mysqldb下载: http://sourceforge.net/projects/mysql-python/ https://sourceforge.net/projects/mysql-pyth ...
- 去掉cajviewer 右上角的“中国知网数字出版物超市
cajviewer软件是一款可以提取pdf字码的软件(即使pdf是扫描版的) 下面是转的一个博文可以去除软件右上角图标的方法: 去掉cajviewer 7.1.2右上角的“中国知网数字出版物超市” 1 ...
- LabVIEW设计模式系列——状态机
标准:1.状态用枚举自定义类型,便于统一管理修改.2.一般地应该有:Initialize,Idle,Stop,Blank状态.3.Initialize进行一些初始化的操作:Idle一种过渡状态,用于和 ...
- java与javax有什么区别?
java 是java j2sdk 中的类库,也就是Java Development kit . 它提供也一些基础的东西,如io库.桌面程序的类库,如awt.集合库(如Collection.List.M ...