快捷導(dǎo)航

jQuery查找節(jié)點(diǎn)方法完整實(shí)例

更新時(shí)間：2016年09月13日 09:54:11 作者：onestopweb

這篇文章主要介紹了jQuery查找節(jié)點(diǎn)方法,結(jié)合完整實(shí)例形式分析了jQuery針對(duì)DOM節(jié)點(diǎn)屬性的相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了jQuery查找節(jié)點(diǎn)方法。分享給大家供大家參考，具體如下：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="js/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
//<![CDATA[
$(function(){
  var $para = $("p"); // 獲取<p>節(jié)點(diǎn)
  var $li = $("ul li:eq(1)"); // 獲取第二個(gè)<li>元素節(jié)點(diǎn)
  var p_txt = $para.attr("title"); // 輸出<p>元素節(jié)點(diǎn)屬性title
  var ul_txt = $li.attr("title"); // 獲取<ul>里的第二個(gè)<li>元素節(jié)點(diǎn)的屬性title
  var li_txt = $li.text(); // 輸出第二個(gè)<li>元素節(jié)點(diǎn)的text
  alert(ul_txt);
  alert(li_txt);
  alert(p_txt);
});
//]]>
</script>
</head>
<body>
<p title="T選擇你最喜歡的水果." >你最喜歡的水果是?</p>
<ul>
  <li title='T蘋(píng)果'>蘋(píng)果</li>
  <li title='T橘子'>橘子</li>
  <li title='T菠蘿'>菠蘿</li>
</ul>
</body>
</html>

效果圖如下：

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專(zhuān)題：《jQuery操作DOM節(jié)點(diǎn)方法總結(jié)》、《jQuery頁(yè)面元素操作技巧匯總》、《jQuery常見(jiàn)事件用法與技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery擴(kuò)展技巧總結(jié)》、《jQuery表格(table)操作技巧匯總》、《jQuery常見(jiàn)經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》

希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

基于Jquery的實(shí)現(xiàn)回車(chē)鍵Enter切換焦點(diǎn)
系統(tǒng)默認(rèn)情況下，使用Tab按鍵切換頁(yè)面元素的焦點(diǎn)，有沒(méi)有想過(guò)回車(chē)鍵Enter也可以實(shí)現(xiàn)這種功能，并且具有良好的用戶體驗(yàn)。
2010-09-09
詳解jquery事件delegate(）的使用方法
這篇文章主要詳解了jquery事件delegate(）的使用方法，delegate() 方法為指定的元素（屬于被選元素的子元素）添加一個(gè)或多個(gè)事件處理程序，并規(guī)定當(dāng)這些事件發(fā)生時(shí)運(yùn)行的函數(shù)，感興趣的小伙伴們可以參考一下
2016-01-01
JQuery控制div外點(diǎn)擊隱藏而div內(nèi)點(diǎn)擊不會(huì)隱藏的方法
這篇文章主要介紹了JQuery控制div外點(diǎn)擊隱藏而div內(nèi)點(diǎn)擊不會(huì)隱藏的方法,涉及show、hide及stopPropagation等方法的使用技巧,需要的朋友可以參考下
2015-01-01
Bootstrop實(shí)現(xiàn)多級(jí)下拉菜單功能
Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它簡(jiǎn)潔靈活，使得 Web 開(kāi)發(fā)更加快捷。本文重點(diǎn)給大家介紹bootstrap實(shí)現(xiàn)多級(jí)下拉菜單功能的實(shí)例代碼，感興趣的朋友一起學(xué)習(xí)吧
2016-11-11
鼠標(biāo)經(jīng)過(guò)出現(xiàn)氣泡框的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇鼠標(biāo)經(jīng)過(guò)出現(xiàn)氣泡框的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-03-03
基于jQuery的ajax功能實(shí)現(xiàn)web service的json轉(zhuǎn)化
前面文章說(shuō)過(guò)下次會(huì)給大家介紹詳細(xì)的基于web Services的JqueryAjax調(diào)用如何把一個(gè)datatable得數(shù)據(jù)轉(zhuǎn)化成JSON數(shù)據(jù),然后在客戶端再通過(guò)json2.js轉(zhuǎn)化成javascript對(duì)象。
2009-08-08
jQuery中click事件的定義和用法
這篇文章主要介紹了jQuery中click事件的定義和用法,以實(shí)例形式詳細(xì)分析了jQuery中的click事件具體定義方法、參數(shù)及用法實(shí)例,具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2014-12-12
jQuery實(shí)現(xiàn)彈幕效果
本文主要分享了jQuery實(shí)現(xiàn)彈幕效果的示例代碼。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧
2017-02-02
基于jquery實(shí)現(xiàn)五子棋游戲
這篇文章主要為大家詳細(xì)介紹了基于jquery實(shí)現(xiàn)五子棋游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-05-05
JQuery Dialog(JS 模態(tài)窗口,可拖拽的DIV)
JQuery Dialog(JS模態(tài)窗口,可拖拽的DIV) 效果實(shí)現(xiàn)代碼
2010-02-02