Question

我对Javascript很新。我一直在研究使用Javascript来编辑css样式属性。我搜索过网络并查看了很多不同的问题。即便如此，我可能也缺乏经验，为什么我无法弄清楚我的代码有什么问题。问题的另一个原因是，有很多方法可以做到这一点。无论如何，这里有具体细节。

我想要它做什么： 当有人点击代码中的链接时，我希望隐藏的DIV（它只是在我等待调用的顶部附近）将其可见性切换为可见，以便在页面上创建一个新层。 / p>

我的代码：

<html>
    <head>
        <script language="javascript">
            function newwindow() {
                var showme = document.getelementbyid("testing");
                showme.style.visibility = "visible";
            }
        </script>
    </head>
    <body>
        <a href="#" onclick="newwindow()">Show me my hidden layer</a>
        <div id="testing" style="position: absolute; visibility: hidden; left: 50%; top: 50%;
    border: 1px solid darkblue; width: 400px; height: 300px; line-height: 300px;     
    text-align: center; vertical-align: middle;
    margin-top: -150px; margin-left: -200px; background: lightgray">HELLO!!!</div>
    </body>
</html>

现在，我知道有很多方法可以做到这一点。但有人可以告诉我在我给出的代码中调整什么来制作我写这个作品的方式吗？非常感谢你的时间。

Answer 1

document.getElementById而非document.getelementbyid

Working Demo

Answer 2

使用此代码

    <html>
        <head>
            <script language="javascript">
                function newwindow() {
                    var showme = document.getElementById("testing");
                    showme.style.visibility = "visible";
                }
            </script>
        </head>
        <body>
            <a href="#" onclick="newwindow()">Show me my hidden layer</a>
            <div id="testing" style="position: absolute; visibility: hidden; left: 50%; top: 50%;
        border: 1px solid darkblue; width: 400px; height: 300px; line-height: 300px;     
        text-align: center; vertical-align: middle;
        margin-top: -150px; margin-left: -200px; background: lightgray">HELLO!!!</div>
        </body>
    </html>

Javascript - CSS，可见性onclick

2 个答案: