This project is read-only.

Working with jQuery

From v1.0.3, from.js now provides jQuery plugin. You can switch jQuery chain to LINQ chain by calling from() method.

<html>
    <head>
        <script src="jquery.js"></script>
        <script src="from.js"></script>
    </head>
    <body>
        <div class="class1"></div>
        <span class="class1"></span>
        <span class="class1"></span>
        <a class="class1">link</a>
        <input type="hidden" />
        <script>
            $(".class1")
                .from().groupBy("$tagName")
                    .each("alert('Tag <' + $$ + '> is using class1')");

            // Tag <DIV> is using class1
            // Tag <SPAN> is using class1
            // Tag <A> is using class1
        </script>
    </body>
</html>

Reversely, you can switch LINQ chain to jQuery chain using jQuery() method. Following example changes the background color of every other square.

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
        <script src="from.js"></script>
        <style>
            .blacksquare
            {
                display: inline-block;
                width: 100px;
                height: 100px;
                background-color: black;
            }
        </style>
    </head>
    <body style="height: 100%">
        <div class="blacksquare"></div>
        <div class="blacksquare"></div>
        <div class="blacksquare"></div>
        <div class="blacksquare"></div>
        <div class="blacksquare"></div>
        <div class="blacksquare"></div>
        <div class="blacksquare"></div>
        <div class="blacksquare"></div>
        <script>
            function randomColor() {
                return $range(6).aggregateSeed("#",
                    "total => total + '0123456789ABCDEF'.charAt(Math.floor(Math.random()*16))");
            }

            $("div.blacksquare")
                .from().where("$$ % 2 == 0")
                .jQuery().css("background-color", randomColor());
        </script>
    </body>
</html>

Last edited Nov 6, 2012 at 6:57 AM by suckgamoni, version 18

Comments

No comments yet.