Question

我正在学习javascript，在这个脚本中我试图在点击按钮时插入一个简单的文本行。我尝试了两种方法，两者都给了我一个错误。

 <input type="button" value="getValue" id="getValue" />
 <div id="rowgen"></div>

(function(){
    window.onload = function() {

    // Code to display a google map on page
    //...

    document.getElementById("getValue").onclick = function(){
        document.getElementById.innerHTML('rowgen') += '<p>Hello world</p>';
  };

    }
})();

我收到了行Uncaught ReferenceError: Invalid left-hand side in assignment

的错误document.getElementById.innerHTML('rowgen') += '<p>Hello world</p>';

对于第二种方法，我试过：

<input type="button" value="getValues" id="getValues" onclick="genRow()"/>
<div id="rowgen"></div>

(function(){
    window.onload = function() {

    // Code to display a google map on page
    //...

    function genRow(){
        document.getElementById.innerHTML('rowgen') += '<p>Hello world</p>';
    }

    }
})();

这次我在第Uncaught ReferenceError: genRow is not defined行

上的HTML文件<input type="button" value="getValues" id="getValues" onclick="genRow()"/>中收到错误

Answer 1

genRow需要在onload区之外。当你打电话时它还不存在。

此外，您的getElementById来电已修复如下：

function genRow(){
    document.getElementById('rowgen').innerHTML += '<p>Hello world</p>';
}

(function(){
    window.onload = function() {

    // Code to display a google map on page
    //...

    }
})();

Answer 2

我认为你并不完全理解innerHTML是如何运作的;它是你对象的属性：

document.getElementById('rowgen').innerHTML += '<p>Hello world</p>';

你的功能中的

应该可以工作。

我会避免使用内联onclick属性，但如果必须使用它们，则必须将方法公开给全局window，如下所示：

window.genRow = function() {
    // Code
};

尝试在按钮单击时添加innerhtml时出现Javascript错误

2 个答案: