Question

好吧，我有这个空白的对象数组。我动态地找到网页中的每个节点，每个节点都将拥有自己的对象和属性。我需要一种方法将我需要的值抛出到它们各自的对象属性

中

因此，例如，我找到了body节点。我现在有一个特殊的小对象用于此节点。我需要将关于这个小家伙的所有内容扔进他对象的属性中。

所以我非常需要它像这样呈现：

转过来：

<html>
    <body style="margin:0; padding:0;" title="My Title">
        <p>some text</p>
        <div class="wrapper"></div>
        <footer></footer>
    </body>
</html>

进入这个：

this.nodesInfo = [ // All nodes in the page's DOM
    {
        type: 'body', // ex: body, section, aside, div, etc.
        id: 'myID', // the Id of that element
        class: ['myClass1', 'myClass2'], // the class/class' of that element
        depth: '2', // the level in the page's DOM in which that element sits, this will be an integer
        parent: 'html', // that elements direct parent Node 
        children:['div.wrapper', 'p', 'footer'], // any child Nodes that, that element may be a parent to
        text: '', // the text inside that element if any exists
        attributes: ["style=margin:0; padding:0;", "title='My Title'"] // all attributes of this node
    }
];

它当然会遍历它发现的每个节点，并相应地为每个节点执行此操作，直到节点用完为止。

类，子元素和属性属性是可以使用任何这些元素的倍数的简单数组。其他所有内容都只是一个字符串，因为节点不能有多个ID，标题或直接父标记。

如果某个节点不包含其中某些属性，则该属性将保持为空/空/未定义。

我的问题很简单。这是否可能，如果不是，我是否必须单独创建每个对象并将它们推入我的nodesInfo数组？

我认为最简单的方法是制作每个Node的一个对象，然后将它们全部（一旦创建完全）推送到一个数组中。

Answer 1

那天晚上我正在建造这样的东西。这应该工作，你可以轻松添加更多的东西。 http://jsfiddle.net/elclanrs/UHbMa/

$.fn.buildTree = function() {
    var tree = {};
    this.find('*').andSelf().each(function(i, v) {
        var parents = $(this).parents().length - 1,
            depth = 0;
        while (depth < parents) {
            depth++;
        }
        tree[v.tagName.toLowerCase() + '(' + i + ')'] = {
            id: (v.id) ? '#' + v.id : '',
            className: (v.className) ? '.' + v.className.replace(' ', '.') : '',
            depth: depth
        };
    });
    return tree;
};


// Then you can do this...

var tree = $('#element').buildTree();
for (var tag in tree) {
    // Get your variables
    var tag.match(/\w+/), // Get rid of `(n)`
        id = tree[tag].id,
        className = tree[tag].className,
        depth = tree[tag].depth;
    html = 'something'; 

    // Bla bla
}

将数据推送到对象数组中

1 个答案: