学习jquery必不可少的一项技能就是需要学会使用jquery查找和操作html元素whatsapp官网,这就是jquery选择器,小叶总结了下面一篇文章在我们开发中常用的jquery选择器的方法,欢迎收藏。
以下是一些常用的 jQuery 选择器及其实例代码:
1. 基本选择器
$("p").css("color", "red"); // 将所有
元素的文本颜色设置为红色
2. ID 选择器
$("#myId").hide(); // 隐藏 ID 为 myId 的元素
3. 类选择器
$(".myClass").addClass("newClass"); // 给所有 class 为 myClass 的元素添加 newClass
4. 属性选择器
$("input
type='text'
").val("Hello"); // 将所有 type 为 text 的 input 元素的值设置为 "Hello"
$("a
href='https://example.com'
").css("font-weight", "bold"); // 将所有 href 为 https://example.com 的 a 元素的字体加粗
5. 组合选择器
$("div p").css("background-color", "yellow"); // 选择所有在
内的
元素whatsapp网页版,并设置背景色为黄色
6. 层级选择器
$("div > p").css("border", "1px solid black"); // 选择所有直接在
下的
元素,并设置边框
7. 相邻兄弟选择器
$("h1 + p").css("margin-top", "0"); // 选择紧跟在 后面的
元素,并设置其上边距为 0
8. 通用兄弟选择器
$("h1 ~ p").css("color", "blue"); // 选择所有在 之后的
元素,并设置其文本颜色为蓝色
9. 子元素选择器
$("ul > li").css("list-style-type", "none"); // 选择所有直接在
$(":input").css("border", "1px solid gray"); // 给所有表单输入元素设置灰色边框
11. 表单对象选择器
$(":text").val("Enter your name"); // 设置所有单行文本框的默认值为 "Enter your name"
$(":checkbox").prop("checked", true); // 选中所有复选框
12. 内容过滤选择器
$("div:contains('Hello')").css("background-color", "lightgreen"); // 选择包含 "Hello" 文本的
元素whatsapp网页版,并设置背景色为浅绿色
$("div:empty").remove(); // 删除所有不包含子元素或文本的
元素
$("div:has(p)").css("border", "2px solid red"); // 选择包含
元素的
,并设置红色边框
$("div:parent").css("padding", "10px"); // 选择至少有一个子元素的
,并设置内边距为 10px
如果你觉得这篇文章对你有用,欢迎点赞收藏加关注哦。
Web前端开发HTML5+CSS3+JavaScript+Vue.js+jQuery网页设计制作Vu
¥69.8
京东好评率99%无理由退换京东配送旗舰店
购买
#智启新篇计划#