window.onload()方法中代码顺序

先看错误的代码演示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>通过document获取数据or赋值</title>
    <style type="text/css">
        input{margin: 10px}
    </style>
    <script type="text/javascript">
        window.onload = function () {
            function fn3() {
                var inputElements = document.getElementsByTagName("input");
                for(i=0;i<inputElements.length;i++){
                    alert(inputElements[i]);
                }
            }
            var nameButton = document.getElementById("nameButton");
            nameButton.onclick = fn3();
        }

    </script>
</head>
<body>
    姓&emsp;&emsp;名:<input type="text" name="username" id="username"/><br/>
    密&emsp;&emsp;码:<input type="password" name="password"/><br/>
    确认密码:<input type="password" name="password_confirm"/>
    <hr/>
    <input type="button" value="点击此处获取对应id对话框的属性值" id="button"/>
    <input type="button" value="通过name属性获取并弹出密码输入框的值" onclick="fn2()"/>
    <input type="button" value="通过标签名称获取并弹出所有input元素的value值" id="nameButton"/>
</body>
</html>

window.onload()方法中代码顺序

运行此代码后直接就执行循环内容,,且没有如实的弹出value值。
之所以会没有点击按钮就执行弹出框,是因为window.onload()方法中代码顺序不正确。
但是为何没有正确输出input元素中value值,需进一步探究。

上一篇:The frist email to myself by python


下一篇:Object.keys()/Object.values()/Object.entries,将对象转换成某种数组