## jQuery选择器
先看看w3cschool的对jQuery的概述:
jQuery 选择器允许您对 HTML 元素组或单个元素进行操作。
jQuery 选择器基于元素的 id、类、类型、属性、属性值等"查找"（或选择）HTML 元素。它基于已经存在的 CSS 选择器，除此之外，它还有一些自定义的选择器。
jQuery 中所有选择器都以美元符号开头：$()。
最常用的有以下三个：
1. 元素选择器
$("div")2. ID选择器
$("#ID")3. class选择器
$(".test")这里有更多的选择器实例 w3cschool jquery选择器
下面这个demo，包含了以上链接的实例练习：
<!DOCTYPE html><html><head> ???<meta charset="utf-8" /> ???<meta http-equiv="X-UA-Compatible" content="IE=edge"> ???<title>jquery 选择器学习</title> ???<meta name="viewport" content="width=device-width, initial-scale=1"> ???<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script> ???<script> ???$(document).ready(function(){ ???????$('*').css('font-size','30px'); ????//选取所有元素 设置字体 ???????$('#a').css('background','green'); ?//id选择器 设置背景颜色 绿色 ???????// alert($('#a')); ???????// alert(document.getElementById('a')); ???????$('.b').css('background','blue'); ??//.class选择器 设置背景颜色 蓝色 ???????$('p').css('background','yellow'); ?//元素选择器 设置背景颜色 黄色 ???????$('#a span').css('border','2px solid yellow'); ?????//后代选择器 设置黄色边框 ???????$('div:first').css('border','3px solid red'); ????//伪类选择器 选择第一个div ?设置红色边框 ???????$('p.test').css('background','gray'); ??//选择class为test的p元素 ???????????????//ul-------------------------- ???????$('ul li:first').css('border','2px solid red'); ?//选择第一个ul的第一个li 设置红色边框 ???????????????$('ul li:last-child').css('color','green'); ????//选择所有ul下的最后一个li 设置绿色字体 ???????????????$('[href]').html('我是带href属性元素'); ????//选择带href属性的元素 修改元素内容为‘我是带href属性元素’ ???????$("a[target='_blank']").html("我是带target='_blank'属性的a标签"); ???//选择带target='_blank'属性的a标签 ???????$(':button').css('background','green'); ????//选择type=button的input,或者<button>标签 设置绿色 ???????$('li:even').css('background','#999'); ???//选择偶数位置的li 设置#333背景 ???????$('li:odd').css('background','pink'); ???//选择偶数位置的li 设置#333背景 ???}) ???</script></head><body> ???<div id="a"> ???????A ???????<span>span</span> ???</div> ???<div class="b"> ???????B ???</div> ???<p>p</p> ???<p class="test">选择class为test的p元素</p> ???<hr> ???<ul> ???????<li>0</li> ???????<li>1</li> ???????<li><a target="_blank">2</a></li> ???????<li>3</li> ???</ul> ???<ul> ???????<li>0</li> ???????<li>1</li> ???????<li><a href="#">2</a></li> ???????<li>3</li> ???</ul> ???<input style="width:350px" type="button" value="我是type=button的input"> ???<br> ???<button>button</button></body></html>jQuery(1)——jQuery选择器
原文地址：https://www.cnblogs.com/famine/p/9718069.html