iframeの後に置かれた場合、文字列がブートストラップリストを使用して表示されない

Question

どうしてiframeの隣にparsedList.titleが表示されないのですか？

https://jsfiddle.net/bobbyrne01/9ztgxhd7/

HTML

<div id="content"> 

</div> 

javascriptの

var parsedList = []; 
parsedList.push({'title': 'test', 'embed': '<iframe class="embedly-embed" src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fi.imgur.com%2F…key=2aa3c4d5f3de4f5b9120b660ad850dc9&amp;type=video%2Fmp4&amp;schema=imgur" width="200" height="160" scrolling="no" frameborder="0" allowfullscreen&gt;&lt;/iframe>'}); 
parsedList.push({'title': 'test2', 'embed': '<iframe class="embedly-embed" src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fi.imgur.com%2F…key=2aa3c4d5f3de4f5b9120b660ad850dc9&amp;type=video%2Fmp4&amp;schema=imgur" width="600" height="400" scrolling="no" frameborder="0" allowfullscreen&gt;&lt;/iframe>'}); 
parsedList.push({'title': 'test3', 'embed': '<iframe class="embedly-embed" src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fi.imgur.com%2F…key=2aa3c4d5f3de4f5b9120b660ad850dc9&amp;type=video%2Fmp4&amp;schema=imgur" width="300" height="160" scrolling="no" frameborder="0" allowfullscreen&gt;&lt;/iframe>'}); 
parsedList.push({'title': 'test4', 'embed': '<iframe class="embedly-embed" src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fi.imgur.com%2F…key=2aa3c4d5f3de4f5b9120b660ad850dc9&amp;type=video%2Fmp4&amp;schema=imgur" width="600" height="200" scrolling="no" frameborder="0" allowfullscreen&gt;&lt;/iframe>'}); 

document.getElementById('content').innerHTML = '<div class="list-group">'; 
for (var i = 0 ; i < parsedList.length; i++){ 

    if (parsedList[i].embed != null){ 
    parsedList[i].embed = parsedList[i].embed.replace(/width=".*?"/, 'width="200"'); 
    parsedList[i].embed = parsedList[i].embed.replace(/height=".*?"/, 'height="160"'); 
    document.getElementById('content').innerHTML += '<a href="#" class="list-group-item">' + parsedList[i].embed + parsedList[i].title + '</a>'; 
    } 
} 
document.getElementById('content').innerHTML += '</div>'; 

Answer 1

埋め込み特性がiframe終了タグを持っていません。ここにあなたの作業コードがあります。

Demo

allowfullscreen></iframe> 

はあなたのparsedList

におけるこれら

allowfullscreen ></iframe> 

によって置き換えられ、それがお役に立てば幸いです。

Answer 2

は、埋め込みコード内<と>脱出しないでください： 'embed': '<iframe class="embedly-embed" src="[...]" width="200" height="160" scrolling="no" frameborder="0" allowfullscreen> </iframe>'

https://jsfiddle.net/9ztgxhd7/3/