jQuery基本语法

支持链式结构：

JQuery在使用部分函数后会返回一个JQuery对象，因此可以使用链式调用。

$("#divFirst")
				.text('Hello World')
				.css('color','red')
				//.find('p.child')
				//.end()
				.addClass('aaa');
		}, 2000)

注意：在调用部分函数时，部分函数有破坏性（不在返回原来的JQuery对象例如find()），可以使用end()来返回上一次查询的对象。 还有部分语法返回DOM对象如get()。这时再往下写链式结构就会报错。

ready()方法：

等待元素加载时，我们一般会使用onload或者load元素，但是这两种方法必须等DOM元素中的元素（例如图片，第三方网站等等）完全加载完毕时才能执行下面的方法。这时我们就可以使用ready（）方法，这个方法只要等DOM元素加载出来即可执行下面的语句。（在我们必须要等待完全加载的情况下，我们建议使用load方法 而不是onload 原因未知）。

        window.οnlοad=function(){
		console.log('onload');
	}
	$(window).load(function()
	{
		 console.log('load');
	 });
	$(document).ready(function(){
		console.log('ready');
	});

在这种情况下，控制台先打印出来“ready”，等图片完全加载出来时之后，再加载出来“load”“onload”。

选择器：

css选择元素的方法：

            元素选择器

            后代选择器

            ID选择器

            类选择器

            属性选择器

js选择元素方法：

		document.getElementById();      	//根据id选择元素
		document.getElementsByName();		//根据name选择
		document.getElementsByTagName();	//根据标签名
		document.getElementsByClassName();      //根据className

		document.querySelector('#divFirst');	        //括号内填写css选择规则
		document.quertSelectotAll('div');  		//返回数组

后面两种方法更加灵活,可以直接使用css选择器

jQuery选择器：

  特点：兼容css选择器语法及扩展，返回0个、1个或多个jQuery元素集合，集合内元素顺序和在页面上顺序一致。

		var elements1 = $('#box1');		//根据id
		var elements2 = $('#box1,#box2'); //通过逗号分隔选择多个元素
		var elements3 = $('.box1');		//根据class
		var elements4 = $('[name="username"]');  //根据name值
		var elements5 = $(document.getElementsById('box1'));	//将DOM元素包装成JQuery对象

该方法返回的都是类似数组的jQuery对象（不管查询了几个元素），该对象不是数组，不存在数组的方法，但是具有长度属性，且长度属性不会自动变化，需要手动操作。

在$(elem)中，elem最好使用单引号将内容包裹起来，因为如果使用双引号包裹，且elem中包含双引号，就会报错。需要转义字符才能运行。

var elements4 = $("[name=/"username/"]");       //使用转义字符

jQuery基本选择器：

		$('#P1').addClass('highLight');                         //ID选择器·
		$('.list').addClass('highLight');                       //类名选择器
		$('.list > li').addClass('highLight');                  //后代选择器
		$('li').addClass('highLight');//元素选择器
		$('a[href="www.baidu.com"]').addClass('highLight');     //属性选择器
		$('a[href*="www"]').addClass('highLight');              //选择a标签的href的属性包含“www”的
		$('a[href^="http"]').addClass('highLight');             //选择a标签的href的属性以http开头的
		$('a[href$="http"]').addClass('highLight');             //选择a标签的href的属性以http结尾的
		$('a[href][target]').addClass('highLight');             //选择同时包含a标签的href的属性以target属性的
		$('a[href][target]').addClass('highLight');             //选择同时包含a标签的href的属性以target属性的
		$('a[href!="www.baidu.com"]').addClass('highLight');    //选择a标签的href的属性不等于“www”的（css中没有的选择方法）
		$('p[data-id]="1"').addClass('highLight');              //选中自定义的属性