`

jquery深度选择器,还是遍历li里面的值

    博客分类:
  • js
 
阅读更多

不多说,直接上代码

<div class="body pB5 redB border_01"> 
		<ul id="ul_cartList" class="cartlistul">
			<li> 
				<span class="pro_name"> 10086.我爱你 </span> 
				<span class="pro_delete"><a href="javascript:deleteCartAjax('10086.我爱你')">删除</a></span>
			</li> 
			<li> 
				<span class="pro_name"> 你发了.广东 </span> 
				<span class="pro_delete"><a href="javascript:deleteCartAjax('你发了.广东')">删除</a></span>
			</li>
			<li> 
				<span class="pro_name"> 你发了.集团</span> 
				<span class="pro_delete"><a href="javascript:deleteCartAjax('你发了.广东')">删除</a></span>
			</li>
		</ul> 
		
	</div> <button onclick="clickButton();">click</button> 

 我想拿到li里面class为pro_name的每个span里面的值,

function clickButton(){
			//var liList = document.getElementById("ul_cartList").getElementsByTagName("li"); 
			var liLength = $("#ul_cartList li").length;
			//alert(liLength);
			for(var i = 0; i < liLength; i++){ 
				var spanElement = $("#ul_cartList li span.pro_name")[i];
				alert(spanElement.innerHTML);
				//alert(spanElement);
				//alert($("#ul_cartList li span.pro_name")[i].innerHTML);
			} 
		} 

 

 

分享到:
评论

相关推荐

    jQuery 遍历css选择器

    **一、jQuery选择器概述** jQuery支持多种CSS选择器,包括基本选择器(如`#id`、`.class`、`tag`)、关系选择器(如`&gt;`、`+`、`~`)、属性选择器(如`[attr]`、`[attr=value]`、`[attr^=value]`等)以及伪类选择器...

    jquery基本选择器

    **jQuery基本选择器** jQuery库是JavaScript中最广泛使用的库之一,它简化了DOM操作、事件处理和动画制作。其中,选择器是jQuery的核心功能之一,它使得能够高效地选取页面中的HTML元素。以下是对jQuery基本选择器...

    jquery 动态选择器

    本文将深入探讨“jQuery动态选择器”这一主题,结合标签中的“源码”和“工具”概念,我们将会看到jQuery如何通过其丰富的选择器功能来高效地选取和操作网页元素。 动态选择器是jQuery的核心特性之一,它允许开发者...

    jquery遍历节点树

    4. **$(selector).find(selector)**: 这是jQuery中最强大的遍历方法之一,它可以查找匹配子选择器的所有后代节点,无论它们是直接子节点还是更深层的子节点。例如,如果要找到所有`&lt;div&gt;`下的所有`&lt;span&gt;`元素,可以...

    jquery 元素选择器使用方法技巧

    ### jQuery元素选择器使用方法技巧 #### 一、引言 在前端开发中,jQuery 是一个非常流行的 JavaScript 库,它极大地简化了 HTML 文档遍历、事件处理、动画等操作,并提供了强大的 DOM 操作能力。jQuery 的核心功能...

    jQuery循环遍历子节点并获取值的方法

    // 使用jQuery选择器选取所有的直接子节点 var arrUl = jQuery(".left_tree_ad_btn_container &gt; ul"); // 使用.each()方法遍历选取的元素 jQuery.each(arrUl, function(index, element) { // 使用.find()选取当前...

    CSS选择器和jQuery选择器

    ### CSS选择器与jQuery选择器详解 #### 一、引言 在现代Web开发中,选择器扮演着至关重要的角色。无论是对HTML元素应用样式还是对其进行动态操作,选择器都是必不可少的工具。本文将深入探讨两种常用的选择器——...

    jQuery如何取网页中li的值.zip

    1. **选择器**:jQuery的选择器是其强大之处。你可以使用CSS选择器来选取特定的`&lt;li&gt;`元素。例如,如果你想要选取所有`&lt;ul&gt;`下的`&lt;li&gt;`,可以使用`$('ul li')`。如果`&lt;li&gt;`有特定的类名或ID,可以选择`.class`或`#id...

    jquery的选择器的学习教程

    **jQuery选择器是jQuery库中的核心功能之一,它极大地简化了HTML文档对象模型(DOM)的遍历和操作。这个学习教程将引导你深入理解jQuery选择器的强大与灵活性,帮助你在最短时间内提升JavaScript开发效率。** ...

    jQuery树结构菜单选择器代码.zip

    在给定的“jQuery树结构菜单选择器代码.zip”压缩包中,我们关注的是如何利用jQuery来创建一个树形结构的菜单选择器。这种组件在网页设计中广泛用于导航和数据组织,特别是对于具有层级关系的数据展示,如目录结构、...

    jQuery中的基本选择器用法学习教程

    CSS选择器可能在某些浏览器中不兼容,而jQuery选择器提供了更好的跨浏览器兼容性。 - 例如,CSS的子选择器`#box &gt; p`在IE6中可能不工作,但jQuery的`$('#box &gt; p').css('color', 'red')`则能兼容IE6。 5. **jQuery...

    jquery选择器实例和jar包

    本文将深入探讨jQuery选择器的实例和相关知识,帮助你掌握这一强大的工具。** **1. 元素选择器** 元素选择器基于HTML标签名来选取元素,例如`$("p")`会选择所有的段落元素。通过实例,我们可以看到如何获取并改变...

    jQuery树形选择器代码.zip

    《jQuery树形选择器代码详解》 在网页开发中,数据的展示方式多种多样,其中树形结构是一种常见的数据组织形式,尤其适用于层次关系复杂的场景。jQuery作为一个强大的JavaScript库,提供了丰富的选择器来操作DOM...

    jQuery选择器

    **jQuery选择器详解** jQuery库以其简洁易用的API闻名,其中最重要的部分之一就是选择器。选择器在jQuery中扮演着查找HTML元素的关键角色,使得开发者可以轻松地选取DOM中的特定元素进行操作。本文将深入探讨jQuery...

    Jquery选择器说明文档.doc

    本文将详细阐述JQuery中的各种选择器及其使用方法。 1. **基础选择器**: - `#id`:通过元素的ID选择器,如`$("#divId")`选取ID为`divId`的元素。 - `element`:根据元素名称选择,例如`$("a")`选择所有`&lt;a&gt;`元素...

    jQuery选择器大全

    ### jQuery选择器详解 #### 引言 在前端开发领域,jQuery因其强大的功能和简洁的API,成为处理HTML文档、事件、动画以及Ajax交互的首选工具之一。其中,选择器作为jQuery的核心特性,允许开发者以各种灵活的方式...

    使用JQuery选择HTML遍历函数的方法

    了解并熟练运用这些jQuery选择和遍历函数,可以让你在处理HTML结构时更加游刃有余,提高代码的效率和可维护性。在实际项目中,结合其他jQuery方法和插件,可以实现更复杂的功能,增强用户体验。记住,合理使用这些...

    Jquery 选择器

    jQuery 提供了与 CSS 相似的基本选择器,如 ID 选择器(`#id`)、类选择器(`.class`)、元素选择器(`element`)和通配符选择器(`*`)。例如: ```javascript $("#myID"); // 选择 ID 为 "myID" 的元素 $("....

    Jquery选择器

    ### jQuery选择器详解 #### 一、概述 在前端开发领域,jQuery因其简洁高效的特点而备受开发者喜爱。作为一款优秀的JavaScript库,jQuery极大地简化了HTML文档遍历、事件处理、动画以及Ajax交互等方面的操作。其中...

Global site tag (gtag.js) - Google Analytics