原生js实现查找/添加/删除/指定元素的class

 更新时间:2013年04月12日 15:56:04   作者:  
查找、添加、删除、指定元素的class使用原生js实现不可思议吧,感兴趣的朋友可以参考下哈,希望可以帮助到你

脚本之家 / 编程助手:解决程序员“几乎”所有问题!
脚本之家官方知识库 → 点击立即使用

复制代码 代码如下:

window.onload = function(){
var gaga = document.getElementById( "gaga" );
addClass( gaga,"gaga1" )
addClass( gaga,"gaxx" );
removeClass( gaga,"gaga1" )
removeClass( gaga,"gaga" )
function hasClass( elements,cName ){
return !!elements.className.match( new RegExp( "(\\s|^)" + cName + "(\\s|$)") ); // ( \\s|^ ) 判断前面是否有空格 (\\s | $ )判断后面是否有空格 两个感叹号为转换为布尔值 以方便做判断
};
function addClass( elements,cName ){
if( !hasClass( elements,cName ) ){
elements.className += " " + cName;
};
};
function removeClass( elements,cName ){
if( hasClass( elements,cName ) ){
elements.className = elements.className.replace( new RegExp( "(\\s|^)" + cName + "(\\s|$)" )," " ); // replace方法是替换
};
};
};
蓄力AI

微信公众号搜索 “ 脚本之家 ” ,选择关注

程序猿的那些事、送书等活动等着你

相关文章

  • Ionic项目中Native Camera的使用方法

    Ionic项目中Native Camera的使用方法

    Ionic项目中如何使用Native Camera?这篇文章主要介绍了Ionic项目中Native Camera的使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-06-06
  • Bootstrap菜单按钮及导航实例解析

    Bootstrap菜单按钮及导航实例解析

    这篇文章主要介绍了Bootstrap菜单按钮及导航的相关资料,本文介绍的非常详细,具有参考借鉴价值,感兴趣的朋友一起学习吧
    2016-09-09
  • 微信小程序如何实现页面跳转功能详解

    微信小程序如何实现页面跳转功能详解

    这篇文章主要给大家介绍了关于微信小程序如何实现页面跳转功能的相关资料,包括页面跳转的方式、跳转传参的方法以及页面返回的操作,通过简单的代码示例,帮助读者快速掌握微信小程序页面跳转的基本用法,下面需要的朋友可以参考下
    2023-03-03
  • 深入理解JavaScript和TypeScript中的class

    深入理解JavaScript和TypeScript中的class

    class 声明创建一个基于原型继承的具有给定名称的新类,下面这篇文章主要给大家介绍了关于JavaScript和TypeScript中class的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下。
    2018-04-04
  • JavaScript实现时间倒计时跳转(推荐)

    JavaScript实现时间倒计时跳转(推荐)

    这篇文章主要介绍了JavaScript实现时间倒计时跳转(推荐)的相关资料,涉及到settimeout和setinterval方法的介绍,非常不错具有参考借鉴价值,需要的朋友可以参考下
    2016-06-06
  • 微信小程序实现上传多张图片、删除图片

    微信小程序实现上传多张图片、删除图片

    这篇文章主要为大家详细介绍了微信小程序实现上传多张图片、删除图片,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-06-06
  • 跨域传值即主页面与iframe之间互相传值

    跨域传值即主页面与iframe之间互相传值

    主页面A 怎么向 iframe B 传递数据呢?iframe B 怎么向 主页面A 传递数据,下面有不错的实现思路,感兴趣的朋友可以了解下
    2013-12-12
  • 利用原生js和jQuery实现单选框的勾选和取消操作的方法

    利用原生js和jQuery实现单选框的勾选和取消操作的方法

    下面小编就为大家带来一篇利用原生js和jQuery实现单选框的勾选和取消操作的方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09
  • JS实现返回上一页并刷新页面的方法分析

    JS实现返回上一页并刷新页面的方法分析

    这篇文章主要介绍了JS实现返回上一页并刷新页面的方法,结合实例形式分析了javascript针对移动端、PC端浏览器的页面缓存刷新相关操作技巧,需要的朋友可以参考下
    2019-07-07
  • JS调用安卓手机摄像头扫描二维码

    JS调用安卓手机摄像头扫描二维码

    这篇文章主要为大家详细介绍了JS调用安卓手机摄像头扫描二维码,并用JS解析二维码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-10-10

最新评论