A day with .Net

My day to day experince in .net

Jquery Reference Part2

Posted by vivekcek on December 25, 2012

1. Each function in jquery.

The below function take all the div’s with specified classes and iterate through them.

$('div.BlueDiv,div.RedDiv').each(function (index) {
alert(index + '=' + $(this).text());
});

2. Modify attribute of a div by raw DOM object and Jquery wrapped object.

$('div').each(function (i) {
this.title = "hai"; //raw dom object not jquery object so no intellisense
$(this).attr('title', 'title2'); //jquery objcet wrpped with $ with intellisense
            });

3. Set font size of all div.

 $('div').css('font-size', '20px'); //automatic iteration

4. JSON Map and Chaining with jquery

 $('div').attr(
                    {
                        title: 'titile 4',
                        style: 'font-size:40px;background-color:yellow'  //JSON MAP
                    }
                )
            .css('color', 'Red'); //Chaining

5.Append table to a div.

$('#OutPutDiv').append('<table><tr><td style="font-size:50px">AppendChild</td></tr></table>');

6. wrap a div.

$('#OutOutDiv').wrap('<div style="font-size:40px"></div>'); //wraps outputdiv inside wrap

7. Remove div.

$('#OutOutDiv').remove();

8. addClass,hasClass,removeClass,JSON map Css

 $('#OutPutDiv').css({
                'background-color': 'Navy',
                'color':'White'
            });

            $('#TestDiv').addClass('HighLight');
            $('div').removeClass('class1 class2');
            if ($('#TestDiv').hasClass('HighLight'))
            {}
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s