如何在 ejs 中访问文档 dom 对象？答案

【问题标题】：how do i access the document dom object in ejs?如何在 ejs 中访问文档 dom 对象？
【发布时间】：2015-06-30 19:31:02
【问题描述】：

我正在尝试在用户单击按钮时显示参与者列表。但每次我最终都会出现错误“”文档未定义“。（请不要给我 jquery！）。

<% var bt = document.getElementById("bt");
        bt.addEventListener('onclick',function(){
    var chatbox = document.getElementsByClassName('parti');
    var msg = document.createElement('div');
    msg.setAttribute('class', 'participants');
    msg.textContent('Participant \n\n\n'); %>
<%= chatbox.appendChild(msg); %>
<% }); %>

【问题讨论】：

您的模板在服务器上呈现，而不是在浏览器中，因此您无法访问模板中的 DOM。
@robertklep 那么我该如何在客户端设置 eventListeners 呢？
客户端JS代码（常规<script>标签）。

标签： javascript express ejs

【解决方案1】：

改变这一行：

bt.addEventListener('onclick',function(){

有了这个：

bt.addEventListener('click',function(){

当我们使用 addEventListener 时，我们不需要为偶数名称使用前缀 'on'。

此外，您已经使用了 getElementsByClassName，为此您需要遍历数组，因此请使用：

<%= chatbox[0].appendChild(msg); %>

【讨论】：