尝试将 jQuery 插件转换为纯 javascript

Question

我有一个 jQuery 插件，我想将其转换为纯 javascript，这样我就可以放弃对 jQuery 的依赖。我坚持使用的插件部分是这一点，returns DOM 元素按深度排序（例如 body 的 children，然后是 grandchildren，然后 great-grand-children, 等等等等)

var first = $('body'),
output = [];
while(first.length != 0) {
  output = $.merge(output, first);
  first = first.children();
}

基本上，我只需要 $('body')、$.merge 和 children() 的纯 javascript 版本来帮助我。

如有任何帮助，我们将不胜感激

Answer 1

好吧，我自己想通了，最后还是挺简单的。

    // Every Element in the DOM.

var allElements = document.getElementsByTagName('*'),

    // All the Element's children sorted by depth, 
    // ie. body, then body's children, grandchildren,
    // so on and so forth.

    sortedByDepth = [];

    // for every element

for(var i = 0; i<allElements.length; ++i) {

    // grab Its children

    var allChildren = allElements[i].children;

    // for every grabbed child

    for(var j = 0; j<allChildren.length; ++j){

        // Add it to the sortedByDepth array

        sortedByDepth = sortedByDepth.concat(allChildren[j]);
    }   
}
console.log(sortedByDepth);

尝试将 jQuery 插件转换为纯 javascript

Trying to convert a jQuery plugin to pure javascript

javascript

jquery

html

dom