码迷,mamicode.com
首页 > Web开发 > 详细

JQuery基础

时间:2017-09-07 23:07:52      阅读:256      评论:0      收藏:0      [点我收藏+]

标签:元素选择器   html   key   键盘事件   ajax   隐藏   cti   resize   类型   

什么是jQuery?

JQuery是一个JavaScript函数库,主要包含以下功能:

1、HTML元素提取、操作

2、CSS操作

3、HTML事件操作

4、JavaScript特效和动画

5、HTNL DOM便利和修改

6、AJAX

7、Utillties

 

JQuery语法

基础语法:$(selector).action

1、美元符号定义jQuery

2、选择符(selector)‘查询’和‘查找’HTML元素

3、jQuery的action()执行对元素的操作

实例

$(this).hide():隐藏当前元素

$(“p”).hide():  隐藏所有<p>元素

$("p.test").hide(): 隐藏所有 class="test" 的 <p> 元素

$("#test").hide() - 隐藏所有 id="test" 的元素

语法

$("*")

选取所有元素

$(this)

选取当前 HTML 元素

$("p.intro")

选取 class 为 intro 的 <p> 元素

$("p:first")

选取第一个 <p> 元素

$("ul li:first")

选取第一个 <ul> 元素的第一个 <li> 元素

$("ul li:first-child")

选取每个 <ul> 元素的第一个 <li> 元素

$("[href]")

选取带有 href 属性的元素

$("a[target=‘_blank‘]")

选取所有 target 属性值等于 "_blank" 的 <a> 元素

$("a[target!=‘_blank‘]")

选取所有 target 属性值不等于 "_blank" 的 <a> 元素

$(":button")

选取所有 type="button" 的 <input> 元素 和 <button> 元素

$("tr:even")

选取偶数位置的 <tr> 元素

$("tr:odd")

选取奇数位置的 <tr> 元素

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

JQuery选择器的类型

1、 元素选择器:$(“p”)

2、 #id选择器:#(“#p”)

3、.class选择器:$(“.p”)

 

JQuery事件:

页面对不同访问者的响应叫做事件

常见的DOM事件:

鼠标事件

键盘事件

表单事件

文档/窗口事件

click

keypress

submit

load

dblclick

keydown

change

resize

mouseenter

keyup

focus

scroll

mouseleave

 

blur

unload

 

 

 

 

 

 

 

 

 

常用的JQuery事件方法:

$(document).ready() 方法允许我们在文档完全加载完后执行函数。

click(): 是当单击按钮时被触发调用一个函数;

dblclick(): 当双击按钮是被触发调用的一个函数;

mouseenter(): 当鼠标指针穿过元素时触发的事件;

mouseleave(): 当鼠标指针离开元素时触发的事件;

mousedown(): 当鼠标指针移动到元素上方,并按下鼠标按键时触发的事件;

mouseup(): 当在元素上松开鼠标按钮时触发的事件;

hover(): 用于模拟光标悬停事件;

focus(): 当元素获得焦点时触发的事件

blur(): 当元素失去焦点时触发的事件

JQuery基础

标签:元素选择器   html   key   键盘事件   ajax   隐藏   cti   resize   类型   

原文地址:http://www.cnblogs.com/acmyun/p/7492043.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!