jquery之hasClass
看jquery的在线手册，hasClass的例子给的是这个
html部分：
<div class="protected"></div><div></div>
jquery部分：
$("div").click(function(){
if ( $(this).hasClass("protected") )
$(this)
.animate({ left: -10 })
.animate({ left: 10 })
.animate({ left: -10 })
.animate({ left: 10 })
.animate({ left: 0 });
});
照抄过来跑了下，怎么点都没有效果。
两个问题：
一、没给div设置样式
二、div没有left属性
最后代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>hasClass</title>
<script type="text/javascript" src="jquery/jquery-1.10.2.min.js"></script>
</head> <body>
<div style="width:100px; height:100px; border:solid 1px #000;"></div>
<div class="protected" style="height:100px; border:solid 1px #000; position:relative;left:100px;"></div>
<div style="width:100px; height:100px; border:solid 1px #000;"></div>
<script type="text/javascript">
$("div").click(function(){
if ( $(this).hasClass("protected") ){
$(this)
.animate({ left: -100 })
.animate({ left: 100 })
.animate({ left: -100 })
.animate({ left: 100 })
.animate({ left: 0 });}
});
</script>
</body>
</html>
然后阿姆斯特朗回旋加速喷气式阿姆斯特朗炮就成型啦
悲催，感觉这失误真低级......
PS：
不设置left也行，给个position，不论absolute、relative都行
jquery之hasClass的更多相关文章
- jQuery筛选--hasClass(class)和eq(index|-index)
hasClass(class) 概述 检查当前的元素是否含有某个特定的类,如果有,则返回true 参数 class 用于匹配的类名 <!DOCTYPE html> <html> ...
- [ jquery 过滤器 hasClass(class) ] 此方法用于在选择器的基础之上检查当前的元素是否含有某个特定的类，如果有，则返回true
此方法用于在选择器的基础之上检查当前的元素是否含有某个特定的类,如果有,则返回true 实例: <!DOCTYPE html> <html lang='zh-cn'> < ...
- 原生JavaScript实现jQuery的hasClass,removeClass,addClass,toggleClass
介绍: 1.hasClass:判断DOM元素是否存在类. 2.addClass:为的DOM元素添加类. 3.removeClass:删除DOM元素的类. 4.toggleClass:如果DOM元素存在 ...
- jQuery? 回归JavaScript原生API
如今技术日新月异,各类框架库也是层次不穷.即便当年漫山红遍的JQuery(让开发者write less, do more,So Perfect!!)如今也有被替代的大势.但JS原生API写法依旧:并且 ...
- jQuery第二篇 （帅哥）
1.1 jQuery操作DOM jQuery课程的目标:学会使用jQuery设计常见效果 选择器 基本选择器:#id ..class .element.* . 层级选择器: 空格.>.+.~ 基 ...
- jQuery 2.0.3 源码分析 样式操作
根据API分类 CSS addClass() jQuery.cssHooks .hasClass() .removeClass() .toggleClass() .addClass() 对元素的样式操 ...
- jQuery-1.9.1源码分析系列（二）jQuery选择器续2——筛选
前面分析了选择器的结构和几个解析函数,接下来分析jQuery对象的伪类选择器.这里所谓的jQuery对象的伪类选择器就是从已有的jQuery对象(元素集合)中筛选出指定的集合出来. 4. jQu ...
- You Don't Need jQuery
前端发展很快,现代浏览器原生 API 已经足够好用.我们并不需要为了操作 DOM.Event 等再学习一下 jQuery 的 API.同时由于 React.Angular.Vue 等框架的流行,直接操 ...
- jQuery修改class属性和CSS样式
jQuery修改class属性和CSS样式 class属性修改 类属性即class属性,规定类名. 用类选择器规定样式的时候,需要为元素指定类名,即class属性的值. 注意每个HTML元素只有一个c ...
随机推荐
- DDD为何叫好不叫座？兼论DCI与业务分析的方法论
今天,仔细阅读了园子里面的一个朋友写的<一缕阳光:DDD(领域驱动设计)应对具体业务场景,如何聚焦 Domain Model(领域模型)?>(http://www.cnblogs.com/ ...
- jQuery validate 根据 asp.net MVC的验证提取简单快捷的验证方式（jquery.validate.unobtrusive.js）
最近在学习asp.netMVC,发现其中的验证方式书写方便快捷,应用简单,易学好懂. 验证方式基于jQuery的validate 验证方式,也可以说是对jQuery validate的验证方式的扩展, ...
- 小清新的jQuery ck-slide 图片轮播
ck_slide 是一款小清新的jQuery 幻灯片插件,它非常小巧,压缩后仅 3KB,基本功能可以满足.它支持淡入淡出/左右滚动.箭头/圆点控制.自动播放. 在线实例 默认(淡入淡出) 左右滚动 自 ...
- [deviceone开发]-QQ分享、微信分享和新浪微博分享
一.简介 该demo主要实现QQ分享.微信分享和新浪微博分享.(调试包请到论坛扫描对应二维码下载) 二.效果图 三.相关讨论 http://bbs.deviceone.net/forum.php?mo ...
- 小白详细讲解快速幂--杭电oj2035-A^B
Problem Description 求A^B的最后三位数表示的整数.说明:A^B的含义是“A的B次方” Input 输入数据包含多个测试实例,每个实例占一行,由两个正整数A和B组成(1<= ...
- there is no spatial analyst license available or enabled
解决方案:右击license—属性
- 如何在windows计划中调用备份sharepoint2010网站集的powershell脚本
最近有个项目需要在在windows计划中使用powershell脚本备份sharepoint2010网站集,打开sharepoint的powershell执行命令管理界面的属性 查看: C:\Wind ...
- Python十六进制与字符串的转换
电脑上装了Python2.7和3.3两个版本,平时运行程序包括在Eclipse里面调试都会使用2.7,但是由于某些原因在cmd命令行中输入python得到的解释器则是3.3, 一直没对此做处理,因为这 ...
- Microsoft SharePoint Server 2013 Service Pack 1 （sp1）终于出来了！！！
Microsoft SharePoint Server 2013 Service Pack 1 终于出来了!以下是下载地址如下,大小1.25G. http://www.microsoft.com/zh ...
- Android 中的Json解析工具fastjson 、序列化、反序列化
Android中通常需要访问服务器,然而服务器返回的数据很多时候都是Json格式 1.fastjson简介 阿里巴巴FastJson是一个Json处理工具包,包括“序列化”和“反序列化”两部分,它具备 ...