以对象的数组，并在选择

  • Z时代
  • 2024-01-10
  • 分类：问答

我用走对象的数组这是在我的JavaScript文件，使对象在阵列中为选择列表上我的网站上挣扎的形式将其放置在IFRAME html和iframe。我制作了一个iframe ID，但我不确定该从哪里去，并在网页上显示某些内容。以对象的数组，并在选择

HTML代码

<!DOCTYPE html> 
<html> 
<head> 
<title>Assessed Assignment A8</title> 
<link rel="stylesheet" type="text/css" href="style.css"> 
<script src="fruits.js"></script> 
</head> 
<body> 
<iframe id="Containers"></iframe> 
</body> 
    </html>

Javascript代码

items = [{"title":"Apple"},{"title":"Orange"},{"title":"Pear"},{"title":"Banana"}];

基本上，我想使它看起来像这样：https://gyazo.com/9877c7ae75c3d0f2425c31642e48cc01

干杯

回答：

你可以这样做： 我写了一些注释来说明我的意思：

<!DOCTYPE html> 
<html> 
<head> 
<title>Assessed Assignment A8</title> 
<link rel="stylesheet" type="text/css" href="style.css"> 
<script src="fruits.js"></script> 
</head> 
<body> 
<ul id="containers"></ul> 
</body> 
</html>

在你fruits.js：

document.addEventListener('DOMContentLoaded', function() { // wait for content to load in order to be sure you can select your dom nodes 
    var items = [{"title":"Apple"},{"title":"Orange"},{"title":"Pear"},{"title":"Banana"}]; 
    var myListElement = document.getElementById('containers'); // select your DOM - list element 
    for (prop of items) { // traverse your object items 
     myListElement.innerHTML += '<li>'+prop.title+'</li>'; // add listitems containing the values from the item object 
    } 
});

以上是 以对象的数组，并在选择 的全部内容， 来源链接： utcz.com/qa/257889.html

回到顶部