jQuery中的DOM操作

1，实例代码： 
	<body>
		<p title="选择你最喜欢的水果">
			你最喜欢的水果是？
		</p>
		<ul>
			<li title="苹果">
				苹果
			</li>
			<li title="橘子">
				橘子
			</li>
			<li title="">
				菠萝
			</li>
		</ul>
	</body>
2，查找节点
-1，查找元素节点
$(function() {
 
	var $li = $("ul li:eq(1)");//ul下的第二个li
	console.log($li);
	console.log($li.text());
});
-2，查找属性节点
$(function() {
 
	var $para = $("p");//get p element
	var pText = $para.attr("title");
	console.log(pText);
});
3，创建节点
-1，创建元素节点
$(function() {
 
	var $li1 = $("<li>测试插入1</li>");//创建元素
	var $li2 = $("<li>测试插入2</li>");
	
	$("ul").append($li1);//添加元素
	$("ul").append($li2);
});
4，删除节点
$(function() {
 
	$("ul li:eq(1)").remove();
});
$(function() {
 
	var $li = $("ul li:eq(1)").remove();//删除节点，返回被删除的节点元素
	console.log($li);
	$li.appendTo("ul");//删除的节点添加至元素中	
 
});

posted @ 2015-03-25 10:49  梅尔加德斯  阅读(200)  评论(0)  编辑  收藏  举报