Код javascript во внешнем файле

Question

Когда я печатаю этот код, он либо запускает один или другой не тот, и другой, и который когда-либо на первом месте.

var topBox = document.getElementById('boxOne'); 
topBox.textContent = 'hello!' 

var bottomSection = document.getElementById('bottomSection'); 
bottomSection.onmouseover = function() { 
    bottomSection.textContent = ''; 
    bottomSection.style.padding = ''; 
}; 

bottomSection.onmouseout = function() { 
    bottomSection.textContent = ''; 
    bottomSection.style.padding = ''; 
}; 

Answer 1

(function(){ 
 
    var topBox = document.getElementById('boxOne'); 
 
    topBox.textContent = 'hello!' 
 

 
    var bottomSection = document.getElementById('bottomSection'); 
 
    bottomSection.onmouseover = function() { 
 
    bottomSection.textContent = 'foo'; 
 
    bottomSection.style.padding = ''; 
 
    }; 
 

 
    bottomSection.onmouseout = function() { 
 
    bottomSection.textContent = 'bar'; 
 
    bottomSection.style.padding = ''; 
 
    }; 
 
}())

<div id="boxOne"></div> 
 
<div id="bottomSection">I am bottom section</div>

Это похоже на работу. Не уверен, что не работает для вас.

Answer 2

Вы, наверное, можете добавить слушателя событий, чтобы слушать для наведения мыши/MouseOut действий, как так:

var bottomSection = document.getElementById("bottomSection"); 

bottomSection.addEventListener("mouseover", function() { 
bottomSection.textContent = ''; 
bottomSection.style.padding = ''; 
});