//添加一个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. Java实现冒泡排序算法

    一.基本思路: 冒泡排序是一种简单的交换类排序.其基本思路是,从头开始扫描待排序的元素,在扫描过程中依次对相邻元素进行比较,将关键字值大的元素后移.每经过 一趟排序后,关键字值最大的元素将移到末尾,此 ...

  2. 【Golang】字符串首字母大小写转化

    写在前面 在自动化过程中,我们用得最多的可能就是字符串的处理,熟悉Python的都知道在Python中要让一个字符串的首字母大写直接用capitalize就可以了,但是同样的事情在Golang中没有这 ...

  3. Shell循环输入符合条件为止

    提供用户输入,直到输入d/D/r/R为止. #!/bin/bash ]; do echo -n "(D)ebug or (R)elease?" read select_build_ ...

  4. asp.net Core MVC + webpack 笔记

    webpack 是一个打包工具,用在asp.net Core MVC 会觉得有必要吗? MVC 本身就有bundler~ 如果用过webpack就会知道,打包出来的效果结果就是不一样,MVC的打包就是 ...

  5. putty xming gnome-session

    在windows里远程连接linux的最好方法. 比VNC方式好多了 1) xming启动一个窗口 2) putty 设置完X11 forwarding之后,远程登录 3) 在putty 里启动 gn ...

  6. Linux 设置程序开机自启动 （命令systemctl 和 chkconfig用法区别比较）

    之前在Linux centos 7 上安装了apache 和mysql,当时并没有设置开机自动启动. 最近又重新练习网页,每次开机总是要手动启动httpd和mysqld,不方便,就想设置成开机自动启动 ...

  7. React 介绍

    ttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind The sm ...

  8. js获取表格视图所选行号的ids

    实例化数组 遍历所选行push到数组中 将数组join转换为以,分割的字符串 /*获取指定id的datagrid的表格视图的选择的ids*/ function getDataGridSelectRow ...

  9. python-day43--多表查询

    一.多表连接查询:       #重点:外链接语法 准备表 #建表 create table department( id int, name varchar(20) ); create table ...

  10. VS2015新建项目时,左侧面板空白的解决方法

    解决办法是: 1.进入"C:\Users\当前用户名(一般为administrator)\AppData\Local\Microsoft\VisualStudio\14.0" 2. ...