Saturday, March 28, 2020

ஜெ கொரி (jquery) என்றால் என்ன?





இது ஒரு ஜாவாஸ்கிரிப்ட் லைப்ரரி ஃபைல் ஆகும். குறைவான கோடிங்கில் நிறைய செயல்கள் நிகழ்த்திட இது உதவுகின்றது.
இது மிகவும் வேகமானது.
இது ஒரு வெப் டெவெலப்பர் வேலையை எளிதாக்குகின்றது.
இது நிறைய லைப்ரரி ஃபைல்களை கொண்டுள்ளது.
இதன் அம்சங்கள்:
DOM SELECTION:
இது ஒரு ஃபார்ம் எலெமெண்டை அதன் பெயர்,டைப், கிளாஸ், பண்புகள் முதலியன கொண்டு செலெக்ட் செய்ய உதவுகின்றது.
DOM MANIPULATION:
இது ஒரு ஃபார்ம் எலிமென்டை மேனிபுலேட் செய்கின்றது. புதிதாக ஒரு எலிமெண்டை சேர்த்தல், விலக்குதல் முதலிய செயல்களை செய்யலாம்.
SPECIAL EFFECTS
ஃபேடிங்க், ஸ்லைட் டவுன் போன்ற அனிமேசன் எஃபக்ட் புரிய உதவுகின்றது.
EVENTS:
கிளிக், டபுள் கிளிக், மவுஸ் எண்டர், மவுஸ் லீவ் போன்ற ஈவண்டுகளை எளிதாக கையாளுகின்றது.
AJAX:
இது முழு பக்கத்தையும் ரிலோட் செய்யாமல் அஜாக்ஸ் மூலம் டேட்டா லோட் செய்கின்றது.
CROSS BROWSER SUPPORT:
ஒவ்வொரு பிரவுசருக்கும் ஒவ்வொரு கோடிங்க் எழுத வேண்டியதில்லை.


JQUERY ADVANTAGES:
கற்றல் எளிது.
குறைவான கோடிங்க்
அருமையான டாக்குமெண்டேசன்.
கிராஸ் பிரவுசர் சப்போர்ட்
டவுடன் லோட் செய்து உபயோக்கித்தல்.
இதை jquery.com என்ற இணைய தளத்தில் இருந்து டவுன் லோட்  செய்து நமது பக்கத்தில் மற்ற ஜாவா ஸ்கிரிப்ட் ஃபைல் போல் ரெஃபெரென்ஸ் செய்து கொள்ளலாம்.
Ie 6/7/8 சப்போர்ட் தேவை எனில் jquery1.x யையும் இல்லையெனில் jquery2.x-யும் பயன்படுத்தலாம்.
சான்று நிரல்.
கீழே உள்ள நிரலில் வழக்கமான ஜாவா ஸ்கிரிப்ட் நிரலாகும்.
ஒரு பட்டனின் கிளிக் செய்யும் பொழுது ஒரு டயலாக் பாக்ஸ் தோன்ற இவ்வளவு நீளமாக நிரல் எழுத வேண்டும்.
<script type="text/javascript">
    window.onload = function ()
    {
        // For all modern browsers
        if (document.addEventListener)
        {
            document.getElementById('button1')
                    .addEventListener('click', clickHandler, false);
        }
        else
        // For Internet Explorer < 9
        {
            document.getElementById('button1')
                    .attachEvent('onclick', clickHandler);
        }

        function clickHandler()
        {
            alert('jQuery Tutorial');
        }
    };
</script>
<input type="button" value="Click Me" id="button1" />

 Ie 9 ற்க்கு கீழ் உள்ள பிரவுசர்கள் addEventListener என்பதை ஆதரிப்பதில்லை எனவே if else உபயோகித்து நிரல் எழுத வேண்டும்.
இதையே jquery பயன்படுத்தி எழுத வேண்டும் என்றால் கீழே உள்ளது போதும்.
<script type="text/javascript">
    $('document').ready(function () {
        $('#button1').click(function () {
            alert('jQuery Tutorial');
        });
    });
</script>
<input type="button" value="Click Me" id="button1" />
குறிப்புகள்.
1.      ready() ஃபங்க்சன் ஆனது DOM முழுதாக லோட் ஆகிவிட்டதா என்பதை உறுதி செய்ய பயன்படுகின்றது.
2.      $ என்பது Jquery என்பதன் குறுக்கு வழி ஆகும்.
3.      கீழே உள்ள மூன்றுமே சரியான நிரல் வரிகள் ஆகும்.
$( document ).ready( handler )
$().ready( handler ) (this is not recommended)
$( handler )

நன்றி.
முத்து கார்த்திகேயன்,மதுரை.


ads Udanz

No comments:

Post a Comment