Question

这是我到目前为止所做的 - 但我还需要处理和清空评论，在提交后清除字段并发布多条评论。真的不想要答案 - 只是提示我需要查看的位置，以及我是否完全偏离基础。

function registerClickHandler() {
   var commentButton = document.getElementByID('postComment');
   commentButton.onclick = addComment();
}

function addComment() {
    var list = document.getElementByID('commentList');
    var commentContent = document.getElementByID('comment')
    var newComment = document.createElement('li');

    newComment.appendChild(document.createTextNode(commentContent));
    list.appendChild(newComment);
}

<ul id='commentList'>
</ul>
<form>
   <input type='text' id='comment'/>
   <input type='button' id='postComment' value='Post'/>
</form>

Answer 1

看看这段代码working example，基本上你有语法错误：

为getElementById
更改getElementByID的所有货币

document.getElementByID('postComment');

的

document.getElementById('postComment');

并调用定义点击处理程序的函数

registerClickHandler();

获取元素的值

var commentContent = document.getElementById('comment').value;

Answer 2

一些提示：

没有getElementByID功能，只有getElementById，因为javascript区分大小写。
commentButton.onclick = addComment();错误，因为您调用addComment函数而不是将其指定为onclick事件的事件处理程序。您应该删除括号commentButton.onclick = addComment;。
使用document.getElementById('comment').value;获取或设置文字输入的值。

使用javascript在click上添加带有文本组件的li元素

2 个答案: