1

私は jQuery と JavaScript の初心者なので、これは些細な質問のように思えるかもしれません。ここにある DOM Outliner コードを、作成した html ページで使用したいと考えています。

私のhtmlページのソースは次のとおりです

<!DOCTYPE html>
<html>
<head>
    <h3>Dom Outlining</h3>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>      
    <script src="jquery.dom-outline-1.0.js" type="text/javascript"></script>
    <script>
        $(document).ready(function() {
        var myExampleClickHandler = function (element) { console.log('Clicked element:', element); }
        var myDomOutline = DomOutline({ onClick: myExampleClickHandler });

        // Start outline:
        myDomOutline.start();

        // Stop outline (also stopped on escape/backspace/delete keys):
        myDomOutline.stop();
    });
    </script>
</head>
<body>
    <h1>My First Heading</h1>

    <p>My first paragraph.</p>
    <div class="first class">
        <p> This is a division.</p>
    </div>
</body>
</html>

ただし、これは必要に応じて要素を選択して強調表示していないようです。誰かが私のコードに何が欠けているか教えてもらえますか?

4

3 に答える 3

0
<html>
<head>
    <h3>Dom Outlining</h3>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>      
    <script src="jquery.dom-outline-1.0.js" type="text/javascript"></script>
    <script>
        $(function() {
            var myDomOutline = DomOutline({ 
                onClick: function (element) { 
                    console.log('Clicked element:', element); 
                }
            });

            $('#start').click(function(){
                myDomOutline.start();
            });

            $('#stop').click(function(){
                myDomOutline.stop();
            });
        });
    </script>
</head>
<body>
    <input id="start" type="button" value="Start outline"/>
    <input id="stop" type="button" value="Stop outline"/>

    <h1>My First Heading</h1>

    <p>My first paragraph.</p>
    <div class="first class">
        <p> This is a division.</p>
    </div>
</body>
</html>
于 2013-06-13T05:38:37.873 に答える