//判断元素是否有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的更多相关文章

  1. 使用原生 JavaScript 操作 DOM

    原文:https://www.sitepoint.com/dom-manipulation-vanilla-javascript-no-jquery/ 微软官方放弃了 IE10-,所以现在可以放心使用 ...

  2. 表格的一些原生js操作(隔行变色,高亮显示,添加删除,搜索)

    看着网上的视频教程,虽说还是有点简单,但还是不免想记录下.这些操作包括(隔行变色,高亮显示,添加删除,搜索功能),而这儿就是涉及table的原有属性“tBodies” “rows” “cells”等几 ...

  3. 原生JavaScript技巧大收集100个

    原生JavaScript技巧大收集 1.原生JavaScript实现字符串长度截取function cutstr(str, len) { var temp; var icount = 0; var p ...

  4. 原生 JavaScript 代替 jQuery【转】

    目录 用原生JavaScript代替jQuery Query Selector CSS & Style DOM Manipulation Ajax Events Utilities Promi ...

  5. 100个常用的原生JavaScript函数

    1.原生JavaScript实现字符串长度截取 复制代码代码如下: function cutstr(str, len) {    var temp;    var icount = 0;    var ...

  6. WEB前端工程师整理的原生JavaScript经典百例

    一.原生JavaScript实现字符串长度截取 二.原生JavaScript获取域名主机 三.原生JavaScript转义html标签 四.原生JavaScript时间日期格式替换 Date.prot ...

  7. 原生 JavaScript 实现 AJAX、JSONP

    相信大多数前端开发者在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的 ...

  8. 原生JavaScript实现AJAX、JSONP

    相信大多数前端开发者在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的 ...

  9. 原生JavaScript如何解决父元素查找指定类名的子元素的问题

    问题:已知一个元素的类名是right并且这个元素的祖先元素的类名为parent,现在想通过原生JavaScript获得这个类名为right的元素. 我的思路:利用递归.先判断已知的祖先元素(题中的pa ...

随机推荐

  1. python-面向对象(三)——类的特殊成员

    类的特殊成员 1. __doc__     表示类的描述信息 class Foo: """ 描述类信息,这是用于看片的神奇 """ def ...

  2. springMVC源码浅析

    因故,需要学习springmvc,现在demo已经跑起来.列文分析springmvc并简单对比struts2. springmvc的核心对象dispatcherServlet.struts2的核心对象 ...

  3. CSS 最核心的几个概念

    CSS 中最核心的几个概念,包括:盒模型.position.float等. 这些是 CSS 的基础,也是最常用的几个属性,它们之间看似独立却又相辅相成. 元素类型 HTML 的元素可以分为两种: 块级 ...

  4. Android学习路线图

    第一阶段:Java面向对象编程 1.Java基本数据类型与表达式,分支循环. 2.String和StringBuffer的使用.正则表达式. 3.面向对象的抽象,封装,继承,多态,类与对象,对象初始化 ...

  5. asp.net mvc 提交model 接收不了

    [HttpPost]        //[ValidateInput(false)]        public ActionResult AddNews1(_54Young_News_Model.m ...

  6. JDBC——Sql Server

    sun公司设计一套java语言操作不同的数据库提供的是接口,二具体的实现类是由各大数据库厂商实现的. private static final String driver= "com.mic ...

  7. 【c++】虚函数描写叙述符override

    在C++11中为了帮助程序猿写继承结构复杂的类型,引入了虚函数描写叙述符override,假设派生类在虚函数声明时使用了override描写叙述符,那么该函数必须重载其基类中的同名函数,否则代码将无法 ...

  8. MYSQL参数学习---------------- 张碧池

    http://pottievil.com/category/mysql/mysql%E5%8F%82%E6%95%B0/

  9. [转]allocWithZone 和 单例模式

    一.问题起源 一切起源于Apple官方文档里面关于单例(Singleton)的示范代码:Creating a Singleton Instance. 主要的争议集中在下面这一段: ? 1 2 3 4 ...

  10. (转)网站隔几天打不开,多次重启Apache解决办法

    网站打不开了重启一下apache又好了,但过二天又打不开了,只有重启一下才好,基本上二天重起一次,本文主要解决这个问题 工具/原料 linux服务器 网站 方法/步骤   注意观察cpu占用情况{:s ...