JQuery基础语法总结

最新推荐文章于 2024-09-08 12:54:53 发布

qq_40754146

最新推荐文章于 2024-09-08 12:54:53 发布

阅读量1k

点赞数 1

分类专栏：前端文章标签： JQuery

本文链接：https://blog.csdn.net/qq_40754146/article/details/90815250

版权

这篇博客详细总结了JQuery的基础语法，包括如何引用百度CDN，JQuery的选择器（如基础、层级、过滤选择器），动画效果（显示、隐藏、淡入淡出、滑动及自定义CSS动画），DOM操作（获取和设置内容、属性、添加删除元素、操作CSS类），DOM遍历（向上、向下、同级遍历和过滤方法）以及事件处理（常用事件和事件绑定）。通过学习，读者可以全面了解JQuery的基本使用方法。

摘要由CSDN通过智能技术生成

JQuery笔记

write less，do more

引用百度CDN

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

JQuery语法

1.文档就绪函数

$(function()
{

});

2.JQuery选择器

基础选择器

$("#testId")     //id选择器

$(".className")   //类选择器

$("p")   //元素选择器

$("*")  //全选择器（匹配所有元素）

$("div,span,p")  //组合选择器

层级选择器

$("div p")  //后代选择器

$("div>p")  //子代选择器

$("div + p")  //相邻选择器（一个）（同级）

$("div~p")   //兄弟选择器（多个）（同级）

过滤选择器

基本过滤选择器

$("li:first")    //第一个li

$("li:last")     //最后一个li

$("li:even")     //匹配索引值为偶数的元素（索引值从0开始计数）

$("li:odd")      //匹配索引值为奇数的元素（索引值从0开始计数）

$("li:eq(4)")    //匹配索引值为4的元素（索引值从0开始计数）也就是第五个元素

$("li:gt(2)")    //匹配索引值大于 2 的li

$("li:lt(2)")    //匹配索引值小于 2 的li

$("li:not(#test)") //匹配除 id="test" 以外的所有li

$("div:animated") //匹配正在执行动画的div元素

$("div:focus") //匹配当前获得焦点的div元素

内容过滤选择器

$("div:contains(test)")        // 匹配包含 test文本的div元素
$("div:has(p)")                //匹配含有指定选择器（如p）的div元素
$("td:empty")                 //匹配不包含子元素或者文本的空元素（td）
$("div:parent")