//添加一个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. python group()--转载

    import re a = "123abc456" print re.search("([0-9]*)([a-z]*)([0-9]*)",a).group(0) ...

  2. Java中如何实现类似C++结构体的二级排序

    1:实现Comparable接口 import java.util.ArrayList; import java.util.Arrays; import java.util.Collections; ...

  3. [CentOS_7.4]Linux编译安装mono环境

    一 安装mono 安装过程: 下载mono安装源,配置,编译,安装,设置环境变量. # wget http://download.mono-project.com/sources/mono/mono- ...

  4. Charles Proxy License 破解

    // Charles Proxy License // 适用于Charles任意版本的注册码,谁还会想要使用破解版呢. // Charles 4.2目前是最新版,可用.   Registered Na ...

  5. 分析 HTML 代码并提取数据

    在前面的内容中,我们已经学习了 HTML.CSS 和 XPath 的基础知识.从真实世界的网页中获取数据,关键在于如何编写合适的 CSS 或者 XPath 选择器.本节介绍一些确定选择器的简单方法.假 ...

  6. Codeforces 534B - Covered Path

    534B - Covered Path 思路:贪心,每一秒取尽可能大并且可以达到的速度. 画张图吧,不解释了: 代码: #include<bits/stdc++.h> using name ...

  7. spring boot 启动报错(spring-boot-devtools热部署后)：The elements [spring.resources.cache-period] were left unbound. Update your application's configuration

    详细错误代码: *************************** APPLICATION FAILED TO START *************************** Descript ...

  8. highcharts图表配置参数汇总

    一.chart的部分相关属性说明    renderTo: 'container',      //图表的页面显示容器(也就是要显示到的div) chart.events.addSeries:添加数列 ...

  9. php-fpm.conf配置文件中文说明详解及重要参数说明

    摘自:https://www.jb51.net/article/148550.htm 感谢分享 php-fpm工作流程 php-fpm全名是PHP FastCGI进程管理器 php-fpm启动后会先读 ...

  10. uva-10561-nim

    题意: 给出一个连续的棋盘,有的位置为'.',有的位置为'X',二者轮流下子,当有一方获得连续三个子的时候取胜. 对于胜态,一种情况是当前局面出现"XX"/"X.X&qu ...