html中，如何用css实现点击一个事件，一个div内容显示，点击另一个事件，同一个div显示内容

html中，如何用css实现点击一个事件，一个div内容显示，点击另一个事件，同一个div显示内容，并且隐藏上一个内容，求代码

第1个回答推荐于2017-11-22

C3高级：target属性可以初步实现吧..
<style>
#d1{
display:none;
width:100px;
height:100px;
background:#f00;
}
#d2{
display:none;
width:100px;
height:100px;
background:#0f0;
}
#d1:target{
display:block;
}
#d2:target{
display:block;
}
</style>
<a href="#d1">第一个div</a>
<a href="#d2">第二个div</a>
<div id="d1">
</div>
<div id="d2">
</div>
这是代码本回答被提问者和网友采纳

第2个回答 2016-07-25

这个得用javascript写，在clik事件里面操作div的css属性追问

求具体代码

追答

楼下的可以，他就是按照我的思路写的

第3个回答 2016-07-25

css中display属性可以控制div隐藏或显示，display属性值为none时元素不被显示，为block时则会显示此元素。不太明白你的意识，看看这个代码符合你的要求不

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JavaScript display</title>
  <script language="javascript" type="text/javascript">
  function display(){
  var div1 = document.getElementById("div1");
  if(div1.style.display=="none"){
  div1.style.display = "block";
  div2.style.display = "none";
  }else{
  div1.style.display = "none";
  div2.style.display = "block";
  }
  }
  </script>
</head>
<body>
  <input type="button" value="点击" onclick="display()"></input>
  <div id="div1">www.java-learn.com</div>
  <div id="div2">Java学习网_Java学习从此开始</div>
</body>
</html>

相似回答

如何点击一个按钮把一个div的内容显示出来答：给div指定一个ID属性，点击按钮时，更改div的display属性为 "block"<body> <input type="button" value="显示" id="test"> <div id="testDiv" style="width:100px; height:100px; border:1px solid red; display:none;"></div> </body> <script type="text/javascript"> document.getElem...

大家正在搜