为什么我的 JSFiddle 代码不能在我自己的网站上运行？

JSFiddle 代码在自己的页面中无法工作：JavaScript 执行故障排除

您遇到了一个问题，即在 JSFiddle 中正常运行的代码在以下情况下会出现故障：合并到您自己的网页中。为了解决这个令人困惑的问题，让我们深入研究一下根本原因。

罪魁祸首在于 JavaScript 代码的放置位置。在 JSFiddle 中，它嵌入在 onload 处理程序中，确保它在整个页面加载后执行。但是，当您直接将代码包含在头部链接的 HTML/JS 和 CSS 文件中时，它会过早执行。

此时，输入元素尚未解析，导致 $('input [type="range"]') 不会产生任何结果。为了解决这个问题，您的代码需要在处理完所有页面元素后运行。

解决方案：Onload Handler 或 Document Ready Handler

要实现此目的，您可以包装您在 onload 处理程序中的代码：

window.onload = function() {
    // your code here
};

或者，使用 jQuery 的文档准备handler:

$(document).ready(function() {
    // your code here
});

或者在页面末尾包含脚本

另一个选项是在页面末尾包含脚本，这保证它在之后执行所有元素都已

结论

通过解决此问题，您将确保 JavaScript 代码在 JSFiddle 和您自己的网页中表现一致。请记住考虑 JavaScript 代码的执行时间，以避免将来出现类似的陷阱。

以上是为什么我的 JSFiddle 代码不能在我自己的网站上运行？的详细内容。更多信息请关注PHP中文网其他相关文章！