javascript - 我有四个按钮，希望在单击每个按钮时返回唯一的文本

Question

这是我的脚本。下面它似乎工作正常，但它在我的网站上不起作用。我看过其他建议使用 document.querySelector 的示例，但我对 Js 根本不是很熟悉，并且在实现示例脚本时遇到了麻烦。谁能阐明我做错了什么以及我如何才能更好地编写和压缩脚本？提前感谢您的时间和帮助!

document.getElementById("btn").onclick=function () {
        document.getElementById("secdes").innerHTML="change";
   }
    
    document.getElementById("btn1").onclick=function () {
        document.getElementById("secdes").innerHTML="changes";
   }

 <div class="col-md-4 buttons btnbox">
                        <button type="button" name="btn" id="btn" class="btn btn-outline-primary homebtn">Home Page</button>
                        <button type="button" name="btn1" id="btn1" class="btn btn-outline-secondary secondarybtn">Secondary Page</button>
                        <button type="button" name="btn2" id="btn2" class="btn btn-outline-secondary blogbtn">Blog</button>
                        <button type="button" name="btn3" id="btn3" class="btn btn-outline-secondary blogbtn">About Page</button>
                        
                        
                        <p class="rubydes">To create the fantasy world for the viewers each illustration incorporated the theme of "The Yellow Brick Road". </p>
                                        
                        <p class="secdes" id="secdes">The challenge of the home page was to seamlessly incorporate the shoe box and "Ruby Slipper" photograph into the illustration.</p>
                       
                       
    
                    
                    </div>

Answer 1

您可能会尝试为每个按钮提供一个唯一的 ID，然后从 javascript 访问它们。