javascript - 如何更改此元素的样式属性？

Question

我正在尝试为网站的移动版本制作下拉菜单，但似乎无法弄清楚我做错了什么。我有我想要的初始位置(固定在屏幕的右上角)，但是当您单击“菜单”选项卡时它什么也不做。这是我的 JSFiddle

<div id="mobile-nav-wrapper">
    <ul id="mobile-nav">
        <li>Main Menu</li>
        <ul>
            <li>Home</li>
            <li>About</li>
            <li>Contact</li>
            <li>Register</li>
            <li>FAQs</li>
            <li>Facebook</li>
        </ul>
        <li>This Page</li>
        <ul>
            <li>Some Text</li>
            <li>Who?</li>
        </ul>
    </ul>
    <span id="mobile-nav-button" onclick="pullmenu('#mobile-nav-wrapper')">Menu</span
</div>

Answer 1

您的 JavaScript 函数不是全局函数。您已将 JSFiddle 配置为将其包装在 onload 处理程序中。在该函数的范围之外无法访问它。

不要使用内部事件属性，它们依赖于全局变量。 Bind your event handlers with JS相反。

span 不是交互式元素。它不会出现在焦点顺序中，因此当您依赖于与它交互的人时，它会严重影响可访问性。请改用按钮。如果您不喜欢它的外观，请应用 CSS。

<button type="button" id="mobile-nav-button">Menu</button>

<script>
document.getElementById('mobile-nav-button').addEventListener('click', function (evt) {
   pullmenu('#mobile-nav-wrapper');
});

function pullmenu(etc) { etc }
</script>