1.基础选择器
id选择器: $("#id"), 样式选择器:$(".className"),元素选择器:$("div"),$("*") 选择页面所有的元素
同时使用两种选择器例如:id和元素 $("#id,div");,这里可以加上更多例如再加上一个样式的$("#id,div,.className");,
2.属性选择器
$("div[title]") 选择含有title的div元素;$("div[title]") 选择含有title=test的div元素 $("div[title=test]") ; 选择title属性不等于test的div元素:$("div[title!=test]"),这种选择方式会将没有title属性的div也选择上。
选择以title为te开始的div元素:$("div[title^=te]"),选择title以est结尾的div元素:$("div[title$=est]");选择title属性含有 es的div元素:$("div[title*=es]")
多选择器复合使用: 选择隐藏域,含有title的属性的div,id为one,class为one的元素 $("input[type=hidden],div[title,#one,.one]") ,这样取的对象结果为并集。
3.层级选择器
A.选择body下的所有的div元素
$("body div"); 请注意,这样选择的是body下的所有的子孙元素,例如div中还存在其他的div也会被选中。
B.选择body下的子div
$("body>div"); 请注意,这样选中的body的直接的子元素,也就是这样选择的是不包含孙元素div,区别就是加上了尖括号去掉了空格而已。
C.选择在laber元素下一个的的input元素,
$("laber+input"); 请注意,这样选择时,如果在htlm中存在两个laber元素,并且两个laber元素下面紧接着的都是input元素那么,这是会选中两个input元素。
D.选择和form元素同辈的后面的所有兄弟元素
$("form~div");这样选择的就是与form元素同级别的后面的所有div元素。
E.选择与id为test的元素同级别的所有的div元素
$("#test").parent().children("div"); 注意:先获取该元素的父元素再获取该元素的所有的子元素中的div元素。
怕什么真理无穷 进一寸有一寸的欢喜
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
· 现代计算机视觉入门之:什么是图片特征编码
· .NET 9 new features-C#13新的锁类型和语义
· Spring AI + Ollama 实现 deepseek-r1 的API服务和调用
· 《HelloGitHub》第 106 期
· 数据库服务器 SQL Server 版本升级公告
· 深入理解Mybatis分库分表执行原理
· 使用 Dify + LLM 构建精确任务处理应用