//添加一个class

elem.classList.add(classname);

//删除一个class

elem.classList.remove(classname);

//判断一个class是否已存在

elem.classList.contains(classname);

//如果class已存在则移除，如果不存在则添加

elem.classList.toggle(classname);

　　

// 添加多个class

elem.className = 'cls1 cls2';

　　

HTML5的classList API优化对样式名className的操作的更多相关文章

  1. HTML5 classList API接口

    原文地址:HTML5 classList API 原文日期: 2010年07月13日 翻译日期: 2013年08月23日 当我陷入JavaScrip和JavaScript类库框架之中时,我总是有种希望 ...

  2. HTML5 classList API

    Having thrust myself into the world of JavaScript and JavaScript Libraries, I've often wondered: Whe ...

  3. 温习classList api

    有道题是一个removeClass的功能,代码里是正则分隔了传入的name,根据name的个数,循环移除掉,让寻找bug..看了了这几行代码,首先想到的是我会如何去优化. 如果看代码一两分钟就能找到公 ...

  4. 【小月博客】用HTML5的File API做上传图片预览功能

    前段时间做了一个项目,涉及到上传本地图片以及预览的功能,正好之前了解过 html5(点击查看更多关于web前端的有关资源) 可以上传本地图片,然后再网上看了一些demo结合自己的需求,终于搞定了.(P ...

  5. 深入理解HTML5：语义、标准与样式（勇猛精进早登大师殿堂创最优品质交互）

    深入理解HTML5:语义.标准与样式(勇猛精进早登大师殿堂创最优品质交互) [美]布拉德福(Bradford,A.) [美]海涅(Haine,P.)著 高京译 ISBN 978-7-121-20552 ...

  6. 深入理解HTML5：语义、标准与样式

    <深入理解HTML5:语义.标准与样式> 基本信息 作者: (美)布拉德福(Bradford,A.) 海涅(Haine,P.) 译者: 高京 出版社:电子工业出版社 ISBN:978712 ...

  7. HTML5: Screen Orientation API

    媒体的询问取决于智能手机和平板布局调整的方向一致网站.但有时候你被锁定在一个希腊网站特定方向.横向或纵向.此时,是本机格式可以指定保健应用. APP只显示在一个预设格式-独立于实际设备方向.通过使用H ...

  8. sencha touch 扩展篇之使用sass自定义主题样式 （上）使用官方的api修改主题样式

    大家知道,sencha touch是通过我们写的js代码来动态渲染单页面生成一个个div+css的html页面来模拟app应用,那么既然是div+css结构的,我们就可以通过修改css样式来自定义我们 ...

  9. 使用 classList API

    一.classList API 是什么 属于 DOM API,HTML5 引入,用来操作 HTML 标签的 class 属性值. classList 属性是一个只读的类数组对象,"实时&qu ...

随机推荐

  1. asp.net <asp:Repeater>下的 asp:LinkButton CommandArgument点击事件

    前台 <asp:Repeater ID="rptData" runat="server" OnItemCommand="rptData_Item ...

  2. ubuntu 14.04 安装 gflags

    1.下载 git clone https://github.com/gflags/gflags 2.编译 进入源码目录(即gflags文件夹) cmake . make -j 24 sudo make ...

  3. LIBS+=

    ZC: “LIBS+=”是要结合“LIBPATH += ”一起使用的?类似下面的用法: ZC: “LIBS+=”指明lib文件的名称,“LIBPATH += ”指明lib文件的路径.最后还要把DLL文 ...

  4. STL_算法_中使用的函数对象

    写在前面: STL算法中的 函数对象的功能: (1).都是提供一种比较的函数,比较相邻的左右两个值的 相等/大小 等的关系, (2).返回值都是bool :该返回值 貌似是指明 遍历元素是否还要继续往 ...

  5. 《剑指offer》第二十七题（二叉树的镜像）

    // 面试题27:二叉树的镜像 // 题目:请完成一个函数,输入一个二叉树,该函数输出它的镜像. #include <iostream> #include "BinaryTree ...

  6. JavaScript权威指南--脚本化文档

    知识要点 脚本化web页面内容是javascript的核心目标. 第13章和14章解释了每一个web浏览器窗口.标签也和框架由一个window对象所示.每个window对象有一个document对象, ...

  7. stats.js随时查看fps

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. Maven常用dependency记录

    1.servlet配置 <dependency> <groupId>junit</groupId> <artifactId>junit</arti ...

  9. JAVA反射会降低你的程序性能吗?

    原文出处 早两天写了<从把三千行代码重构成15行代码谈起>这篇文章,看到评论中有一些同学的回复还是在质疑反射的性能,好像程序用上了反射,就像开上了拖拉机似的.本来我觉得这个话题没有什么好讨 ...

  10. Confluence 6 LDAP 成员结构设置

    用户组成员属性(Group Members Attribute) 这个属性字段将在载入用户组成员的时候使用.例如: member 用户成员属性(User Membership Attribute) 这 ...