Асинхронный обход дерева DOM с помощью jQuery

Question

Я хотел бы выполнить длительное обход DOM между узлами, вызывая функцию на каждом узле, но не заставляя браузер не отвечать на запросы.Поэтому я думаю, что асинхронный способ - это путь.

Я думаю, что отложенные объекты jQuery могли бы обеспечить решение, но мне пока не удалось найти его.

Может кто-нибудь датьпример того, как вы могли бы сделать это с jQuery (или другой библиотекой, если она особенно подходит, или с чистыми методами Javascript и DOM).

Чтобы еще больше усложнить ситуацию, я хотел бы иметь возможность проходить вразные заказы, например, почтовый перевод, но пока не требуется.

Answer 1

Вы можете сделать это рекурсивно с установленным таймаутом. Поскольку javascript является однопоточным, вы создаете иллюзию наличия нескольких потоков, периодически отказываясь от потока. Вызов setTimeout поставит в очередь оставшуюся работу и обработает все ожидающие события, прежде чем продолжить.

Ваш код может выглядеть примерно так ...

function processNode(node) {
    // Do whatever it is you want to do on the node
    node.myMethod();
    var nextNode = null;
    // Assume depth first
    if (node.children().length)
        nextNode = node.children().first();
    else if (node.next())
        nextNode = node.next();
    else
    {
        var parent = node.parent();
        while(parent && !parent.next())
           parent = parent.parent();
        if (!parent)
            nextNode = parent.next();
    }
    if (nextNode)
        setTimeout(function(){processNode(nextNode);}, 200);
}

Answer 2

Вы можете проверить этот подход

https://gist.github.com/stelf/4b6935071447724c7066

основано на библиотеке Q Криса Ковала. По сути, похож на идею SynXsiS, но немного более структурирован с точки зрения объектов Promises / Deffered.

Answer 3

Вы могли бы взглянуть на https://github.com/wilsonpage/fastdom/, который делает именно это, асинхронные операции в дом.

Answer 4

Если вы можете использовать HTML5, некоторые браузеры поддерживают веб-работников.https://developer.mozilla.org/En/Using_web_workers Это может быть вариант.Возможно, вы сможете передать DOM как документ методам и перейти оттуда.