将数组传递给 JavaScript 回调

Question

我对 jQuery 非常熟悉，但正如你们大多数人所知，jQuery 和 vanilla javascript 之间有很大的不同。我正在尝试更深入地了解 vanilla javascript，并且我有一些代码和一些问题。

在下面的代码中，我尝试从 Writeboard.com（已停用 http://37signals.com/writeboard-retired）获取通过导出功能生成的 HTML。基本上，我正在尝试进行一些有用的练习并编写一个可以找到特定内容的脚本，例如<li>//Title:...</li> 并将其推送到 JSON 数组中，然后我将其解析为 XML。最终目标是将所有这些都作为 XML 获取，以便它更便携（既远离传统的 Writeboard.com 板，也可以直接导入到我正在开发的 Web 应用程序中）。

所以，我还有很长的路要走，我并不是在寻找任何人为我编写代码，但我正在努力思考一些事情：

• 尝试创建一个名为TargetList 的回调，它允许用户按如下方式传递一个数组，以告诉脚本特殊的“键”（值），然后搜索该“键”（值）。父 <li> 将提取其内容并将其保存到 JSON 数组中，以便可以放弃包含 <li> 的元素，而可以将其包装为 XML 属性（例如 <title>）。

• 我对在 JS 中设置数组的正确语法的理解是 var targetList = []; 创建一个空数组，然后我可以稍后在循环搜索、查找和保存脚本的各个方面时填充该数组。我想我设置错了，我不知道为什么。

  • 我也很困惑为什么我不能在脚本后面调用convertToXML(['//Title:','//Prerequisite:','//Description:']); 函数，我在这方面遇到了错误，不知道为什么。我得到的错误导致我假设我没有正确设置目标，所以我只是通过将函数包装在 document.ready 中来创建一个目标，我意识到在稍后在脚本中调用早期函数时这是不必要的，尽管我不知道为什么我遇到了困难。

我意识到其中一些与我仍在学习的 OOP 原则有关，对我温柔一点，我希望有人能向我解释为什么我会出错。我将非常感激！

( function ($) { // wrap jQuery to prevent conflicts

    $(document).ready(function () {

        function convertToXML (targetList) {

            var targetList = [];

            var i = 0; 
            while (i<=targetList.length) {
                var target = targetList[i];
                targetList.push( target );              
                i++;
            };
        };

        $(document).ready(function() {
            convertToXML(['Title:','Prerequisite:','Cost:','Description:','Effect:','Categories:' ]);
        });     


    }); // end document.ready

} ) ( jQuery );

Answer 1

我可以回答您的第二个问题，但您需要详细说明您的第一个问题。

您不能在页面后面调用convertToXML 的原因是您已将其包装在范围内。 （其实是一分为二）

function($) {
    // creates an anonymous function which takes one parameter (named $)
}

(function($) {
    // creates an anonymous function which takes one parameter,
    // and immediately calls it, passing the variable named jQuery to the parameter named $
})(jQuery);

这是一种使用 jQuery 来克服其他库有时会接管特殊 $ 变量名的问题的常见模式。但重要的是要了解您在该匿名方法内部定义的任何内容都不能从该方法外部访问。因此，如果您想从外部访问您的 convertToXML 方法，则需要将其定义移到该块之外。

另外：

$(document).ready(function () {
    // create an anonymous function, and pass it to jQuery's document.ready method,
    // jQuery will call your function when the DOM is loaded.
});

您已经这样做了两次......我很确定第二个不会被调用，因为它在第一个内部，当加载 DOM 时会调用它，并且 DOM 只加载一次。删除其中之一。