原生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 ...
随机推荐
- patch与diff的恩怨
一.概述 diff和patch是一对相辅相成的工具,在数学上来说,diff类似于对两个集合的差运算,patch类似于对两个集合的和运算.diff比较两个文件或文件集合的差异,并记录下来,生成一个dif ...
- Linux中如何新建用户
对于一般用户来说,主目录(home directory)是硬盘上唯一可以原来写东西的地方.一般的路径名是/home/login_user_name. 主目录用于存储各种用户文件:设置文件,程序配置文件 ...
- hdoj 2795 Billboard【线段树区间最大值】
Billboard Time Limit: 20000/8000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ...
- WEB DYNPRO SAP HELP
http://help.sap.com/saphelp_nw70ehp1/helpdata/EN/43/70d83e8cb23d67e10000000a114084/content.htm
- wxPython中添加窗口标题图标
这种添加方法可以避免要将应用程序和图标放在同一个目录,可以实现从模块中读取图标 #用于从module中读取ico,避免了要在程序所在路径附上此ico exeName = win32api.GetMod ...
- C# 自己对delegate的总结和认识
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- Android项目Tab类型主界面大总结 Fragment+TabPageIndicator+ViewPager
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/24740977 Android如今实现Tab类型的界面方式越来越多,今天就把常见的 ...
- JDK8新特性之Lambda表达式
Lambda表达式主要是替换了原有匿名内部类的写法,也就是简化了匿名内部类的写法.lambda语法结构: (参数1,参数2...)->{重写方法的内容,不定义方法名} 先看一个使用匿名内部类定义 ...
- runtime重写description方法打印model属性和值
在开发过程中, 往往会有很多的model来装载属性. 而在开发期间经常会进行调试查看model里的属性值是否正确. 那么问题来了, 在objective-c里使用NSLog("%@" ...
- Oracle11g - dos 命令 sqlplus/nolog 提示 不是内部命令解决办法
继安装Oracle 11g后,解锁SCOtt时发现 dos 命令 sqlplus/nolog 提示 不是内部命令解决办法 通过实际验证现整理有效方法步骤如下: 步骤一:开始>>找到Or ...