使用jQuery遍历某几个class的元素并修改text内容，有简便方法吗？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了使用jQuery遍历某几个class的元素并修改text内容，有简便方法吗？相关的知识，希望对你有一定的参考价值。
参考技术A $(".xinghao").each(function ()alert($(this).text());
); 参考技术B $("div.xinghao").each(function()
switch($(this).text())
case "1" :
$(this).text("型号一");
break;
case "2" :
$(this).text("型号二");
break;
case "3" :
$(this).text("型号三");
break;
); 参考技术C .each()是jquery遍历函数 参考技术D <!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>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
</head>
<body>
<div class="xinghao">1</div>
<div class="xinghao">2</div>
<div class="xinghao">3</div>
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
var num = $('.xinghao');
for(i=0;i<num.length;i++)
num.eq(i).text('型号'+ (i+1))
</script>
</body>
</html>
<!-- 补充说明：请修改Jquery库路径后运行代码-->本回答被提问者采纳
如何使用 jQuery 遍历 div 的子元素？
【中文标题】如何使用 jQuery 遍历 div 的子元素？【英文标题】：How do I iterate through children elements of a div using jQuery? 【发布时间】：2011-03-02 18:00:02 【问题描述】：我有一个 div，其中有几个输入元素...我想遍历每个元素。想法？
【问题讨论】：
【参考方案1】：使用children() 和each()，您可以选择将选择器传递给children
$('#mydiv').children('input').each(function ()
alert(this.value); // "this" is the current element in the loop
);
您也可以只使用直接子选择器：
$('#mydiv > input').each(function () /* ... */ );
【讨论】：
然后在闭包中使用 $(this) 来访问循环中的“当前”项。 @amarsuperstar: 正在添加该信息:-) 有没有办法知道“n”的值，假设 $(this) 是父母的第“n”个孩子？ @SouvikGhosh：索引作为第一个参数传递给each() 的回调函数。检查文档，链接在上面的答案中。【参考方案2】：
也可以遍历特定上下文中的所有元素，无论它们嵌套多深：
$('input', $('#mydiv')).each(function ()
console.log($(this)); //log every element found to console output
);
传递给 jQuery 'input' 选择器的第二个参数 $('#mydiv') 是上下文。在这种情况下，each() 子句将遍历 #mydiv 容器中的所有输入元素，即使它们不是 #mydiv 的直接子元素。
【讨论】：
可能是因为嵌套这个解决方案对我有用，而另一个没有。出于这个原因，我认为这通常是更好的解决方案。 这就是我要找的。有什么方法可以根据它们的值制作 json 吗？我需要将所有主题发布为 json。 效果很好！如果我需要所有输入并选择项目怎么办？ 您可以通过逗号分隔列表选择多个元素：$('input,select', $('#mydiv'))【参考方案3】：
如果需要循环遍历子元素递归：
function recursiveEach($element)
$element.children().each(function ()
var $currentElement = $(this);
// Show element
console.info($currentElement);
// Show events handlers of current element
console.info($currentElement.data('events'));
// Loop her children
recursiveEach($currentElement);
);
// Parent div
recursiveEach($("#div"));
注意： 在此示例中，我展示了使用对象注册的事件处理程序。
【讨论】：
【参考方案4】：$('#myDiv').children().each( (index, element) =>
console.log(index); // children's index
console.log(element); // children's element
);
这会遍历所有子元素，并且可以分别使用 element 和 index 分别访问它们具有索引值的元素。
【讨论】：
【参考方案5】：也可以这样做：
$('input', '#div').each(function ()
console.log($(this)); //log every element found to console output
);
【讨论】：
【参考方案6】：我认为你不需要使用each()，你可以使用标准for循环
var children = $element.children().not(".pb-sortable-placeholder");
for (var i = 0; i < children.length; i++)
var currentChild = children.eq(i);
// whatever logic you want
var oldPosition = currentChild.data("position");
这样你就可以让break和continue等标准for循环功能默认工作
另外，debugging will be easier
【讨论】：
我的经验是$.each() 总是比 for 循环慢，这是唯一使用它的答案。这里的关键是使用.eq() 来访问children 数组中的实际元素，而不是使用括号（[]）表示法。【参考方案7】：
children() 本身就是一个循环。
$('.element').children().animate(
'opacity':'0'
);
【讨论】：
【参考方案8】：它与 .attr('value') 一起工作，用于元素属性
$("#element div").each(function()
$(this).attr('value')
);
【讨论】：
以上是关于使用jQuery遍历某几个class的元素并修改text内容，有简便方法吗？的主要内容，如果未能解决你的问题，请参考以下文章