Уважаемые форумчане! Просьба помочь со скриптом. Краткая информация о скрипте: 1. Скрипт генерит 5 элементов img и добавляет их в один из двух пустых div. 2. Скрипт копирует все элементы из одного div в другой, при этом удаляя один элемент img. Получаем 5 и 4 элемента img в двух div. До этого момента все гладко. Далее скрипт должен при нажатии на lastChild левого div, которым является один из img удалять всех child из обоих div и генерить уже 10 и 9 соответственно (по схеме выше). Или, при нажатии на любой другой child в div кроме последнего, выдавать сообщение. Вот проблема заключается в том, что не получается прописать событие onclick на последнем child'e одного из div, чтобы произошел вызов функции. Заранее благодарю за помощь. Это проблемный участок скрипта: """" theLeftSide.lastChild.onclick= function nextLevel(){ // onclick.stopPropagation(); numberOfFaces += 5; //delete all childNodes while(theBody.firstChild){theBody.removeChild(theB ody.firstChild); generateFaces(); }} """" Весь скрипт: <!doctype html> <html> <head> <style> #rightSide { left: 500px; border-left: 2px solid black; width:500px; height:500px; position:absolute ;} #leftSide {width:500px; height:500px;position:absolute;} img{position:absolute;} </style> <meta charset="utf-8"> <title>Matching Game</title> <script> numberOfFaces =5; theLeftSide=document.getElementById("leftSide"); theRightSide =document.getElementById("rightSide"); theBody = document.getElementsByTagName("body")[0]; function generateFaces() { //1st for(i=1;i<=numberOfFaces;i++){ //2nd var i=1; while(i<=numberOfFaces){ // var image=document.createElement("img"); image.src="smile.png"; image.style.top=Math.floor(Math.random()*401)+"px"; image.style.left=Math.floor(Math.random()*401)+"px"; leftSide.appendChild(image); i++; } var leftSideImages = leftSide.cloneNode(true); leftSideImages.removeChild(leftSideImages.lastChild); rightSide.appendChild(leftSideImages); //part3 end } theLeftSide.lastChild.onclick= function nextLevel(){ // onclick.stopPropagation(); numberOfFaces += 5; //delete all childNodes while(theBody.firstChild){theBody.removeChild(theBody.firstChild); generateFaces(); } } theBody.onclick = function gameOver() { alert("Game Over!"); theBody.onclick = null; theLeftSide.lastChild.onclick = null; } </script> </head> <body onLoad="generateFaces()"> <h1>Matching Game</h1> <p>Click on the extra smiling face on the left.</p> <div id="leftSide"></div> <div id="rightSide"></div> </body> </html>
