узел исследователь сценария?

голоса
2

Я хотел бы, чтобы отобразить дерево DOM узла в браузере, с детьми складными. Я ищу довольно много той же функциональности, как вкладка Firebug, «HTML», только я хочу его в окне браузера, и я хочу, чтобы иметь возможность выбрать произвольный узел в качестве корня. Перед тем как я пишу это сам, я решил проверить, чтобы убедиться, что никто не может указать меня к уже написанным один.

Задан 19/05/2009 в 13:07
источник пользователем
На других языках...                            


2 ответов

голоса
1

Я бы проверить Firebug Lite, специальная версия FireBug реализованы все в Javascript так, чтобы можно было использовать на низших браузеров , как Internet Explorer: http://www.getfirebug.com/lite.html

Это почти то, что вы хотите (я думаю), и даже если это не должно быть достаточно близко, чтобы дать вам то, чтобы начать с.

Ответил 19/05/2009 в 22:48
источник пользователем

голоса
0

Рана до написания моей. Он использует JQuery (который я ссылаюсь ниже как $ JQ).

nodeExplorer = function(node, container){ // note: container must be a jquery object


    $jq(".nodeExplorerNode").live("click", function(){
        $jq(this).toggleClass("collapsed");
        return false;
    });

    if($jq("#nodeExplorerStyles").length == 0){

        $jq("body").append(
            "<style id='nodeExplorerStyles'>"+
                ".collapsed .nodeExplorerNode{"+
                    "display:none" +
                "}"+
                ".collapsed>.minus{"+
                    "display:none" +
                "}"+
                ".collapsed>.plus{"+
                    "display:inline" +
                "}"+
                ".plus{"+
                    "display:none" +
                "}"+
                ".nodeExplorerNode{"+
                    "cursor: pointer" +
                "}"+
            "</style>"
        )

    };

    var drawNodes = function(node, container){
        if(node.tagName){
            container = $jq("<div style='margin-left: 20px' class='collapsed nodeExplorerNode'><span class='minus'>- </span><span class='plus'>+ </span>"+ node.tagName +" </div>").appendTo(container);
        }else if(node.data){
            container.append("<b>" + node.data + "</b>");
        }
        for(var i=0; i< node.childNodes.length; i++){
            drawNodes(node.childNodes[i], container)    
        }
    }   

    drawNodes(node, container);

}
Ответил 21/05/2009 в 17:32
источник пользователем

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more