개체의 배열을 가져 와서 선택의 형태로 iframe에 배치

-1

나는 자바 스크립트 파일에있는 개체의 배열을 취하고 배열의 개체를 내 웹 사이트의 선택 목록으로 만드는 데 어려움을 겪고 있습니다. html 및 iframe. iframe id를 만들었지 만 거기에서 어디로 가서 웹 페이지에 무언가를 표시해야할지 모르겠습니다.개체의 배열을 가져 와서 선택의 형태로 iframe에 배치

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>

자바 스크립트 코드 나는 기본적으로는 다음과 같이 만들려고

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

: https://gyazo.com/9877c7ae75c3d0f2425c31642e48cc01

건배

출처

2017-12-02 wertyj

왜 당신이 그에 대한 iframe을 필요합니까 내가 무슨 뜻인지 설명하기 위해 몇 가지 의견을 썼다? –

배열을 가져 와서 웹 페이지에 배치하는 것이 가장 좋을지라도 – wertyj

아니요 :-) 그 이상 또는 그 이상의 목록 (ul)을 사용하려면 div를 사용할 수 없습니다. 스크립트 파일의 전체 내용을 게시 할 수 있습니까? 데이터를 삽입하는 데 사용 하시겠습니까? 아니면 추가 스크립트를 사용하고 싶습니까? –

이 작업을 수행 할 수 있습니다 : 당신의 fruits.js에서

<!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>

을 :

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 
    } 
});

출처

2017-12-02 20:01:08

js fiddle에서이 작업을 시도했지만 아무런 문제가 없었습니다. jsFiddle에서 – wertyj

의 https://jsfiddle.net/#&togetherjs=wLkLbtfj7L을 (를) 사용할 필요가 없습니다. document.addEventListener ('DOMContentLoaded', function() {. 이것 좀보세요 : https://jsfiddle.net/9pd3dk10/ –

정말 대단히 고마워요. – wertyj

개체의 배열을 가져 와서 선택의 형태로 iframe에 배치

답변

관련 문제