编程语言
首页 > 编程语言> > 如何使用JavaScript来改变div backgroundColor

如何使用JavaScript来改变div backgroundColor

作者:互联网

下面的HTML

<div id="catestory">

  <div class="content">
     <h2>some title here</h2>
      <p>some content here</p>
  </div>

  <div class="content">
     <h2>some title here</h2>
      <p>some content here</p>
  </div>

  <div class="content">
     <h2>some title here</h2>
      <p>some content here</p>
  </div>

</div>

当鼠标悬停div的内容时,它的backgroundColor和h2(在这个div中)backgroundColor改变(就像CSS:hover)

我知道这可以使用CSS(:hover)在现代浏览器中执行此操作,但IE6不起作用.

如何使用JavaScript(不是jQuery或其他JS框架)来做到这一点?

编辑:如何更改h2 backgroundColor

解决方法:

var div = document.getElementById( 'div_id' );
div.onmouseover = function() {
  this.style.backgroundColor = 'green';
  var h2s = this.getElementsByTagName( 'h2' );
  h2s[0].style.backgroundColor = 'blue';
};
div.onmouseout = function() {
  this.style.backgroundColor = 'transparent';
  var h2s = this.getElementsByTagName( 'h2' );
  h2s[0].style.backgroundColor = 'transparent';
};

标签:javascript,background-color
来源: https://codeday.me/bug/20190923/1813402.html