jQuery开发中容易忽视的错误
1、引用jQuery库文件的<script>标签,必须放在引用自定义脚本文件的<script>标签之前,否则,就会发生找不到对象;最好在<head>元素中,把引入样式表的<link />放在<script>标签前面;有时候其他的javascript库也会用$符号,为了不冲突,可以使用.noConflict()方法把控制权交给别的库.
<script src="prototype.js" type="text/javascript" />
<script src="jquery.js" type="text/javascript" />
<script type="text/javascript">
jQuery.noConflict();
</script>
<script src="myjs.js" type="text/javascript"/>
在使用jquery方法时,必须使用jquery代替$来调用。
2、基本选择符:标签名,${"p"};ID选择符,${"#idname"};类选择符,${".classname"}。
3、css选择符,举个例子来说
$(document).ready(function(){
$("#aSelect > li").addClass("aClass");
$("#aSelect li:not(.aClass)").addClass("otherClass");
});
上面第二行中的>就是元素组合符,查找ID为aSelect的元素的子元素(>)中所有的列表项。这个子元素,不包含孙元素。
上面第三行中的aSelect li,表示查找ID为aSelect的元素的所有下级列表项,包含孙元素。
4、属性选择符:$("img[alt]")就是选择所有带有alt属性的图像元素;另外,属性选择符允许以类似正则表达式的语法来标识字符串的开始(^)和结尾($),而且,也可以使用(*)表示位于字符串中任意位置的值,适用(!)来表示相反的值。
e.g.:
$(document).ready(function(){
$("a[href^=mailto:]").addClass("mailto");
});
5、自定义选择符,语法与css中的伪类选择符语法相同,以一个冒号开头,比如,我们要从某个集合里面选择第一项,可以使用下面的代码:
$("a[href^=http]:eq(0)")...
$("div:first-child")...
另外两个比较常用的自定义选择符是:odd和:even,分别对应选择奇数行和偶数行。
$("table tr:odd").addClass("odd");
$("table tr:even").addClass("even");
猜猜看:$("td:contains(a)").css("color","red");这会有什么效果?
6、基于表单的选择符,简单列举一下吧,有心人通过练习会明白的。
:text :checkbox :radio :image :submit :reset :password
:file :input :button :enabled :disabled :checked :selected
这些选择符可以链式使用,比如$(':radio:checked'),$(':text:enabled')等等。
7、.find()和.filter()的相同点和区别,他们都是遍历元素,区别就是find是对子集操作,filter是对自身集合元素操作。比如
var $find=$("div").find(".name"); 是对class为name的div内的元素操作,
var filter=$("div").filter(".name");是对所有class为name的div进行操作。
8、.next()下一个同辈元素;.nextAll()下面所有的同辈元素;
.prev()上一个同辈元素;.prevAll()上面所有的同辈元素;
.siblings()所有的同辈元素;.andself()包含自己;
.parent()父元素;.children()子元素;
.end()恢复最近依次破坏性对匹配元素集合的操作,返回到之前的匹配元素集合状态,返回匹配元素集合。
9、jQuery为标准的DOM事件都提供了相应的简写事件方法:
.blur .change .click .dbclick .error .focus .keydown .keypress .keyup .load .select .scroll
.mousedown .mouseover .mouseout .mousemove .mouseup .resize .submit .unload
10、复合事件
.toggle(fun1,fun2,fun3...)参数都是函数,第一次点击执行fun1,第二次点击执行fun2,依次类推,执行完以后,重新回到fun1开始。
.hover(fun1,fun2),当鼠标移动到一个匹配元素上面时(over),会触发指定的第一个函数。当鼠标移出这个元素时(out),会触发指定的第二个函数。
11、尽管解释起来很难,但是想象起来却很容易,div里面的一个元素被点击了,但是我们只想执行div的点击事件:(感兴趣的去了解事件捕获和事件冒泡)
$(document).ready(function(){
$("#divId").click(function(event){
if(event.target==this){
这里是事件执行代码...
}
});
});
另外还有直接阻止事件冒泡的方法.stopPropagation()
$("#divId .button").click(function(event){
这里是事件执行代码...
event.stopPropagation();
});
});
在这里我要说的是,上面两个例子,分别对应的是事件捕获和事件冒泡,不是一回事。
12、移除事件处理程序,直接看代码,很直观
$(function(){
$("#largeDiv").click(function(event){
事件处理代码
});
$("#largeDiv-firstChild").click(function(){
$("#largeDiv").unbind("click");
});
});
但是如果click里面的代码,有一部分要执行,有一部分不执行怎么办呢,.unbind()只能全部移除,其实,是可以解决的,给事件起个别名就好了
$("#largeDiv").bind('click.first',function(event){
第一个事件处理代码
});
第二个事件处理代码
});
$("#largeDiv-firstChild").click(function(){
$("#largeDiv").unbind("click.first");
});
});
13、类似.bind(),.one()只执行一次,还有.trigger('click')是模仿用户点击的事件,.trigger()方法提供了一组与bind方法相同的简写,但是结果不一样,只是触发操作而不是绑定行为:$("#divname").click();
14、.show() .hide() .fadeIn() .fadeOut()可以用不同的形式来实现展示和隐藏效果。具体自己研究吧,比较简单。
jQuery开发中容易忽视的错误的更多相关文章
- SQL开发中容易忽视的一些小地方(六)
原文:SQL开发中容易忽视的一些小地方(六) 本文主旨:条件列上的索引对数据库delete操作的影响. 事由:今天在博客园北京俱乐部MSN群中和网友讨论了关于索引对delete的影响问题,事后感觉非常 ...
- SQL开发中容易忽视的一些小地方( 三)
原文:SQL开发中容易忽视的一些小地方( 三) 目的:这篇文章我想说说我在工作中关于in和union all 的用法. 索引定义 : 微软的SQL SERVER提供了两种索引:聚集索引(cluster ...
- SQL开发中容易忽视的一些小地方(五)
原文:SQL开发中容易忽视的一些小地方(五) 背景: 索引分类:众所周知,索引分为聚集索引和非聚集索引. 索引优点:加速数据查询. 问题:然而我们真的清楚索引的应用吗?你写的查询语句是否能充分应用上索 ...
- SQL开发中容易忽视的一些小地方(一)
原文:SQL开发中容易忽视的一些小地方(一) 写此系列文章缘由: 做开发三年来(B/S),发现基于web 架构的项目技术主要分两大方面: 第一:C#,它是程序的基础,也可是其它开发语言,没有开发语言也 ...
- SQL开发中容易忽视的一些小地方(二)
原文:SQL开发中容易忽视的一些小地方(二) 目的:继上一篇:SQL开发中容易忽视的一些小地方(一) 总结SQL中的null用法后,本文我将说说表联接查询. 为了说明问题,我创建了两个表,分别是学生信 ...
- SQL开发中容易忽视的一些小地方(四)
原文:SQL开发中容易忽视的一些小地方(四) 本篇我想针对网上一些对于非聚集索引使用场合的某些说法进行一些更正. 下面引用下MSDN对于非聚集索引结构的描述. 非聚集索引结构: 1:非聚集索引与聚集索 ...
- Vue CLI 3开发中屏蔽的EsLint错误 (.eslintrc.js 在vue3+中 修改这个)
1.关闭eslint校验有了eslint的校验,可以来规范开发人员的代码,是挺好的.但是有些像缩进.空格.空白行之类的规范,在开发过程中一直报错,未免太过于苛刻了.所以,我还是会选择关闭eslint校 ...
- php开发中应该注意的错误开关与常见处理[开发篇]
我们可能一开始就接触一个项目的开发,刚开始时都是信心满满,一定把这个项目做得非常完美,但是时间那么少,任务那么多,我们就只有将就了. 首先,一般情况下,我们会加一个调试标志,define('APP_D ...
- Code::Blocks开发中的字符串编码错误
刚开始使用Code::Blocks开发Windows中文应用程序的朋友们,如果在代码中使用了中文字符串,编译时可能遇到过Illegal byte sequence或Failure to convert ...
随机推荐
- Python 更新dict
更新dict 对需要更新的key-value 直接赋值即可dict是可变的,也就是说,我们可以随时往dict中添加新的 key-value.比如已有dict:d = { 'Adam': 95, 'Li ...
- 【BIEE】安装好BIEE后,修改默认登录页面不为QuickStart页面
已经安装好了BIEE,但是发布了自己的资料库后,默认的登录页面为QuickStart,导致已登录就看到错误页面 现在进行如下修改即可 点击登录身份后的名字,例如我的是weblogic 选择[我的账户] ...
- 【Oracle】PL/SQL Developer 快捷键、使用技巧
1.类SQL PLUS窗口:File->New->Command Window,这个类似于oracle的客户端工具sql plus,但比它好用多了. 2.设置关键字自动大写:Tools-& ...
- 查看 apache、nginx、php、mysql 的编译参数
查看nginx编译参数:/usr/local/nginx/sbin/nginx -V 查看apache编译参数:cat /usr/local/apache2/build/config.nice 查看m ...
- 转:sock_ev——linux平台socket事件框架(event dispatcher) .
最近比较忙,好久没更新了:今天我们看一下事件的监听方式,在linux下面事件的监听方式有三种select.poll.epoll,性能上面epoll最高,如果仅是最多监听十多个描述符,用啥无所谓,如果是 ...
- Redis总结(四)Redis 的持久化(转载)
前面已经总结了Redis 的安装和使用今天讲下Redis 的持久化. redis跟memcached类似,都是内存数据库,不过redis支持数据持久化,也就是说redis可以将内存中的数据同步到磁盘来 ...
- C++ 编译,执行过程 具体解释。
要更深入了解C++, 必需要知道一个程序从開始到结束都干了些什么, 怎么干的. 所以我从C++编译到执行过程,解析下程序是怎么跑的. 首先,初略的说一下之前C++的编译过程.C++编译过程包含预编译- ...
- js ~取非运算符的妙用,将-1转为0(或假值)
典型的运用场景就是indexOf
- 常用maven 仓库地址
maven下载jar的时候会去寻国外的地址,因此造成了下载jar很缓慢,影响开发效率,于是就出现maven镜像地址,可以使我们开发人员迅速下载相关的jar. 在maven的config的setting ...
- Confluence - Online Team Collaboration Tool
Confluence - 在线的团队协作沟通工具,包含 meeting 管理, wiki 等等功能 https://www.atlassian.com/software/confluence