2014-11-28 5 views
0

У меня действительно есть проблема с этой функцией replaceChild(). Я пытаюсь научить себя javascript. Слава богу, я изучил объектно-ориентированные основы из java или я полностью потеряю. Может ли этот код заменять одно изображение другим. Это не замена картины вообще. Может ли кто-нибудь сказать мне, что я делаю неправильно? Я буду очень признателен.Что я делаю неправильно с replaceChild()?

<html> 
<body> 

<script type = "text/javascript"> 

function isImage(y){ 
// used to embed images 
var peter = document.createElement("img"); 
peter.width = y; 
peter.height = "600"; 
peter.src = "site.jpg"; 
document.body.appendChild(peter); 
} 


function secondImage(x){ 
var peterII = document.createElement("img"); 
peterII.width = x; 
peterII.height = "600"; 
peterII.src = "home.png"; 
document.body.replaceChild(peterII,peter); 
} 

//function listener 

function addListeners1(){ 

// adds eventlistener to the button listed at the bottom 
document.getElementById('mybutton').addEventListener("click",btntwo); 
document.getElementById('mybuttonII').addEventListener("click",btnthree); 
} 

function btntwo(){ 
isImage(400); 
} 


function btnthree(){ 
secondImage(400); 
} 


// adds listener when the window is loaded 
onload = addListeners1; 
//onload = isImage(400); 

</script> 

<! adds buttons> 
<button id="mybutton" style="width:100;height:50" value = "clickhere">MyButton</button> 
<button id="mybuttonII" style="width:100;height:50">MyButtonII</button> 


</body> 
</html> 
+2

Переменная 'peter' является локальным для сферы' isImage ('). –

+0

Вы должны были заметить ReferenceError в 'secondImage', когда пытались ссылаться на неопределенную переменную' peter'. Вы смотрели консоль? –

ответ

0

проверка этот код

var peter; 
 

 
function isImage(y){ 
 
// used to embed images 
 
peter = document.createElement("img"); 
 
peter.width = y; 
 
peter.height = "600"; 
 
peter.src = "http://www.gettyimages.com/CMS/Pages/ImageCollection/StaticContent/image5_170127819.jpg"; 
 
document.body.appendChild(peter); 
 
} 
 

 

 
function secondImage(x){ 
 
var peterII = document.createElement("img"); 
 
peterII.width = x; 
 
peterII.height = "600"; 
 
peterII.src = "http://www.studiotv.com.au/wp-content/uploads/2014/07/Klimas-website-edited.jpg"; 
 

 
document.body.replaceChild(peterII,peter); 
 
} 
 

 
//function listener 
 

 
function addListeners1(){ 
 

 
// adds eventlistener to the button listed at the bottom 
 
document.getElementById('mybutton').addEventListener("click",btntwo); 
 
document.getElementById('mybuttonII').addEventListener("click",btnthree); 
 
} 
 

 
function btntwo(){ 
 
isImage(400); 
 
} 
 
function btnthree(){ 
 
secondImage(400); 
 
} 
 
addListeners1();
<! adds buttons> 
 
<button id="mybutton" style="width:100;height:50" value = "clickhere">MyButton</button> 
 
<button id="mybuttonII" style="width:100;height:50">MyButtonII</button>

Смежные вопросы