JQuery基础

最新推荐文章于 2025-04-08 19:16:28 发布

lxc1990425

最新推荐文章于 2025-04-08 19:16:28 发布

阅读量383

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript 文章标签： Jquery入门

本文链接：https://blog.youkuaiyun.com/lxc1990425/article/details/37878041

2 篇文章

订阅专栏

1、jQuery 是一个 JavaScript 库。

2、jQuery 库包含以下特性：

3、引用JQuery库

<head>
<script src="/jquery/jquery-1.11.1.min.js">
</head>

4、JQuery语法基础

基础语法是：$(selector).action()

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

$("p").hide() - 隐藏所有段落

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

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

5、文档就绪函数

jQuery 函数位于一个 document ready 函数中：

$(document).ready(function(){
--- jQuery functions go here ----
});

这是为了防止文档在完全加载（就绪）之前运行 jQuery 代码。

6、JQuery选择器

语法	描述
$(this)	当前 HTML 元素
$("p")	所有 <p> 元素
$("p.intro")	所有 class="intro" 的 <p> 元素
$(".intro")	所有 class="intro" 的元素
$("#intro")	id="intro" 的元素
$("ul li:first")	每个 <ul> 的第一个 <li> 元素
$("[href$='.jpg']")	所有带有以 ".jpg" 结尾的属性值的 href 属性
$("div#intro .head")	id="intro" 的 <div> 元素中的所有 class="head" 的元素

7、通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法。 8、jQuery 拥有下面四种 fade 方法：

jQuery fadeIn() 用于淡入已隐藏的元素。

jQuery fadeOut() 方法用于淡出可见元素。

jQuery fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。

jQuery fadeTo() 方法允许渐变为给定的不透明度（值介于 0 与 1 之间）。

9、jQuery 拥有以下滑动方法：

jQuery slideDown() 方法用于向下滑动元素。

jQuery slideUp() 方法用于向上滑动元素。

jQuery slideToggle() 方法可以在 slideDown() 与 slideUp() 方法之间进行切换。

10、jQuery animate() 方法用于创建自定义动画。

$(selector).animate({params},speed,callback);

必需的 params 参数定义形成动画的 CSS 属性。

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是动画完成后所执行的函数名称。

11、Chaining 将动作和方法链接起来