html的题，不怎么会，凑字数凑字数

img


就是如何点击盒子1中的链接，让盒子2中的内容改变(让盒子1中的a或者b链接到盒子2或者盒子3)

就是一个简单的js问题么，左面放几个button,给button加上事件，点击不同的button，右边显示不同的内容。就这么个效果吧。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        .container{
            display: flex;
            flex-direction: row;
        }
        .left{
            width: 30%;
        }
        .left button{
            width: 100px;
            height: 50px;
            font-size: 21px;
        }
        .left div{
            margin-top: 15px;
        }
        .right{
            width: 50%;
            height: 300px;
            background-color: aliceblue;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="left">
            <div>
                <button id="red">red</button>
            </div>
            <div>
                <button id="green">green</button>
            </div>
            <div>
                <button id="blue">blue</button>
            </div>
        </div>
        <div id="right" class="right"></div>
    </div>
</body>
<script>
    document.getElementById('red').addEventListener('click',function(){
        document.getElementById("right").style.backgroundColor = "red";
    });
    document.getElementById('green').addEventListener('click',function(){
        document.getElementById("right").style.backgroundColor = "green";
    });
    document.getElementById('blue').addEventListener('click',function(){
        document.getElementById("right").style.backgroundColor = "blue";
    });
</script>
</html>

哈喽，不知道你是不是这个意思，有用请点采纳哦~

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title></title>
    <style>
      .menu{
        width: 40px;;
        display: inline-block;
        list-style: none;
        margin: 0;
      }
      .menu li{
        height: 40px;
        line-height: 40px;
        text-align: center;
        border:1px solid #ccc;
      }
      #content{
        display: inline-block;
        vertical-align: top;
      }
    </style>
  </head>
  <body>
    <ul class="menu">
      <li onclick="clickLi(event)">a</li>
      <li onclick="clickLi(event)">b</li>
      <li onclick="clickLi(event)">c</li>
      <li onclick="clickLi(event)">d</li>
    </ul>
    <section id="content">内容</section class="content">
    
    <script type="text/javascript" >
      function clickLi(e){
        document.getElementById('content').innerText = e.target.innerText
      }
    </script>
  </body>
</html>

这不就是tab选项卡嘛，也可以用iframe

可以选用别人写好的插件来实现。你要的效果很像是连线题。
参考：https://www.jq22.com/yanshi11429
操作效果：

img

javascript中直接写一个if判断也能解决

看我看我