0

我一直在学习 js 对象的工作,所以我决定看看如果我尝试将 jQuery 对象分解成它的组件会发生什么。我想知道是否有更好、更精细的方法来做到这一点,或者是否有其他一些可能具有教育意义的技巧:

<!doctype html>
<html>

    <head>
        <meta charset="UTF-8">
        <title>JQuery Dump</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <style type="text/css">
            ol li {
                font-weight:bold
            }
            ol li ul {
                margin-bottom:0px
            }
            ol li ul li {
                display:inline-block;
            }
            ol li ul li {
                font-weight:normal;
                list-style:none;
                margin-right:8px;
            }
        </style>
    </head>

    <body>
        <ol>
            <script>
                var x = "";
                for(var i in jQuery) {
                    x += ("<li>" + i + "<ul>");
                    for(var j in jQuery[i]) {
                        x += ("<li><pre>" + j + "</pre></li>");
                    }
                    x += ("</ul></li>");
                }
                document.write(x);
            </script>
        </ol>
    </body>

</html>
4

3 回答 3

4

这是了解递归函数的绝佳机会。这是从 这个答案中提取的简洁示例,我已经对其进行了调整以更好地匹配您的问题(演示)。

<div id="Tree"></div>

使用以下 JavaScript:

var tree = $('#Tree');
function r(obj) {
    var html = "<ul>";
    if (obj)
        for (var key in obj) {
            if (typeof obj[key] == "object")
                html += '<li>'+key+':'+r(obj[key])+'</li>';
            else if (typeof obj[key] != "function")
                html +='<li>'+key+':'+obj[key]+'</li>';
            else
                html +='<li>'+key+'()</li>';
        }
    html += "</ul>";
    return html;
} 

$('#Tree').html(r(jQuery));

r(jQuery);
于 2013-03-26T06:52:11.933 回答
2

如果您只是想了解一下 jQuery 对象,您可以使用console.dir它与该对象进行交互。例如,打开您的控制台并输入console.dir($).

https://developer.mozilla.org/en-US/docs/DOM/console.dir

于 2013-03-26T06:53:06.883 回答
1

而不是编写上面的代码并在 html 页面上打印此代码,您应该简单地尝试console.dir($)查看您的控制台屏幕。

于 2013-03-26T09:50:37.560 回答