JQuery 选择器和事件

JQuery 选择器

 1 <body>
 2     <%--页面代码--%>
 3     <form id="form1" runat="server">
 4         <div id="div1" class="div" aaaa="aaa">
 5             <p>1111</p>
 6         </div>
 7         <div id="div2" class="div" aaaa="bbb">
 8             2222
 9         </div>
10         <div id="div3" class="div">
11             3333
12         </div>
13         <div id="div4" class="div">
14             4444
15         </div>
16     </form>
17 </body>
18 </html>
19 <script>
20     //一.基本选择器
21     // 1.基本选择 
22     //     ID选择器  $("#div")
23     $("#div1")
24     //     class 选择器 $(".div")
25     $(".div")
26     //     标签选择器 $("标签名")
27     $("p")
28     // 2.组合选择
29     //     并列用,隔开$("#div,#div")
30     $("#div1,#div2")
31     //     后代 用空格隔开 $("#div div")
32     $(".div p")
33     // 二.过滤选择器
34     //     1.基本过滤
35     //     取首个 ：first 取尾个：last  大于 :gt(索引号) 小于：it(索引号) 排除：not(选择器) 奇数 :odd 偶数:even
36     $(".div:firt")
37     $(".div:not(#div1)")
38     //     等于 任意个 ：eq(索引号)
39     $(".div:eq(2)")
40     //也可以用
41     $(".div").eq(2)
42     // 2.属性过滤
43     //     属性名过滤 [属性名]
44     $(".div[aaaa]")
45     //     属性的名值对 过滤[属性名=值][属性名!=值]
46     $(".div[aaaa!=bbb]")
47     // 3.内容过滤
48     //     文字：contains("字符创")
49     $(".div:contains('2')")
50     //     子元素：has 选择器
51 </script>
选择器

 

JQuery 事件

常规事件 :把js中的事件去掉on就是JQuery的常规事件

js中的事件

onclick: 鼠标单击触发
ondblclick: 双击触发
onmouseover: 鼠标移动上面触发
onmouseout: 鼠标离开时触发
onmousemove: 鼠标在上面移动时触发
onchange: 只要内容改变触发
onblur: 失去焦点时触发
onfocus: 获得焦点时触发
onkeydown: 按键按下的时候触发
onkeyup：按键抬起来的时候触发
onkeypress：事件在用户按下并放开任何字母数字键时发生。但是系统按钮（例如：箭头键、功能键）无法得到识别

复合事件

hover（a,b）相当于把mouseover()和mouseout()和二为一

toggle(a,b,c)点击事件循环执行

未来元素 页面加载完成后对用js后添加到页面的元素操作使用未来元素

对象.live(“事件名”，function（）{})；

事件冒泡

阻止事件冒泡方法 retrun false

 

posted on 2017-02-10 11:09  胡了个凡  阅读(337)  评论(0)    收藏  举报

导航