jq day-01 jq引入 dom对象和jq对象相互转化 $(this) 与 this window.onload 与 $(document).ready()区别css() 连缀 基本选择器 pre

jq day-01

回顾js

1.创建正则方法：
	1.1 var reg = /o+/g;
	1.2 var reg = new RegExp(/o+/,"g")
2.元字符简写
	.
	\d
	\w
	\s
	[\u4e00-\u9fff] 简体中文
3.量词简写
	+
	?
	*
4.手机号正则
	/^0?1{1}[3-9]{1}[0-9]{9}$/
	/^0?1[3-9]\d{9}$/

jq引入

        $:是函数名，等价于jQuery
        $():函数调用，
        	函数参数：可以字符串类型，js对象，函数
            作用：
            	1.获取元素 
            	2.将js对象转化为jq对象 

dom对象和jq对象相互转化

dom对象 转化 jQuery对象：
	$(dom对象)
jQuery对象 转化为 dom对象:
      1. $("div")[0]
      2.$("div").get(0)

$(this) 与 this

$(this) 和 this 关键字 都是指向当前操作对象，
$(this)是jq对象，this是dom对象

window.onload 与 $(document).ready()区别

1.onload:页面加载完成  dom/css/js/图片/音频/视频等加载完成   只能执行一次 
2..ready:dom加载完成之后，dom   多次执行，按照顺序加载
  

css()

作用：改变被选中元素的行内样式
参数：两个参数：一个属性名字符串，一个属性值字符串
	或者一个参数：样式属性对象
	
返回值：添加样式之后的自身
			$(".c1").css("color","red").css("fontSize","40px")

		$(".c1").css({
						"color":"red",
						"fontSize":"40px",
						"background":"green",
						"border":"1px solid #ccc"
					});

连缀

前提是：jq函数的返回值是处理之后的自身
$(".c1").css("color","red").css("fontSize","40px").css("background","green").css("border","1px solid #ccc");//连缀现象

基本选择器

标签选择器：$("div")
id选择器：$("#box")
类名选择器：$(".box")
全局选择器:$("*")
后代选择器：$("ul li")
子代选择器：$("ul>li")
交集选择器：$("li.c1") $("li#c1")
群组选择器：$("ul,ol,li")
兄弟选择器：
	$("div+p") 相邻的下一个兄弟  等价于 $("div").next("p")
	$("div~p") 下面所有的兄弟 等价于 $("div").nextAll("p")
	

prev()/prevAll()/next()/nextAll()

prev():相邻的上一个兄弟
prevAll():上面所有的兄弟元素
next():相邻的下一个兄弟
nextAll():下面所有的兄弟元素