jQuery基础——使用选择器—3属性选择器与表单选择器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery 选择器示例</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
// 使用属性选择器选取具有特定属性的元素
$('div[id]').css('color', 'red'); // 选取所有具有id属性的div元素，并将其字体颜色设置为红色
// 使用表单选择器选取表单中的元素
$('#myForm input:enabled').css('border', '2px solid green'); // 选取id为myForm的表单中所有启用状态的input元素，并设置边框样式
});
</script>
</head>
<body>
<div id="d1">我有id属性</div>
<div class="c2">我有class属性</div>
<form id="myForm">
<input type="text" name="username" disabled>
<input type="password" name="password">
<input type="submit" value="提交">
</form>
</body>
</html>这个示例代码首先使用属性选择器[id]来选取所有具有id属性的div元素，并将它们的文本颜色设置为红色。接着，它使用表单选择器以及:enabled伪类来选取一个表单中所有启用状态的input元素，并设置它们的边框样式。这些选择器是jQuery中非常基础且常用的，对于学习jQuery的开发者来说，这是一个很好的入门示例。
评论已关闭