jQuery-html

1.捕获元素

		<p id="text">你好啊<a>bfdvfdvfdvfv</a></p>
		<button id="btn1">点击</button>
		<p><input type="text1" id="it" value="世界很大" /></p>
		
		<p><a href="http://www.baidu.com" id="aid"></a></p>
		<button id="btn2">点击</button>

$(document).ready(function(){
	
	$("#btn1").click(function(){
		alert("text"+$("#text").text())
		
	})	
});

$(document).ready(function(){
	//可以获取到标签
	$("#btn1").click(function(){
		alert("text"+$("#text").html())
		
	})	
})

$(document).ready(function(){
	//可以获取到标签
	$("#btn1").click(function(){
		alert("text:"+$("#it").val())
		
	})
		
})

$(document).ready(function(){
	
	$("#btn2").click(function(){
		alert("text:"+$("#aid").attr("href"))
		
	})		
})

2.设置元素

     <p id="p1"> hello world</p>
		<button id="btn1">按钮</button>
		<p id="p2">你好世界</p>
		<button id="btn2">按钮</button>		
		<a id="aid" href="http://www.baidu.com">最初是百度，接下来是再见</a>
		
		<button id="btn3">跳转</button>
		
		<p id="p5"> 好的发过火</p>
		
		<button id="btn5">按钮</button>

$(document).ready(function(){
	$("#btn1").click(function(){
		$("#p1").text("dfkkdfj")
		
	})

	$("#btn2").click(function(){
		
		$("#p2").html("<a href='http://www.baidu.com'>再见</a>")
		
	})

	$("#btn3").click(function(){
		$("#aid").attr("href","http://www.w3school.com.cn/index.html")
		
	})
	
	$("#btn5").click(function(){
		$("#p5").text(function(i,ot){
			return "old"+ot+"new:新的内容"+(i);
			
		})
		
	})
	
})

3.添加元素

	<p id="p1">你好：</p>
		<br/>
		<button id="btn1">按钮</button>

		<button "appengIndex()">按钮</button>

$(document).ready(function(){
	$("#btn1").click(function(){
		//$("#p1").append("一花一世界，一叶一追寻");
		//$("#p1").prepend("一花一世界，一叶一追寻");
		//$("#p1").after("一花一世界，一叶一追寻");
		$("#p1").before("一花一世界，一叶一追寻");
		
		
	})

})

function appengIndex(){
	
	var text1="<p>bisde</p>"
	var text2=$("<p></p>").text("ime");
	var text3=document.createElement("p");
	text3.innerHTML="aaaaa";
			
			$("body").append(text1,text2,text3);
}

4.删除元素

<p> 你好世界</p>
		<button id="bnt1">删除</button>

$(document).ready(function(){
	$("#bnt1").click(function(){
		//$("p").remove();
			$("p").empty();
		
		
	});
	
});