在前端开发中，我们通常会使用script标签来引入JavaScript文件。在HTML5中，可以使用以下方式：
------- ---------------------------------
然而，还有一种常见的用法是在script标签中直接编写JavaScript代码，例如：
-------- -- ---------- ---- ---- ---------
在这种情况下，很多人会加上一个空的href属性，例如：
------- --------- -- ---------- ---- ---- ---------
这样做的目的是为了避免页面刷新或跳转。但是，实际上这种写法是不正确的。
href="#"的问题
使用href="#"的主要问题是它会导致不必要的页面跳转。当用户单击链接时，浏览器将尝试滚动到文档顶部并加载当前页面的锚点。由于#表示当前页面的锚点，因此浏览器将尝试滚动到文档顶部，这可能会导致不必要的滚动和页面跳转。
另外，当脚本标记没有href属性时，浏览器将忽略它。这意味着浏览器将不会缓存JavaScript文件，并且它还会阻塞页面的渲染，直到整个JavaScript文件下载和执行完毕。
正确的做法
正确的做法是在script标签中使用src属性来引入JavaScript文件。例如：
------- ---------------------------------
如果需要在script标签中编写JavaScript代码，可以将代码包装在一个单独的JavaScript文件中，并使用src属性来引用该文件。例如：
------- ---------------------------------
其中script.js包含以下内容：
-- ---------- ---- ----
这将确保浏览器会缓存JavaScript文件，并且不会发生不必要的页面跳转。
示例代码
以下是一个示例，演示了如何在script标签中使用src属性引用JavaScript文件：
--------- -----
------
------
------------- --- ------- ----------------
------- ---------------------------------
-------
------
---------- -----------
-------
-------其中script.js包含以下内容：
------------- ---------
这将在页面加载时弹出一个对话框，显示"Hello, world!"。
总结
在前端开发中，避免使用href="#"可以避免不必要的页面跳转和滚动。正确的做法是使用src属性引用JavaScript文件或将JavaScript代码封装在单独的JavaScript文件中，并使用src属性引用该文件。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/30521