一、使用链接引入jquery库
二、jquery的基本的选择器
<1>元素选择器(标签选择器)
- $(
- function(){
- $("div").css("color","blue");
- $("div").css("text-align","center");
- }
- )
1.$(function(){})的意思是文档加载完成以后执行他内部的代码
2.$("div").css("color","blue")用来设置指定标签的样式的方法。
3.总结:jQ的对象.css("属性","属性值")来设置对象的样式
4.当css设置多个的时候代码有点冗余,所以我们可以简写成一个对象的形式,jQ对象.css({"属性一":"数值1","属性2":"数值2"...})
<2>Id选择器($("#id值"))
- $(
- function(){
- $("div").css("color","blue");
- $("#jq").css("color","yellow");
- $("div").css("text-align","center");
- }
- )
1.不同之处就是id前边加#,有点像css中布局的时候写style样式。下边的也是一样
<3>类选择器($(".类名"))
- $(
- function(){
- $("div").css("color","blue");
- $("div.red").css("color","red");
- $("#jq").css("color","yellow");
- $(".div").css("text-align","center");
- $("div#jq").css("color","black");
-
- }
当我们$("div.div1")的时候代表选中class是div1的div标签,当然id选择器也可以这么用。
<4>群组选择器($("选择器1, 选择器2,...");)
同时设置多个选择器的样式。
- $(
- function(){
- $("div#jq,div.red").css("color","black");
-
- }
<5>通配符选择器($("*"))
使用这个的时候代表全部标签。