jquery基本选择器的用法解析

来源：互联网发布：vb for mac 编辑：程序博客网时间：2024/04/29 16:07

jquery基本选择器的用法解析

基本选择器的语法

1.AllSelector(*)
   所有选择器，获取当前页面中所有对象
2.ClassSelector(".class")
   类选择器，选择当前页面中拥有执行CSS类的对象
3.ElementSelector("element");
   元素选择器，选择指定标签名的选择器
4.ID Selector（"#id"）
   ID选择器，指定Id元素的对象
5.Multiple Selector("selector1,selector2,,,selectorN")
   组合选择器，对元素进行组合

下面是测试代码：

<!DOCTYPE html><html><head><meta charset="utf-8"><title>基本选择器</title><style>.astyle{font-size:28px;color:red;}.bstyle{font-size:40px;color:orangered;text-decoration:none;}</style><script src="js/jquery-1.11.3.js"></script><script>//文档就绪函数   $(function(){   //在页面加载完成后执行里面的语句   //CSS函数的含义是为jquery选中的对象设置指定的css属性   //1.*代表所有选择器   //jQuery("*").css("border","1px solid red");   //2.类选择器 ，使用的方法是$(".类名")或者是jQuery(".类名")   //$(".astyle").css("border","1px solid red");   //3.元素选择器，$("标签名")   //$("li").css("border","1px solid red");   //4.ID选择器，$("#id")   //$("#li3").css("border","1px solid red");   //5.组合选择器,将多个选择器的结果进行组合，使用方法是$("selector1,selector2,,,selectorN")   $("#li3,#a9,.astyle").css("border","1px solid red");   })</script></head><body><div><li>1.<a href="#">超链接1</a></li><li>2.<a href="#">超链接2</a></li><li id="li3">3.<a href="#">超链接3</a></li><li>4.<a href="#" class="astyle">超链接4</a></li><li>5.<a href="#">超链接5</a></li><li>6.<a href="#">超链接6</a></li><li id="li7">7.<a href="#" class="astyle">超链接7</a></li><li>8.<a href="#">超链接8</a></li><li>9.<a href="#" id="a9">超链接9</a></li><li>10.<a href="#" class="bstyle">超链接10</a></li></div></body></html>

0 0