我正在制作一个关于制作基本聊天机器人的 Youtube 教程，我使用 JS、Python 3.11.4、HTML、Flask 和 CSS。大部分代码都是正确的，但每次运行时都会出现错误，并且无法打开聊天气泡。
错误如下：
Uncaught ReferenceError: selectors is not defined
这是JS代码的相关部分：
class Chatbox {
constructor() {
this.args = {
openButton: document.querySelector(selectors, ".chatbox__button"),
chatBox: document.querySelector(selectors, ".chatbox__support"),
sendButton: document.querySelector(selectors, ".send__button"),
};
this.state = false;
this.messages = [];
}
// Rest of functions and so on
这是 HTML，因为它可能会出现错误：
<!DOCTYPE html>
<html lang="en">
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<head>
<meta charset="UTF-8">
<title>Chatbot</title>
</head>
<body>
<div class="container">
<div class="chatbox">
<div class="chatbox__support">
<div class="chatbox__header">
<div class="chatbox__image--header">
<img src="https://img.icons8.com/color/48/000000/circled-user-female-skin-type-5--v1.png" alt="image">
</div>
<div class="chatbox__content--header">
<h4 class="chatbox__heading--header">Chat support</h4>
<p class="chatbox__description--header">Hi. My name is Sam. How can I help you?</p>
</div>
</div>
<div class="chatbox__messages">
<div></div>
</div>
<div class="chatbox__footer">
<input type="text" placeholder="Write a message...">
<button class="chatbox__send--footer send__button">Send</button>
</div>
</div>
<div class="chatbox__button">
<button><img src="{{ url_for('static', filename='images/chatbox-icon.svg') }}" /></button>
</div>
</div>
</div>
<script>
$SCRIPT_ROOT = {{ request.script_root|tojson }};
</script>
<script type="text/javascript" src="{{ url_for('static', filename='app.js') }}"></script>
</body>
</html>
只需使用
document.querySelector(".chatbox__button")