SyntaxError: ожидается выражение, получил «<» Пытался убежать, но не работает

Question

меня возникли проблемы со следующими JavaScript,

<script type='text/javascript'> 
var $OriginalImage = 'http://4.bp.blogspot.com/-SUwv0x4nozI/UjBwsjK1AGI/AAAAAAAAZAI/HgfzndxJ_Nk/s1600/Android+Wallpaper.jpg'; 
var $thumbnail = $OriginalImage.replace('s1600','s320'); 

document.write = '<img alt='Android Monochrome Wallpaper' class='img-responsive img-hover' src=' +$thumbnail+ '/>'; 
</script> 

в консоли он получил сообщение об ошибке (ы).

Я попытался document.write(); разметку быть экранированы, но Бесполезный, т работу ... Как решить эту проблему?

Answer 1

Вот правильно спасся результат:

<script type='text/javascript'> 
    var OriginalImage = 'http://4.bp.blogspot.com/-SUwv0x4nozI/UjBwsjK1AGI/AAAAAAAAZAI/HgfzndxJ_Nk/s1600/Android+Wallpaper.jpg'; 
    var thumbnail = OriginalImage.replace('s1600','s320'); 
    document.write('<img alt="Android Monochrome Wallpaper" class="img-responsive img-hover" src="' +thumbnail+ '"/>'); 
</script> 

Но говорит, как @limelights в комментариях, вместо document.write, пойти на AppendChild

var OriginalImage = 'http://4.bp.blogspot.com/-SUwv0x4nozI/UjBwsjK1AGI/AAAAAAAAZAI/HgfzndxJ_Nk/s1600/Android+Wallpaper.jpg'; 
 
    var thumbnail = OriginalImage.replace('s1600', 's320'); 
 

 
    var DOM_img = document.createElement("img"); 
 
    DOM_img.alt = "Android Monochrome Wallpaper"; 
 
    DOM_img.class = "img-responsive img-hover" 
 
    DOM_img.src = thumbnail; 
 
    document.body.appendChild(DOM_img);

или с использованием setAttribute:

var OriginalImage = 'http://4.bp.blogspot.com/-SUwv0x4nozI/UjBwsjK1AGI/AAAAAAAAZAI/HgfzndxJ_Nk/s1600/Android+Wallpaper.jpg'; 
 

 
var thumbnail = OriginalImage.replace('s1600', 's320'); 
 
var elem = document.createElement("img"); 
 
elem.setAttribute("src", thumbnail); 
 
elem.setAttribute("class", "img-responsive img-hover"); 
 
elem.setAttribute("alt", "Android Monochrome Wallpaper"); 
 
document.body.appendChild(elem);

Дозапись на якорь тег:

var OriginalImage = 'http://4.bp.blogspot.com/-SUwv0x4nozI/UjBwsjK1AGI/AAAAAAAAZAI/HgfzndxJ_Nk/s1600/Android+Wallpaper.jpg'; 
 

 
    var thumbnail = OriginalImage.replace('s1600', 's320'); 
 
    var elem = document.createElement("img"); 
 
    elem.setAttribute("src", thumbnail); 
 
    elem.setAttribute("class", "img-responsive img-hover"); 
 
    elem.setAttribute("alt", "Android Monochrome Wallpaper"); 
 
    document.getElementById('addImage').appendChild(elem);

<a href="example.html" id="addImage"></a>

или без ID:

var OriginalImage = 'http://4.bp.blogspot.com/-SUwv0x4nozI/UjBwsjK1AGI/AAAAAAAAZAI/HgfzndxJ_Nk/s1600/Android+Wallpaper.jpg'; 
 

 
    var thumbnail = OriginalImage.replace('s1600', 's320'); 
 
    var elem = document.createElement("img"); 
 
    elem.setAttribute("src", thumbnail); 
 
    elem.setAttribute("class", "img-responsive img-hover"); 
 
    elem.setAttribute("alt", "Android Monochrome Wallpaper"); 
 
    document.getElementsByTagName("a")[0].appendChild(elem);

<a href="example.html"></a>