Javascript-为onClick事件调用函数_Javascript_Function_Onclick

Javascript-为onClick事件调用函数

javascript function

Javascript-为onClick事件调用函数,javascript,function,onclick,Javascript,Function,Onclick,考虑以下代码： <html> <head> </head> <body> <script> function showAlert (text) { alert(text); } x = document.getElementById('aTag'); x.setAttribute('onclick', "alert('Hello Wor

考虑以下代码：

<html>

<head>
</head>

<body>
    <script>
        function showAlert (text) {
            alert(text);
        }

        x = document.getElementById('aTag');
        x.setAttribute('onclick', "alert('Hello World')"); //WORKS
        x.setAttribute('onclick', "showAlert('Hello World')"); //DNW (showAlert is not defined)
    </script>

    <table>
        <tr>
            <td><a href="javascript:void(0)" id="aTag">TEST</a></td>
        </tr>
    </table>
</body>

</html>

作为一名JS初学者，我认为问题可能与

showart

函数范围有关，也可能与

elementNode.setAttribute

方法上下文有关，其中不存在

showart

函数

我提前感谢大家抽出时间

尊敬。

在您尝试获取元素时，它还不存在。
将脚本标记移到底部，在结束正文标记之前

<table>
    <tr>
        <td><a href="javascript:void(0)" id="aTag">TEST</a></td>
    </tr>
</table>
<script>
    function showAlert (text) {
        alert(text);
    }

    x = document.getElementById('aTag');
    x.setAttribute('onclick', "alert('Hello World')"); //WORKS
    x.setAttribute('onclick', "showAlert('Hello World')"); //DNW (showAlert is not defined)
</script>


函数showAlert（文本）{
警报（文本）；
}
x=document.getElementById（'aTag'）；
x、 setAttribute（'onclick'，'alert（'Hello World'））//作品
x、 setAttribute（'onclick'，'showarter（'Hello World'））//DNW（未定义showAlert）

您无法使用javascript获取尚未输出到DOM的元素，因此无论何时尝试获取元素，请确保该元素可用。

像这样附加它应该可以完成以下工作：

x.onclick = function() {showAlert("foo");};

首先，感谢您抽出时间回复

最后，我看了下面的答案：我最终得到了以下代码：

<html>

<head>
</head>

<body>
    <script>
        // Display text function
        function showAlert(text) {
            alert("Called in showAlert: " + text);
        }
        // But for the previous function to work, we must make sure that it is loaded after the rest of the DOM
        window.onload = function() {
            document.getElementById("aTag").onclick = function fun() {
                showAlert("Hello World");
            }
        }
    </script>

    <table>
        <tr>
            <td><a href="javascript:void(0)" id="aTag">TEST</a></td>
        </tr>
    </table>
</body>

</html>


//显示文本功能
函数showAlert（文本）{
警报（“在showAlert:+文本中调用”）；
}
//但是为了使前一个函数能够工作，我们必须确保它在DOM的其余部分之后加载
window.onload=函数（）{
document.getElementById（“aTag”）.onclick=function fun（）{
showAlert（“你好世界”）；
}
}

现在，当我点击超链接时，我确实会看到一个对话框，显示

helloworld

消息

再次感谢大家（当然也是如此）。

可能重复的是，有什么理由我不应该在Firefox中使用传统的事件处理（第二行）吗？@FelixKling Nope。只是我太匆忙了。确实，你的语法很短，而且做得很好。谢谢

<html>

<head>
</head>

<body>
    <script>
        // Display text function
        function showAlert(text) {
            alert("Called in showAlert: " + text);
        }
        // But for the previous function to work, we must make sure that it is loaded after the rest of the DOM
        window.onload = function() {
            document.getElementById("aTag").onclick = function fun() {
                showAlert("Hello World");
            }
        }
    </script>

    <table>
        <tr>
            <td><a href="javascript:void(0)" id="aTag">TEST</a></td>
        </tr>
    </table>
</body>

</html>