在对象中的单个元素上使用jQuery .append

在这里尝试一些新东西，我在理解为什么这不按照我的意图工作时遇到了一些麻烦。在对象中的单个元素上使用jQuery .append

所以，我给自己定了一个简单的for循环的几个元素简单起见：

for(var i=0; i<5; i++){ 
    $('body').append('<div class="green">Here I am</div>'); 
}

我都选择为对象的项目（我将需要改变每个个别项目）本身：

console.log($greenDivs[3]);

：

$greenDivs = $('div.green');

现在，当我想访问它，我可以通过它的索引这样做只是在控制台罚款

它返回一个漂亮整洁的控制台：<div class="green">，我也可以在页面上看到它。

然而，当我试图改变它在与一些jQuery函数什么办法，我只收到为$greenDivs[3].append is not a function

为什么不中功能的这样的错误？是否因为.green元素被分类为一个对象？我可以使用所有的基本JS性能，如：

$greenDivs[3].innerHTML = "Whatever"

任何帮助表示赞赏理解为什么我必须使用基本的JavaScript对象属性修改单个元素。这里

播放，如果你想要一个例子： https://jsfiddle.net/eacdtzjw/2/

来源

2016-01-20 Nicholas Hazel

$（$ greenDivs [3]）附加（ '你好'）;作品 – Ianis

$greenDivs[3]给你一个DOM节点。那些没有任何jQuery特定的方法。

要保留它作为jQuery对象，请使用$greenDivs.eq(3)（请参阅https://api.jquery.com/eq/）。

你当然可以重新包装它作为一个jQuery对象，如$($greenDivs[3])，但在这种情况下这是一个不必要的步骤。

来源

2016-01-20 12:19:51 Tomalak

您需要获得元素$greenDivs[3]：

$(function(){ 
 
\t for(var i=0; i<5; i++){ 
 
    \t $('body').append('<div class="green">Here I am</div>'); 
 
    } 
 
    $greenDivs = $('div.green'); 
 
    console.log($greenDivs[3]); 
 

 
    $($greenDivs[3]).append('Hello'); 
 

 
});

.green { 
 
    background: #00FF00; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

来源

2016-01-20 12:21:08

$ greenDivs [3]实际上是一个对象不是一个jQuery对象。如果你想使用jQuery的附加功能，你应该

$($greeenDivs[3]).append('...');

或

$greenDivs.eq(3).append('....')

来源

2016-01-20 12:21:19 jilykate

在对象中的单个元素上使用jQuery .append

回答

相关问题