阅读量:0
在jQuery中，选择器用于查找和选择HTML元素。常见的选择器有ID选择器、类选择器、标签选择器等。
读jQuery之三（构建选择器）
通过id获取元素
| 选择器 | 描述 |
$('#id') | 该元素是唯一的，通过id获取。 |
通过className获取元素
| 选择器 | 描述 |
$('.cls') | 获取文档中所有className为cls的元素。 |
$('.cls', el) | 在指定元素el中获取className为cls的元素。 |
$('.cls', '#id') | 在指定id的元素中获取className为cls的元素。 |
$('span.cls') | 获取文档中所有className为cls的span元素。 |
$('span.cls', el) | 在指定元素el中获取className为cls的span元素。 |
$('span.cls', '#id') | 在指定id的元素中获取className为cls的span元素。 |
通过tagName获取元素
| 选择器 | 描述 |
$('span') | 获取文档中所有的span元素。 |
$('span', el) | 在指定元素el中获取span元素。 |
$('span', '#id') | 在指定id的元素中获取span元素。 |
通过attribute获取元素
| 选择器 | 描述 |
$('[name]') | 获取文档中具有属性name的元素。 |
$('[name]', el) | 在指定元素el中获取具有属性name的元素。 |
$('[name]', '#id') | 在指定id的元素中获取具有属性name的元素。 |
$('[name=uname]') | 获取文档中所有属性name=uname的元素。 |
$('[name=uname]', el) | 在指定元素el中获取属性name=uname的元素。 |
$('[name=uname]', '#id') | 在指定id的元素中获取属性name=uname的元素。 |
$('input[name=uname]') | 获取文档中所有属性name=uname的input元素。 |
$('input[name=uname]', el) | 在指定元素el中获取属性name=uname的input元素。 |
$('input[name=uname]', '#id') | 在指定id的元素中获取属性name=uname的input元素。 |
示例代码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>zchain test</title> <script src="https://files.cnblogs.com/snandy/zchain-0.3.js"></script> </head> <body> <div id='content'>aaa</div> <div>bbb</div> <p class="pra">ccc</p> <input type="submit" value="submit"/> <input type="button" value="submit"/> <script type="text/javascript"> var obj1 = $("#content"); // id var obj2 = $('div'); // tagName var obj3 = $('.pra'); // className var obj4 = $('input[type=button]'); // attribute console.log(obj1); console.log(obj2); console.log(obj3); console.log(obj4); </script> </body> </html>相关问题与解答
问题1：如何通过id选择器来隐藏一个特定的元素？
答：可以通过以下代码实现：
$(document).ready(function() { $("#id").hide(); });这段代码会在文档加载完成后隐藏id为“id”的元素。
问题2：如何选取页面上所有的<p>元素并改变它们的文本颜色？
答：可以通过以下代码实现：
$(document).ready(function() { $("p").css("color", "red"); });这段代码会在文档加载完成后将所有<p>元素的文本颜色改为红色。
到此，以上就是小编对于“读jQuery之三（构建选择器）-jquery”的问题就介绍到这了，希望介绍的几点解答对大家有用，有任何问题和不懂的，欢迎各位朋友在评论区讨论，给我留言。
