Файл Java script не функционирует в отрисованном HTML-файле с использованием express

#javascript #html #express

#javascript #HTML #выражать #экспресс

Вопрос:

Возможно, я неправильно написал свой заголовок, но моя проблема в том, что когда я визуализирую его с помощью ExpressJS, функциональность, которая была у меня в моем HTML-файле, больше не работает.

Комментарии:

1. Привет, не могли бы вы, пожалуйста, предоставить минимальный воспроизводимый пример. Спасибо

Ответ №1:

Не могли бы вы, пожалуйста, пояснить? Какую ошибку вы получаете?

Возможно, вы загружаете и выполняете скрипт до загрузки вашей страницы. В этом случае вашему JavaScript не удастся получить объекты из DOM (потому что в нем ничего нет).

Попробуйте использовать defer при загрузке ваших скриптов.

Комментарии:

1. Я не получаю никаких ошибок. Допустим, я хочу, чтобы мой скрипт получал предупреждение при нажатии кнопки, когда я загружаю html-страницу, обычно это работает, но при загрузке в ExpressJS этого не происходит

2. HTML: <!DOCTYPE html> <html lang=»en»> <head> <meta charset=»UTF-8″> <meta name=»viewport» content=»width= ширина устройства, начальный масштаб = 1.0″> <title> Веб-приложение для совместного использования файлов</title> <script src=»C:/users/Jason/Desktop/JavaScript/Personal Projects/FileSharingService/webserver.js «async></script> </head> <body> <идентификатор кнопки=»test-Btn»> Тест</кнопка> </body> </html>

3. Сервер Express: var express = require(«экспресс»); var app = express(); var logger = require(«морган»); var path = require(«путь»); const bodyParser = require(«анализатор тела»); var router = express. Router(); var port = 8888; app.use(logger(«dev»)); app.use(‘/’, маршрутизатор); app.listen(порт, функция(ошибка) { if(err){ console.log(«ошибка веб-сервера») }else{ console.log( Webserver has been deployed and listening on port ${port}, using Express ); router.get(‘/’, (req, res) => { res.sendFile(__dirname ‘/public/index.html ‘) }) } })

4. app.js : const test = document.getElementById(«test-Btn»); addEventListener(‘click’, ()=>{console.log(«нажата»)})

5. В вашем HTML-файле: <script src=»C:/users/Jason/Desktop/JavaScript/Personal Projects/FileSharingService/webserver.js «асинхронность> Заменить асинхронность на defer. Что делает async, как только ваш скрипт загружается, он выполняется. С другой стороны, defer перенес выполнение после того, как HTML был проанализирован. Кроме того, вы также можете захотеть использовать alert вместо console. войдите в свой прослушиватель событий и добавьте свой прослушиватель событий к кнопке как — app.js : const test = document.getElementById(«test-Btn»); test.addEventListener(‘click’, ()=>{оповещение («нажато»)})