Question

我试图根据这个描述理解JSFiddle如何''包装''onLoad'中的代码： [1]：http://doc.jsfiddle.net/basic/introduction.html#javascript。我已经看到onLoad被用在HTML的BODY标签中来加载函数。那么JSF（幕后）将我在JS窗口中创建的每个调用和每个函数都包装起来吗？ AKA：

onLoad = "myfunc1(),myfunc2,alert(1);"

如果是这样，那么当我选择jQuery作为框架时，我应该避免使用这种格式：

 $(document).ready(function(){
     myfunc1{(...)}
     myfunc1{(...)}
     ...

如果出现电枢问题，请提前道歉。

Answer 1

他们将所有JS放在<script>标记内，其中包含onLoad个事件代码。

例如，如果您选择包含jQuery和onLoad，那么这就是jsfiddle将使用的：

<script type="text/javascript">
    //<![CDATA[
        $(window).load(function(){ /* your js here */ });
    //]]>
</script>

如果您不包含库，则他们使用：

<script type="text/javascript">
    //<![CDATA[
        window.onload=function(){ /* your js here */ }
    //]]>
</script>

我认为他们还会使用其他特定于库的load事件，具体取决于您选择包含的内容。

在小提琴中运行代码时，不需要使用$(document).ready(function(){ });。

注意：有关CDATA的详细解释，请查看此答案 - https://stackoverflow.com/a/7092306/2287470

Answer 2

它会生成一个新的iframe来运行您的代码。

对于onload，他们只需将所有代码放入

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

如果您检查右下方iframe的<script>中的<head>标记，就可以看到此内容。

使用$(document).ready(...没有错，但是当你在jsFiddle中启用onLoad选项时，它有点无用。

Answer 3

如果您正在寻找源代码格式，那么您应该寻找下面的网站。至于jsfiddle使用什么，他们可能有自己的插件，也可以这样做。

http://jsbeautifier.org/

http://www.javascriptbeautifier.com/

http://www.jspretty.com/

JSFiddle包装在onLoad中？

3 个答案: