<?xml version='1.0' encoding='utf-8'?>
<!DOCTYPE html PUBLIC '-//W3C/DTD XHTML+Voice 1.2 /EN' 'http://www.voicexml.org/specs/multimodal/x+v/12/dtd/xhtml+voice12.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:ev='http://www.w3.org/2001/xml-events'>
<head>
<link rel='stylesheet' href='http://pabi3.com/modules/items/voice.css' type='text/css' media='all' />
<form xmlns='http://www.w3.org/2001/vxml' id='title'>
<block>
The article jQuery - piste menej, urobte viac is written by PaBi3
</block>
</form>
<form xmlns='http://www.w3.org/2001/vxml' id='body'>
<block>


jQuery je kniznica napisana v JavaScripte umoznujuca tvorbu animacii, pohodlnu pracu s events atd. Cely zdrojovy kod ma po kompresii 19kB. Pritomna je aj podpora pluginov, takze uz nebudete musiet pisat dlhe zdrojaky, ak budete chciet vytvorit slideshow, popupwindow, treeview, tooltips, tabs, sliding menu, ajaxUpload a stovky dalsich veci. jQuery je vydavany pod licenciami GPL alebo MIT.
Pouzitie je velmi jednoduche a pochopi ho kazdy, kto ma minimalne znalosti JavaScriptu a CSS.



Aj napriek stupajucemu priemeru IE7 ma drviva vacsina ludi este stale nainstalovany IE6, ktory nepodporuje niektore pseudo triedy v CSS. O napravu sa jQuery dokaze velmi rychlo postarat. Zoberme si napriklad [http^=...]. Pouziva sa najma na externe odkazy. Cez jQuery sa da nahradit tato pseudo trieda jedinym riadkom (pokial neratam celu kniznicu).
</block>
</form>
<form xmlns='http://www.w3.org/2001/vxml' id='full'>
<block>
Externe odkazy cez jQuery
&lt;?xml version=&#039;1.0&#039; encoding=&#039;utf-8&#039;?&gt;
&lt;!DOCTYPE html PUBLIC &#039;-//W3C//DTD XHTML 1.1//EN&#039; &#039;http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd&#039;&gt;
&lt;html xmlns=&#039;http://www.w3.org/1999/xhtml&#039; xml:lang=&#039;sk&#039;&gt;
&lt;head&gt;
&lt;meta http-equiv=&#039;Content-Type&#039; content=&#039;application/xhtml+xml; charset=utf-8&#039; /&gt;
&lt;script type=&#039;text/javascript&#039; src=&#039;jquery.js&#039;&gt;&lt;/script&gt;
&lt;script type=&#039;text/javascript&#039;&gt;
//&lt;![CDATA[
$(document).ready(function()
{
  $(&quot;a[@href^=http://]&quot;).addClass(&#039;extern&#039;);
  $(&quot;a[@href^=&quot; + window.location.protocol + &quot;//&quot; + window.location.hostname + &quot;]&quot;).removeClass(&#039;extern&#039;);
});
//]]&gt;
&lt;/script&gt;
&lt;style type=&#039;text/css&#039;&gt;
/*&lt;![CDATA[*/
.extern { background:yellow; }
/*]]&gt;*/
&lt;/style&gt;
&lt;title&gt;jQuery Libary&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;div&gt;
Externy odkaz: &lt;a href=&#039;http://google.com/&#039;&gt;external link&lt;/a&gt;
&amp;middot;
Interny odkaz: &lt;a href=&#039;locallink.xhtml&#039;&gt;internal link&lt;/a&gt;
&lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;


Uvedeny priklad zobrazi externe odkazy zltou farbou a interne odkazy ponecha nedotknute. Cela syntax jQuery sa velmi podoba CSS.



jQuery podporuje aj AJAX requesty cez GET a POST metody. Napisal som maly priklad ako ulozit maximalne 25 znakov dlhy retazec do suboru. Mozete si ho stiahnut alebo prezriet jeho zdrojovy kod. Subor test.php, na ktory sa odosiela request je len PHP skript, ktory ulozi retazec z premennej $_POST['text'] do suboru test.txt.
</block>
</form>
<base href='http://pabi3.com/' />
<title>jQuery - píšte menej, urobte viac</title>
</head>
<body ev:event='load' ev:handler='#title'>
<a href='http://pabi3.com/blog/jquery-piste-menej-urobte-viac/' title='Návrat'>Návrat</a>
<h1 style='padding:0.5em;'>jQuery - píšte menej, urobte viac</h1>
<ul>
<li ev:event='click' ev:handler='#body'>Speak introduction</li>
<li ev:event='click' ev:handler='#full'>Speak full</li>
</ul>
</body>
</html>
