Question

请大神帮忙写个JS，移动到某元素显示div

<div class="lm_dt">
<ul class="hy_th">
<li><a href="/news.asp?class=%CD%F8%D5%BE%B9%AB%B8%E6" id="news1" class="h01" onmouseover="showNews(1)" target="_blank">官方公告</a></li>
<li><a href="/news.asp?class=%D7%EE%D0%C2%B4%D9%CF%FA" id="news2" onmouseover="showNews(2)" target="_blank" class="">促销信息</a></li>
<li><a href="/news.asp?class=%BC%BC%CA%F5%CE%C4%D5%C2" id="news3" onmouseover="showNews(3)" target="_blank" class="">技术文章</a></li>
<li><a href="/news.asp?class=%B3%A3%BC%FB%CE%CA%CC%E2" id="news4" onmouseover="showNews(4)" target="_blank" class="">常见问题</a></li>
</ul>
</div>
<ul class="n_list" id="tb1" style="display: block;">
{#首页公告}
</ul>
<ul class="n_list" id="tb2" style="display: none;">
{#最新促销}
</ul>
<ul class="n_list" id="tb3" style="display: none;">
{#技术文章}
</ul>
<ul class="n_list" id="tb4" style="display: none;">
{#常见问题}
</ul>
当鼠标移到<li>促销信息</li>，给<li>促销信息</li>加上class="h01"，并把官方公告的 class="h01"取消，并且显示<ul>最新促销</ul>，隐藏首页公告。

Answer 1

function showNews(x) {
  for (var i = 0; i < 4; i++) {
    document.getElementsByClassName('n_list')[i].style.display = (x-i==1)?"block":"none";
    document.getElementsByClassName('hy_th')[0].children[i].children[0].className = (x-i==1)?"h01":"";
  }
}