首页 > 解决方案 > 如何使用 Node JS 访问 DOM 元素?

问题描述

JAVASCRIPT 文件

const path = require('path');
const http = require('http');
const fs = require('fs');

const dir = '../frontend/';

const server = http.createServer((request, respond) => {
      console.log(request.url);

      respond.writeHead(200, {
            'Content-Type': 'text/html',
      });

      const readStream = fs.createReadStream(dir + 'index.html', 'utf-8');
      readStream.pipe(respond);
});

const icons = 'icons/';

fs.readdir(icons, (error, files) => {
      if (error) throw error;

      files.forEach((file) => {
            if (path.extname(file) == '.svg') {
                  // I want to append this filename in the DOM Element.
                  document.querySelector('.container').innerHTML = file; // Like This
                  // console.log(file); 
            }
      });
});

server.listen(3000, 'localhost');

HTML 文件

<div class="container"></div>

每当我尝试执行上面的代码时,它都会给我一个这样的错误

                  document.querySelector('.container').innerHTML = file;
                  ^

ReferenceError: document is not defined
    at D:\Framework Final\backend\server.js:26:19
    at Array.forEach (<anonymous>)
    at D:\Framework Final\backend\server.js:23:13
    at FSReqCallback.oncomplete (fs.js:171:23)

谁能告诉我如何在不出错的情况下实现相同的目标。

标签: javascripthtmlnode.js

解决方案


在 NodeJS 中,文档对象不存在。您不能在NodeJS中访问 DOM 节点或 DOM 中的任何内容。

NodeJS 是服务器端Javascript。

如果您想从客户端获取任何数据,则必须添加客户端代码并将数据从客户端发送到服务器。这是通过后请求完成的。在后端,您必须设置带有路由的服务器。要在 NodeJS 中设置服务器,请使用Express(经常使用)。谷歌一下。


推荐阅读