1

抱歉,我是 jQuery 的初学者和 stackoverflow 的新手,我很难区分这些 DOM 元素。我想更改<p>元素中的innerHTML,但发生了一些奇怪的事情..

例如

html代码:

<div id='main-content'> 
    <p id='p0'>0</p>
    <p>0</p>
</div>

js代码:

var p=$('#main-content').children('p');

$('#p0').html('100');
p[1].html('100');

我想改变第一个和第二个的innerHTML

元素从 0 到 100,但是第二种方法 p[1].html('100') 不起作用……控制台说 TypeError: p[1].html is not a function。请帮助我,Firebug 告诉我 $('#p0') 是 [object object] 而 p[1] 是 [object HTMLParagraphElement],你能向我解释一下不同之处吗,非常感谢你 TAT

4

3 回答 3

4

那是因为p[1],就像 一样p.get(1),返回 DOM 元素。

使用eq1在 set中的index 处获取 jQuery 对象:

p.eq(1).html('100');
于 2013-10-05T17:07:18.063 回答
0
//For First Paragraph with id 'p0';
$('#main-content').find("#p0").html("100");

//For second Paragraph;
$($('#main-content p')[1]).html("100");
于 2013-10-05T17:11:17.730 回答
0

jQuery 还支持nth-child选择器。所以你也有这个选择。小提琴

$("#main-content p:nth-child(2)").text("100");

就像 dystroy 所说,访问 jQuery 数组将返回 DOM 元素。您可以使用 eq 之类的帮助程序,或者通过再次包装 DOM 元素来简单地创建另一个 jQuery 对象。因此,例如要修复您的原始代码,只需执行以下操作:

var p=$('#main-content').children('p');
$(p[1]).html('100');

编辑:我重读了这个问题,看来您想更新两个段落元素的内容。在这种情况下,它变得更加简单:

$("#main-content p").text("100");

jQuery 将作用于所有选定的对象。请阅读 jQuery 如何使用css 选择器

于 2013-10-05T17:30:02.837 回答