Question

<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Demo</title>
</head>
<body>
<ul>
<li>item 1</li>
<li class="specia">item 2</li>
<li>item 3</li>
</ul>
</body>
</html>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$( 'li' ).html(function( index, oldHtml ) {
  return oldHtml + '!!!'
});
</script>

问题：

对于这一行：function( index, oldHtml ),我知道oldHtml表示li的html值，但index的含义是什么？在我们没有使用index的函数内部，我在这里检查了文档：http://api.jquery.com/html/#html-functionindex--oldhtml，但仍然没有得到它。

Answer 1

在这种情况下，index表示li - 元素的位置。猜猜你有一个ul包含五个li元素，因此$('li')...将匹配所有五个元素。 index告诉您选择了哪个元素。例如：假设您将使用另一种颜色的第二个li元素，因此您可以这样做：

$('li').html(function(index, oldHtml) {
    if (index == 2) {
        jQuery(this).css('color', 'red');
    }
});

希望这有帮助。

Answer 2

似乎只是一个简单的例子表明你希望它正在做：

http://jsfiddle.net/dqjg3/生成：

#0 item 1!!!
#1 item 2!!!
#2 item 3!!!

您所指的重载是隐式循环选定的元素，但为了公平起见，API似乎并非如此解释。

Answer 3

索引主要用于获取兄弟数字。假设有4个

标签。

<ul>
<li>First</li>
<li>Second</li>
<li>Third</li>
<li>Fourth</li>
</ul>

现在你想要在没有遍历的情况下更改第3个节点。在那种情况下，你将使用索引。

$('li').html(function(index, oldHtml) {
    if (index == 3) {
        $(this).text("modified third");
    }
});

试图理解jquery中的.html（function（index，oldhtml））

3 个答案: