javascript - 如何更改多个getElementById？

Question

它的工作，但唯一的第一个 get elementbyid 正在工作，我的意思是它是唯一改变 id 值的代码。

这是我的html

<li ><a href="#Home" id="activehome" onclick="load_home()">HOME</a></li>
<li ><a href="#Products" id="inactiveproducts" onclick="load_products()">PRODUCTS</a>

这是我的脚本

function load_home(){
  document.getElementById("content").innerHTML='<object class="slideshow"  type="text/html" data="home.html" style="overflow:hidden; width: 100%;   height:500px;" ></object>';

  if(document.getElementById("inactivehome")){
    document.getElementById("inactivehome").id = "activehome";
    document.getElementById("activeproducts").id = "inactiveproducts";
    document.getElementById("activeservice").id = "inactiveservice";
    document.getElementById("activeabout").id = "inactiveabout";
    document.getElementById("activecontactus").id = "inactiveproducts";
  }
}

Answer 1

如果我正确理解您的问题，您想要实现的目标是更改单击元素的外观以表明其当前处于事件状态？如果是这种情况，最好的方法可能是只切换一个事件类，因为您似乎没有对 ID 执行任何特定操作。

HTML

<li><a href="#Home" class="active" onclick="load_home()">HOME</a></li>
<li><a href="#Products" onclick="load_products()">PRODUCTS</a></li>

JS

$("a").click(function() {
  $(".active").removeclass();
  this.addClass("active");
);

CSS

.clicked {
  //do something
}