在for循环中创建div的id时如何获取div值答案

【问题标题】：How to get div value when id of div is created in for loop在for循环中创建div的id时如何获取div值
【发布时间】：2015-07-01 05:21:59
【问题描述】：

请告诉我这个问题的解决方案。我正在使用 for 循环创建 5 个动态 divs 和它们的 ids。我想获取循环计数器值和每个创建的div 的html，格式为“counter: html”，如1:123。现在我只得到循环计数器值。

<html>
<div id="feed"></div>

</html>
<script>
  for (var i = 1; i <= 5; i++) {
    $('#feed').append('<div id="news' + i + '" value='
      123 '/>');



    var abc = $("#news" + i).attr("value");
    console.log(abc);
  }
</script>

提前致谢。

【问题讨论】：

分享完整代码。目前尚不清楚您要达到的目标。
我只想获取 div 的值，即 123。但它不是静态值。该值来自 json api，我将该值附加到 div 的 value 属性中。所以我必须显示 div 的值。
创建 div 的行的语法错误，因此根本不会运行。
将行改为$('#feed').append('<div id="news' + i + '" value=' + 123 + '/>');（注意添加的+'es）
<div> 没有value，使用data- 属性

标签： javascript jquery html css angularjs

【解决方案1】：

根据更新后的问题更新答案。此代码将为您工作。试试看吧。

for (var i = 1; i <= 5; i++) {
    $('#feed').append('<div id="news' + i + '">'+ i +': Test</div>');
}

但我再次告诉你不要使用值标签，你已经在 id 中有你的计数器，所以如果你愿意，可以把它分开。

干杯！！

【讨论】：

其实值属性包含动态值。即每个 div 包含不同的值。
@MohammadIqbal 不，每个 div 包含不同的 html，这是一个重要的区别
所以当我必须显示来自 json api 的 200 个数据时我必须做什么
@MohammadIqbal 如果你想显示它，使用 html 标签，否则解释你想对数据做什么。

【解决方案2】：

不要使用ids 使用class
'<div id="news' + i + '" value='123'/>' 应该是'<div class="news">123</div>'
使用.html() 而不是.attr("value")

for (var i = 0; i <= 4; i++) {
  $('#feed').append('<div class="news">123</div>');

  var abc = $('.news').eq(i).html(); // gets the html of the div with the class "news" at the index supplied by `i`, keep in mind that arrays are 0 based so 0 is the first, 1 is the second....
  console.log((i+1)+':'+abc);
}

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

【讨论】：

感谢您的快速回复，但是当我使用您的代码时，它会像这样在控制台中显示。 5 未定义。表示for循环的计数器
@MohammadIqbal 它在我这边工作，如截图所示，你能告诉我你是如何使用它的吗？
但是@DelightedD0D 我还必须增加 div id
是的，但是说增加 div id 是一种不好的方法。可以的，当然可以。但更好的方法是使用一个类。这正是类的用途。
给他们一个类而不是像这里显示的 id。 $('.news') 将创建一个包含 news 类的所有元素的数组，您可以通过调用 $('.news').eq(i) 访问您想要的任何元素，其中 i 是您想要从该数组中获取的元素的索引

【解决方案3】：

试试这个。

$(document).ready(function() {
  for (var i = 1; i <= 5; i++) {
    $('#feed').append('<div id="news' + i + '" value="123"></div>');

    //and I want to get the value of dynamic created div using this code but I am getting only the loop counter value. Please help me to get this answer.

    var abc = $("#news" + i).attr('value');
    console.log(abc + " : " + i);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<html>
<div id="feed"></div>

</html>

【讨论】：

这段代码 sn-p 将产生以下输出： undefined : 1 undefined : 2 undefined : 3 undefined : 4 undefined : 5
我可以在 Google Chrome 控制台中看到 123 : 1 123 : 2 123 : 3 123 : 4 123 : 5。

【解决方案4】：

您正在使用id。你不能在多个divs上使用id，所以你需要使用class。

【讨论】：

这应该是一个评论，或者应该被详细说明以被视为一个答案
For 循环变量 i 被附加到 id.. 所以 id 将是唯一的。

【解决方案5】：

不太确定你想要什么，div 标签不应该有值属性，如果你想添加你定义的属性，请改用data-my_attribute。在您的代码中，除此代码外一切正常：

改变这个：

$('#feed').append('<div id="news' + i + '" value='123'></div>');

进入这个：

$('#feed').append('<div id="news' + i + '" value="123"></div>');

【讨论】：

'<div id="news' + i + '" value="123"/>' 无效，这不能解决 OP 代码的其他问题
你的意思是无效，我知道value 属性声明无效，但该代码的唯一错误是这部分。他制作的console.log(abc)会输出value的属性值。
我的意思是这不是有效的html，请看prntscr.com/6x591n 它应该是'<div id="news' + i + '">123</div>' 虽然有些浏览器可能会补偿这样的“html汤”，它不能跨平台可靠地工作并且会中断很多情况下的页面布局
是的，我知道。而且我知道它无效，并且已经在我的帖子中提到过，但这取决于@Mohammad Iqbal 他想要什么以及为什么。也许他这样做是有原因的，否则他不知道如何编码。如果是这样，那么我的错误。干杯。
看看我想说什么@Norlihazmey Ghazali：我有一个 json api，其中包含多个数据列表，例如 data[id:1234 name:xyz]，这是 200 多个数组数据。现在我必须在页面中显示该数据。为此，我正在使用 for 循环创建 div 并分配 div id

【解决方案6】：

这个 sn-p 甚至不适合我，但是，它可以：

for (var i = 1; i <= 5; i++) {
$('#feed').append('<div id="news' + i + '" value="123"/>');
var abc = $("#news" + i).attr("value");
console.log(abc);}

我只是简单地将 value='123' 的单引号改为双引号：value="123"。

【讨论】：