选择器用于查找DOM上的元素。jQuery可通过各类条件选取元素,例如前面用到的$("#元素Id"),根据元素id获取jQuery对象,等价于原生getElementById。
jQuery提供多种选择器:
- ID选择器
$('#main').css('color', 'red');
$('#div1').html("<font color=red>hello</font>"); // 修改div1内部html
Code language: JavaScript (javascript)
- 标签选择器 通过
$("标签名")选取页面所有对应标签,等价于getElementsByTagName
$("div").html("所有div内部html都改成我了");
Code language: JavaScript (javascript)
- 类选择器 根据class类名选取元素
$(".intro").click(function(){alert('你好吗');})
Code language: JavaScript (javascript)
- 复合选择器 多个选择规则组合,同时选取多类元素
$("div,span.intro"); // 同时选取div标签和带有intro类的span元素
Code language: JavaScript (javascript)
- 层次选择器 页面id、class重复较多时,可用层次选择器缩小查找范围
$("div li"):选取div下所有后代li(子、孙子等所有层级)$("div > li"):选取div下直接子元素li$("div + li"):选取div紧邻后面的第一个li元素$("div ~ li"):选取div后面所有同级li元素
Previous: 当DOM加载完毕时候执行和了解jQuery的函数
Next: jQuery – DOM操作-获得内容和属性