jquery 學習(四) 獲取標籤中的值||text()與html的區別,以及jquery對象與dom對象的轉換

代碼如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>1-4</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- 引入 jQuery -->
<script src="../scripts/jquery-1.3.1.js" type="text/javascript"></script>
<script type="text/javascript">
//等待dom元素加載完畢.
$(document).ready(function(){
	var domObj = document.getElementsByTagName("h3")[0]; // Dom對象
	var $jQueryObj = $(domObj);  //jQuery對象
	alert("DOM對象:"+domObj.innerHTML);
	alert("jQuery對象:"+$jQueryObj.html());
	alert($jQueryObj.text());

	var $jObject = $("#h2");//jQuery對象
	var domO = $jObject[0];//dom對象
	alert(domO.innerHTML);
});
</script>
</head>
<body>
<h3><a>例</a>子</h3>
<h2 id="h2">hehe</h2>
</body>
</html>


打印結果,彈出對話依次顯示爲:<a>例</a>子、<a>例</a>子、例子、hehe

分析:先通過標籤h3獲取所有h3標籤的dom對象數組取第一個,通過$()將dom對象轉換成了jquery對象。從打印的結果可以看出dom的innerHTML屬性與jquery的html()函數獲取的結果相同,而text()函數則只獲取h3標籤中的文本,h3標籤中包含的其他標籤則過濾。

     然後通過id爲h2獲取jquery對象,通過[0]或get(index)方式將jquery對象轉成了dom對象。

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章