zepto - toggleClass
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>zepto</title>
<style>
.main {
font-size: 120%;
color: red;
}
</style>
</head>
<body>
<h1 id="h1">This is a heading</h1> <p>This is a paragraph.</p> <p>This is another paragraph.</p>
<button class="btn1">切换段落的 "main" 类</button>
<script src="zepto.min.js"></script>
<script>
$("button").click(function () {
$("p").toggleClass("main");
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>zepto</title>
<style>
.listitem_1, .listitem_3 {
color: red;
} .listitem_0, .listitem_2 {
color: blue;
}
</style>
</head>
<body>
<h1 id="h1">This is a heading</h1>
<ul>
<li>Apple</li>
<li>IBM</li>
<li>Microsoft</li>
<li>Google</li>
</ul>
<button class="btn1">添加或移除列表项的类</button>
<script src="zepto.min.js"></script>
<script>
$("button").click(function () {
$('ul li').toggleClass(function () {
return 'listitem_' + $(this).index();
});
});
</script>
</body>
</html>
zepto - toggleClass的更多相关文章
- 原生JavaScript实现hasClass、addClass、removeClass、toggleClass
兼容IE6+,因IE6.IE7.IE8不支持Array.prototype.indexOf()和String.prototype.trim(),分别用Polyfill实现支持. 详细: indexOf ...
- [原创]zepto打造一款移动端划屏插件
最近忙着将项目内的jquery 2换成zepto 因为不想引用过多的zepto包,所以花了点时间 zepto真的精简了许多,源代码看着真舒服 正好项目内需要一个划屏插件,就用zepto写了一个 逻辑其 ...
- Zepto中文API
原文地址:http://zeptojs.com/ 译文地址:http://www.html-5.cn/Manual/Zepto/ Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, ...
- 学习zepto.js(对象方法)[1]
zepto也是使用的链式操作,链式操作:函数返回调用函数的对象. 但并不是所有的对象方法都可以进行链式操作,举几个例子:.size(),.html()|.text()//不传参数的情况下; 若非特殊说 ...
- Zepto源码
// Zepto.js // (c) 2010-2016 Thomas Fuchs // Zepto.js may be freely distributed under the MIT licens ...
- zepto.js 源码解析
http://www.runoob.com/w3cnote/zepto-js-source-analysis.html Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与jqu ...
- zepto源码注解
/* Zepto v1.0-1-ga3cab6c - polyfill zepto detect event ajax form fx - zeptojs.com/license */ ;(funct ...
- zepto源代码解读
/** * Created by nono on 14-11-16. */ /* Zepto v1.1.4 - zepto event ajax form ie - zeptojs.com/licen ...
- Zepto源码注释
/* Zepto v1.0-1-ga3cab6c - polyfill zepto detect event ajax form fx - zeptojs.com/license */ ;(funct ...
随机推荐
- django with mysql (part-1)
step01: django-admin.py startproject dj01 step02: cd dj01 tree step03: python manage.py runserver Th ...
- Atitit.实现反向代理(1)----url rewrite 配置and内容改写 and -绝对路径链接改写 java php
Atitit.实现反向代理(1)----url rewrite 配置and内容改写 and -绝对路径链接改写 java php 1. 代理的实现:::普通代理and反向代理?? 1 2. url ...
- atitit.eclipse 新特性总结3.1--4.3
atitit.eclipse 新特性总结3.1--4.3 Eclipse 3.1 1 Eclipse 3.2 Java开发工具的新特性 2 1. 内容辅助(Ctrl+Space)模板 2 2. 动态地 ...
- IOS—静态方法(类方法)和实例方法
1.实例方法/动态方法 a).标识符:- b).调用方式:(实例对象 函数) c).实例方法在堆栈上. 2.静态方法/类方法 a).标识符:+ b).调用方式:(类 函数) c).静态方法 ...
- Leetcode 9 Palindrome Number 数论
判断一个数是否是回文数 方法是将数回转,看回转的数和原数是否相同 class Solution { public: bool isPalindrome(int x) { ) return false; ...
- Windows出现BOOT\BCD错误的解决办法
这篇文章主要介绍了Windows出现BOOT\BCD错误的解决办法,本文讲解使用命令的方式解决这个问题,需要的朋友可以参考下 一般碰到 Boot Record Error 问题用系统盘自动修复一下就可 ...
- Ubuntu下vsftpd配置实例，超级简单，高度可用
看了网上很多关于vsftpd的安装配置教程,发现很多都是不可以用的,经过多次尝试,总结了一个最简单的设置方法. 第一步:安装vsftpd sudo apt-get install vsftpd 第二步 ...
- jQuery之Deferred对象详解
deferred对象是jQuery对Promises接口的实现.它是非同步操作的通用接口,可以被看作是一个等待完成的任务,开发者通过一些通过的接口对其进行设置.事实上,它扮演代理人(proxy)的角色 ...
- UiAutomator源代码分析之UiAutomatorBridge框架
上一篇文章<UIAutomator源代码分析之启动和执行>我们描写叙述了uitautomator从命令行执行到载入測试用例执行測试的整个流程.过程中我们也描写叙述了UiAutomatorB ...
- 关于execel单元格中的数字变成文本（左上角带绿色三角形标志）的办法
对于很多软件,需要将数字变成文本,才能导入到该系统当中.在excel当中,如果数字是以文本的形式存储,在左上角是带有绿色的三角形标志的.如果对于大批量数据,操作方法如下:1将目标列数据copy到记事本 ...