jQuery(一)：jQuery介绍以及jQuery如何定位寻找一个元素、查找筛选器、练习【左侧菜单】

您所在的位置：网站首页 › jquery找到指定元素的第二个元素 › jQuery(一)：jQuery介绍以及jQuery如何定位寻找一个元素、查找筛选器、练习【左侧菜单】

jQuery(一)：jQuery介绍以及jQuery如何定位寻找一个元素、查找筛选器、练习【左侧菜单】

2024-07-03 02:10| 来源: 网络整理| 查看: 265

一、jQuery的基本语法：$(selector).action()

等同于：jQuery(selector).action();简单说明：在JS的jQuery库中，$就是jQuery;是代表jquery对象的；

简单举例：

hello $("div").css("color","red") 二、寻找元素（jQuery的选择器和筛选器） 1.基本选择器 $("*"):通用，表示找到所有的标签进行操作； $("#id")：通过id寻找元素，进行之后的操作； $(".class")：通过className寻找元素，进行之后的操作；可以一次性操作多个相同class的元素 $("element")：通过标签名字去寻找 $(".class,p,div")：多个标签同时被寻找；进行之后对这几个元素的操作 2.层级选择器 $(".outer div"):寻找class="outer"下的后代标签div标签； $(".outer>div")：寻找class="outer"下的子标签div标签； $(".outer+div"):寻找class="outer"的after毗邻标签div标签； $(".outer~div"):寻找class="outer"的after不严格要求毗邻标签div标签；同样的道理，基本选择器通过以上四种方式组合，可实现不同级的元素的选择； 3.基本筛选器 $("li:first"):在多个li标签中筛选第一个标签； $(".class:last"):在多个class标签中筛选最后一个标签； $("li:eq(0)"):在多个li标签中筛选出第一个标签；n表示标签的索引； $("li:even"):在多个li标签中筛选索引等于偶数的标签； $("li:odd"):在多个li标签中筛选索引等于奇数的标签； $("li:gt(2)")在多个li标签中筛选索引大于2的索引标签 $("li:lt(2)")在多个li标签中筛选索引小于2的索引标签总结：$(element/.class/组合选择：first/last/eq(n)/even/odd/gt/lt) 4.属性选择器 $('[id="div1"]'):寻找id="div1"的标签； $('[iThing="sb"][class="sss"]')：选择属性iThing="sb"且class属性等于sss的标签；属性选择器，非常实用！$('[属性名="值"]') 5.input选择器(只适用于input标签) $('[type="text"]')-----等同于---->$(":text")简写三、jQuery的筛选器（特殊）

上面讲述的基本筛选器：$("选择器：几种筛选")

下面这种就是，在你所筛选的元素的索引是一个变量的时候，推荐使用：

$("选择器").eq(n);

$("选择器").first();

……

四、查找筛选器 *******第一组： $("div").children(".test") # 找寻div标签下的儿子层class="test"的元素 $("div").find(".test") # 找寻div标签下的所有层class="test"的元素 *******第二组： $(".test").next() # 找寻class="test"标签下的同级的下面一个元素 $(".test").nextAll() # 找寻class="test"标签下的同级的下面所有元素 $(".test").nextUnitl("#id") # 找寻class="test"标签下的同级下面的元素直到id="id"的元素（备注：即一个范围里面的元素；这里只举例写了#id,其实其余的选择器都可以；两边不包含） *******第三组： $("div").prev() # 找寻div标签下的同级的上面一个元素，包含自己 $("div").prevAll() # 找寻div标签下的同级的上面所有元素，包含自己 $("div").prevUntil("#id") # 找寻div标签下的同级上面的元素直到id="id"的元素（备注：即一个范围里面的元素；这里只举例写了#id,其实其余的选择器都可以；包含自己，不包含上面边界） *******第四组： $(".test").parent() #寻找class="test"标签的上一级元素 $(".test").parents() #寻找class="test"标签的上一级，上两级……直到最上级的所有元素；一般不用 $(".test").parentUnitl(#id) #寻找class="test"标签的上一级，上两级……直到id="id"的所有元素； *******第五组：（重） $("div").siblings() #找寻div标签的上、下的所有兄弟标签

5.hasclass（.class值）：判断一个元素是否有某一个class属性

【本文地址】

jQuery(一)：jQuery介绍以及jQuery如何定位寻找一个元素、查找筛选器、练习【左侧菜单】

jQuery(一)：jQuery介绍以及jQuery如何定位寻找一个元素、查找筛选器、练习【左侧菜单】

今日新闻

推荐新闻