显示更多/更少按钮的 javascript 未捕获类型错误



我正在尝试为长文本设置截断/显示按钮。但是,该按钮不起作用,错误消息是"第 15 行错误未捕获的类型错误:无法将属性'一键'设置为 null。

第 15 行是 "button.onclick = function (( {">

完整代码是

<script>
var content = document.getElementById("content");
var button = document.getElementById("show-more");
 button.onclick = function () {
    if(content.className == "open"){
        //shrink the box
        content.className = "";
        button.innerHTML = "SHOW MORE";
    } else {
        //expand the box
        content.className = "open";
        button.innerHTML = "SHOW LESS";
    }
};
</script>

</head>
<body>

<div id="content">Lorem ipsum dolor sit amet, ante dignissim, varius elit urna erat odio lectus. Aenean laoreet pellentesque justo maecenas nec, viverra diam cras, lorem at vitae vestibulum, arcu lobortis ac. Netus vitae wisi odio vitae sagittis tortor, cras mauris
<br>
<br>
Urna volutpat libero libero, sed aliquet habitant. Metus sed. Velit sodales mauris purus ac nullam, ac eget lectus quam odio quisque urna, sed tempor sodales lorem dolor velit vestibulum, dui mattis cursus consequat porttitor. Pede velit viverra magna consectetuer,  </div>
<a id="show-more">SHOW MORE</a>
</body>
</html> 
<script>
window.onload = function(){
    var content = document.getElementById("content");
    var button = document.getElementById("show-more");
    button.onclick = function () {
        if(content.className == "open"){
            //shrink the box
            content.className = "";
            button.innerHTML = "SHOW MORE";
        } else {
            //expand the box
            content.className = "open";
            button.innerHTML = "SHOW LESS";
        }
    };
}
</script>

相关内容