Question

我的页面中有一个按钮

<button onclick="document.getElementById('donation').style.visibility='visible'">Support</button>

我希望将隐藏的div（捐赠）视为可见。我不确定getElementById是否适用于div，但我也找不到，因为当我将Id更改为h1时，对于样式的简单颜色更改，它也无法正常工作。我的按钮或语法有问题吗？

Answer 1

为了使document.getElementById('donation')返回DOM元素，此条件必须为真

您的网页中应该有一个html元素 ，只有一个 和id="donation"。例如：<div id="donation"></div>

您的功能可能完美无缺（您可以通过在按下按钮后查看浏览器console来轻松判断）但您的元素仍然不可见。例如，如果其display属性设置为none。浏览器可能无法呈现元素的原因有很多。找出原因的最快方法是创建一个最小，完整且可验证的示例（使用＆lt;＆gt; 按钮），我们可以在这里遇到问题。

Answer 2

您仍然可以使用内联onclick来处理此问题。

Andrei对于需要成为个人的身份是正确的。

<button onclick="document.getElementById('donation').style.visibility='visible'">Support</button>
<div style="background-color: gray; width: 50px; height: 50px; visibility: hidden;" id="donation"></div>

从技术上讲，最好将css和javascript保存在head标签中或html之外。

Answer 3

对我而言，我认为分离代码会使事情更加清晰和可读。

<button id="donation_btn">Support</button>

javascript

function enableDonation( button, donationElement ) {

    // check if the button is defined
    if ( button != undefined 
    && button != null ) {

        button.addEventListener( "click", function () {
            donationElement.style.display = "block";
        });
}

 // execute the code on document load
window.addEventListener( "load", function () {

    enableDonation( 
        document.getElementById( "donation_btn" ), 
        document.getElementById( "donation" )
    );

});

“document.getElementbyId”对我不起作用

3 个答案: