Question

所以我刚开始使用HTML和JavaScript，我认为尝试使用iFrame会很有趣。

但我遇到了一个我似乎无法解决的问题：未捕获的TypeError：无法读取属性＆＃39;值＆＃39;为null

这是代码：

<!DOCTYPE html>

<html>
    <head>
        <meta charset="UTF-8">
        <script>
            var link = document.getElementById("LinkJ");
            var button = document.getElementById("ButtonJ");
            var surf = document.getElementById("SurfJ");

            function PressButton(){
                surf.src = link.value;
            }
        </script>
    </head>

    <body>
        URL:
        <input name="LinkN" id="LinkJ" type="url" value="http://www.bing.com/"></input>
        <button name="ButtonN" id="ButtonJ" onclick="PressButton()">Surf</button>

        <br><br>

        <iframe name="SurfN" id="SurfJ" style="position: absolute; height: 80%; width: 90%" src="http://www.bing.com/">
        </iframe>
    </body>
</html>

Answer 1

您的脚本在呈现DOM之前正在执行。在html末尾或您正在使用的DOM元素之后移动脚本。

或者您也可以将脚本更新为以下

<script>
    function PressButton(){
        document.getElementById("SurfJ").src = document.getElementById("LinkJ").value;
    }
</script>

JavaScript getElementById返回null错误？

1 个答案: