jQuery 基础 操作 jQuery 对象

操作 jQuery 对象

- 检查数量

- 父子邻居关系

- 过滤元素的集合

- 遍历

用 jQuery 创建 html 元素

dom 对象（元素）与 jQuery 对象：前者是浏览器的网页页面中渲染出来的元素，而后者是对一组 dom 元素的包装。

检查 DOM 对象：if(obj.nodeType)

检查 jQuery 对象： if(obj.jquery)

转换：

          var jqueryObj = $(domObj);

          var domObj = jqueryObj.get([index]);

	<script type="text/javascript">
		var domObj = document.getElementById('div');
		var jqueryObj = $('div');

		console.log(domObj);
		console.log(jqueryObj);

		console.log(domObj.nodeType);
		console.log(jqueryObj.jquery);
		console.log(domObj.jquery);
		console.log(jqueryObj.nodeType);
	</script>

创建元素

- 使用：$('<div>Hello</div>'); 创建一个元素

- 使用：jQuery 对象的 appendTo 方法，可以把该元素放到网页上。

-  属性设置： 

	<script type="text/javascript">
		$(function(){
			var link1 = $('<a>',{
				text: 'thisisalink',
				href: '#',
				target: '_blank',
				title: 'goto somewhere'
			});
			link1.appendTo('body');

			var link2 = $('<a>link2</a>').attr({
				text: 'thisisalink',
				href: '#',
				target: '_blank',
				title: 'goto somewhere'
			});
			link2.appendTo('body');

			var div = $('<div>Hello</div>');
			div.appendTo('body')
			console.log($('div'))
		})
		
	</script>

 

检查和获取元素

- 检查元素数量 $('xxx').length

- 提取元素：（1）[index] 返回DOM元素  （2）get([index]) 返回DOM元素或集合元素  （3）eq(index) 返回jQuery对象 (4) first()

 last()  返回jQuery对象  (5) toArray() 把 jQuery 对象直接转换为 DOM 元素的数组

	<script type="text/javascript">
		var lis = $('li');
		lis2 = lis.eq(1);

		console.log(lis2);
		console.log(lis.toArray());

	</script>