2021-05-07

JQuery语法~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

开发工具与关键技术：MVC

作者：肖丽姣

撰写时间：2021/5/8

• jQuery语法

jQuey语法是通过选取HTML元素，并对选取的元素执行某些操作

 

页面加载事件

两种写法，简洁写法效果相同

JQuery选择器~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

开发工具与关键技术：MVC

作者：肖丽姣

撰写时间：2021/5/8

 

JQuery选择器

JQuery选择器允许对您HTML元素组或单个元素进行操作

JQuery选择器基于元素的id、类、类型、属性、属性值等“查找”（或选择）HTML元素，它基于已经存在css选择器

除此之外，它还有其他一些自定义的选择器

JQuery中所有选择器都已美元符号开头:$()。

元素选择器

JQuery元素选择器基于元素名选取元素

在页面中选取所有<p></p>元素

 

#id选择器

JQuery #id选择器通过HTML元素的id属性选取指定的元素。

页面中元素的id应该是唯一的，所以您要在页面中选取位移的元素需要通过#id选择器

 

类选择器可以带有class=“.lis”属性的元素都隐藏

 

更多实例

语法	描述	语法	描述
$(“*”)	选取所有元素	$(“a[target=_blank]”)	选取所有target属性值等于“_blank”的<a>元素
$(this)	选取当前HTML元素	$(“a[target！=_blank]”)	选取所有target属性值不等于“_blank”的<a>元素
$(“p.intro”)	选取class为intro的<p>元素	$(“:button”)	选取所有type=”button”de <input>元素和<button>元素
$(“p.first”)	选取第一个<p>元素	$(“tr.even”)	选取偶数位置的<tr>元素
$(“ul li:first”)	选取第一个<ul>元素的第一个<li>元素	$(“tr.odd”)	选取奇数位置的<tr>元素
$(“ul li:first-child”)	选取每个<ul>元素的第一个<li>元素
$(“[href]”)	选取带有href属性的元素

 

JQuery事件方法~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

开发工具与关键技术：MVC

作者：肖丽姣

撰写时间：2021/5/8

在jQuery中，大多数DOM事件都有一个等效的jQuery方法

页面中指定一个点击事件：

$(“p”).click();

下一步是定义什么事件触发书剑，您可以通过一个函数实现；

$(“p”).click(function(){

//动作触发后执行的代码

})

 

 

常用的jQuery事件方法

 

$(document).ready()

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

Click()

Click()方法是当按钮点击事件被触发时会调用一个函数。

该函数在用户点击HTML元素时执行。

在下面实例中，当点击事件在某个<p>元素上触发时，隐藏当前的<p>元素；

Mouseenter()

当鼠标指针穿过元素时，会发生mouseenter事件。

Mouseenter()方法触发mouseenter事件，或规定当发生mouseenter事件时运行的函数。

 

.Mouseleave()

当鼠标指正离开元素时，会发生mouseleave事件

Mouseleave()方法触发mouseleave事件，或规定当发生mouseleave事件时运行的函数

 

 

 

.Mousedown（）

当鼠标指针移动到元素上方，并按下鼠标按键时，会发生 mousedown 事件。

mousedown() 方法触发 mousedown 事件，或规定当发生 mousedown 事件时运行的函数：

 

.Mouseup（）

当在元素上松开鼠标按钮时，会发生 mouseup 事件。

mouseup() 方法触发 mouseup 事件，或规定当发生 mouseup 事件时运行的函数：

 

.Hover()

hover()方法用于模拟光标悬停事件。

当鼠标移动到元素上时，会触发指定的第一个函数(mouseenter);当鼠标移出这个元素时，会触发指定的第二个函数(mouseleave)。

 

.Focus()

当元素获得焦点时，发生 focus 事件。

当通过鼠标点击选中元素或通过 tab 键定位到元素时，该元素就会获得焦点。

focus() 方法触发 focus 事件，或规定当发生 focus 事件时运行的函数：

 

.Blur()

当元素失去焦点时，发生 blur 事件。

blur() 方法触发 blur 事件，或规定当发生 blur 事件时运行的函数