我有 8 个 dataString 对象。 “dataString”是我从 attachment1 调用的对象,它是我从 Controller 转发的列表。
这是我的 HTML 代码:
<% int nilai = 0; %>
<c:forEach items="${attachment1}" var="a">
<div class="w3-image w3-padding">
<div id="ini">${a.dataString}</div>
<%=nilai = nilai + 1%>
</c:forEach>
这是我在 javascript 中的代码:
var blob = [];
blob.push(document.getElementById('ini').innerHTML);
var blobLength = blob.length;
console.log(blob);
console.log(blobLength);
但是,当我运行并在网页上显示时,我在检查元素中看到了这个结果:
result on the webpage 正如你在图片上看到的,java的结果可以完美地显示在网页上。
result when inspecting element in console 但是在控制台中,你可以看到,从 8 个字符串中,在 javascript 列表中输入的字符串只有 1 个。
如何修复?以便我可以将所有 dataString 放入 javascript 的列表中?
最佳答案
您必须更改重复项 id
的按普通类(在我的示例中为 ini
),因为标识符在同一文档中应该是唯一的:
<% int nilai = 0; %>
<c:forEach items="${attachment1}" var="a">
<div class="w3-image w3-padding">
<div class="ini">${a.dataString}</div>
<%=nilai = nilai + 1%>
</c:forEach>
然后在你的 JS 中获取类为 ini
的所有元素并使用 foreach
遍历它们使用 .textContent
获取内容属性并将其推送到 blob
数组:
var blob = [];
document.getElementsByClassName('ini').forEach( function(item) { ;
blob.push(item.textContent);
}
var blobLength = blob.length;
console.log(blob);
console.log(blobLength);
注意:您应该关闭 w3-image
div 使用 </div>
在你的c:forEach
循环
关于javascript - 如何在javascript中从列表中的HTML保存多个文本对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51562662/