浅析原生js模仿addclass和removeclass

【浅析原生js模仿addclass和removeclass】的更多相关文章

浅析原生js模仿addclass和removeclass

//判断有没有class hasClass(elements, cName) { return !!elements.className.match(new RegExp("(\\s|^)" + cName + "(\\s|$)")); // ( \\s|^ ) 判断前面是否有空格 (\\s | $ )判断后面是否有空格两个感叹号为转换为布尔值以方便做判断 }, //移除class removeClass(elements, cName) { if (this.…

表单验证--通过原生js模仿ajax的异步交互

今天给大家带来个福利,我也是刚刚学习的很实用的一个东西,通过原生js模仿ajax的异步交互. 我的博客只是给那些新手看的大神勿喷,写的不好可留言,请指出. 因为当初自己学的时候一个问题不会找人问,知道初学者都不容易,所以我在我的博客中分享自己的学习经验,以及一些好玩的东西!! 废话不多说开始吧: 还是从最初讲:表单:html+css+js 先是HTML: 表单表单HTML代码: <form id="reg" title="注册"> <div cl…

原生JS实现addClass,removeClass,toggleClass

jQuery操作class的方式非常强大,但是目前还有一些人不知道如何使用或者由于项目统一性的原因无法使用jquery. 在此写了一个利用原生js来实现对dom元素class的操作方法 1.addClass:为指定的dom元素添加样式 2.removeClass:删除指定dom元素的样式 3.toggleClass:如果存在(不存在),就删除(添加)一个样式 4.hasClass:判断样式是否存在下面为一toggleClass的测试例子 <style type="text/css&quo…

原生js 用正则实现removeclass hasclass getsclass addclass .

function getByClass(oParent,sClass){ if(oParent.getElementsByClassName){ return oParent.getElementsByClassName(sClass); }else{ var arr=[]; var aEle=oParent.getElementsByTagName('*'); var re=new RegExp('\\b'+sClass+'\\b'); ;i<aEle.length;i++){ if(re.t…

原生js实现addClass,removeClass,hasClass方法

function hasClass(elem, cls) { cls = cls || ''; if (cls.replace(/\s/g, '').length == 0) return false; //当cls没有参数时,返回false return new RegExp(' ' + cls + ' ').test(' ' + elem.className + ' '); } function addClass(ele, cls) { if (!hasClass(elem, cls)) {…

用原生js模仿jquery

阅读声明:本文档仅供学习,由于个人能力有限,文档中有错漏的地方还请指出,大家共同学习. 目前在学习怎么样写jquery,模仿阶段,有兴趣的同学可以和我一起学习,共同交流,在学习的路上希望有你做伴. 在写这个jquery入口模式的时候,首先要知道有几种模式,然后再去些:我知道的有两种:一:$(function () {需要在Document文档加载完成后执行的代码})二:$(document).ready(function () {需要在Document文档加载完成后执行的代码}) 目录结构:in…

JS封装addClass、removeClass

addClass封装:1.先把原有的类名和需要添加的类名用“”切割.拼接. 2.查重,把所有类名遍历,重复的去掉. 3.“”拼接. function addClass(ele , cName) { var arr = ele.className.split(" ").concat(cName.split(" ")); for (var i = 0; i < arr.length; i++)for (var j = arr.length-1; j &g…

原生js模仿jq fadeIn fadeOut效果兼容IE低版本

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> *{ margin: 0; padding: 0; } </style> <script> window.onload=function(){ var certify=document.g…

用原生JS模仿jquery,需要HTML5的支持

jQuery是现在最流行的JavaScript工具库. 据统计,目前全世界57.3%的网站使用它.也就是说,10个网站里面,有6个使用jQuery.如果只考察使用工具库的网站,这个比例就会上升到惊人的91.7%. 虽然jQuery如此受欢迎,但是它臃肿的体积也让人头痛不已.jQuery 2.0的原始大小为235KB,优化后为81KB:如果是支持IE6.7.8的jQuery 1.8.3,原始大小为261KB,优化后为91KB. 这样的体积,即使是宽带环境,完全加载也需要1秒或更长,更不要说移动设备…

原生js模仿下拉刷新功能

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con…