javascript - 我的 js 文件没有响应新的编辑
问题描述
我正在更新我构建的 Web 应用程序。我对 HTML 和 CSS 所做的更改会显示在 DOM 上。但是,当我尝试在我的 JS 文件中进行更改时,它们不会显示在 DOM 上。我使用 console.log 对此进行了测试,但它仍然没有显示在 chrome 开发控制台中。我使用导入/导出而不是脚本标签来连接我的 js 文件。如果需要,我很乐意上传我的代码。先感谢您。
这是HTML。我使用 Webpack 来打包代码。它通过“bundle.js”脚本连接。
`
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link href="https://fonts.googleapis.com/css2?family=Libre+Franklin:wght@300&display=swap" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Libre+Franklin:wght@300&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<title>remoteUp</title>
<link rel="icon" type="image/ico" href="/dist/img/favicon/apple-touch-icon.png" />
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Abel&display=swap" rel="stylesheet">
</head>
<body>
<div class="container">
<header class="header">
<img src="/remotetechjobs/dist/img/logo.png">
<div class="header_text">
<h1 class="header_name">remoteUp</h1>
<h2 class="header_subname">work in tech from anywhere</h2>
</div>
<form class="search">
<input class="search__field" placeholder="Search thousands of jobs ..." />
</form>
<div class="likes">
<h2 class="likes_heading"><i>Liked Jobs</i></h2>
<div class="likes__field">
<svg class="likes__icon"><use href="img/icons.svg#icon-heart"></use></svg>
</div>
<div class="likes__panel"><ul class="likes__list"></ul></div>
</div>
</header>
<div class="results">
<br />
<ul class="results__list"></ul>
<div class="results__pages"></div>
</div>
<div class="job"></div>
</div>
<footer>
<div class="copyright">Copyright 2020 © Dylan Yudis <br> Powered by Github Jobs</div>
<div class="icon-bar">
<a href="https://github.com/dyudis314" target="_blank" class="github"><i class="fa fa-github"></i></a> <a href="https://www.linkedin.com/in/dylanyudis/" target="_blank" class="linkedin"><i class="fa fa-linkedin"></i></a>
<a href="mailto:dyudis314@gmail.com" target="_blank" class="google"><i class="fa fa-google"></i></a>
</div>
</footer>
<script nomodule="" src="https://unpkg.com/ionicons@5.1.2/dist/ionicons/ionicons.js"></script>
<script src="js/bundle.js"></script>
<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.10"></script>
<script
src="https://code.jquery.com/jquery-3.5.1.js"
integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
crossorigin="anonymous"></script>
<!-- Auto typing in search bar -->
<script>
const options = {
strings:
[
'^750software engineer',
'^1000junior dev',
'^1000QA',
'^1000C#',
'^1000data engineer',
'^1000react native',
'^1000frontend dev'
],
typeSpeed: 60,
backSpeed: 60,
loop: true,
};
const typed = new Typed('.search__field', options);
/* document.querySelector(".search__field").addEventListener("click", function() {
typed[0].stop(true);
});*/
</script>
</body>
</html>`
解决方案
推荐阅读
- java - 将数据从一个屏幕传输到另一个屏幕
- c# - 使用 MsBuild 时 Wix 的构建顺序不正确
- python - 将 numpy 浮点数组转换为整数,替换 NaN 值
- tomcat - 为什么 Tomcat reloadable=true 导致 CPU 100%?
- java - 在 Maven 部署中命名 .tar
- html - 如何将不同的网址设置为
- sql - 在选择函数中获取最大值
- entity-framework - 为什么 EF 核心数据上下文更新外键对象集合?
- apache-kafka - Kafka:描述消费者组偏移量
- python - 带有 GoogleNews-vectors-negative300.bin 的 word2vec 错误