�ݺ�ߣ

jQuery 1.4
újdonságok
Bártházi András, Arkon Zrt.
belső oktatás

Újdonságok

2010. január 14 (1.4?), megjelent a jQuery 1.4-es
változata
http://jquery14.com/day-01/jquery-14

elég érdekes újdonságokat hoz, ezeket foglalja össze ez a
prezentáció

Sebesség

több metódus esetén jelentősen csökkent a meghívott
fü'vények száma, ezáltal a sebesség is:
.addClass, .removeClass, .css, .remove, .append, .html,
.empty, .ﬁnd, stb.

a .css és .attr metódusok sebessége nőtt

Setter metódusok
bővített setterek, avagy a .html, .attr, stb. szerű
metódusoknak fü'vényt is átadhatunk, s a korábbi
értéket is elérhetjük
// find all ampersands in A's and wrap with a span
$('a').html(function(i,html){
return html.replace(/&/gi,'<span class="amp">&</span>');
});

// Add some information to the title of the anchors
$('a[target]').attr("title", function(i,title){
return title + " (Opens in External Window)";
});

DOM elem létrehozás
Új DOM elemek létrehozása jelentősen egyszerűsödött:

jQuery("<div/>", {
id: "foo",
css: {
height: "50px",
width: "50px",
color: "blue",
backgroundColor: "#ccc"
},
click: function() {
$(this).css("backgroundColor", "red");
}
}).appendTo("body");

Kontextus átadás AJAX kéréseknél

AJAX kéréseknél beá*íthatunk egy kontextust, amire a
this kulcsszóval hivatkozni tudunk később (kevesebb
trükközés, tisztább kód)
jQuery.ajax({
url: "test.html",
context: document.body,
success: function(){
jQuery(this).addClass("done");
}
});

HTML5 input típusok támogatása

Form .serialize() esetén a datetime és range típusú input
elemek értéke is szerializálva lesz

Szigorú JSON kezelés, natív
JSON.parse támogatás

Az újabb böngészőkben (és az EcmaScript 5-ben
megjelent) elérhető natív JSON feldolgozást használja a
JSON.parse() metódus, ha létezik

Ha az AJAX lekérdezéskor a szervertől kért tartalom
“json” típusú, a .getJSON validálja is a visszakapott
tartalmat, védve a támadásoktól

Különböző animáció tulajdonságként

Különá*ó DOM tulajdonságokhoz tudunk eltérő
animációkat hozzárendelni könnyedén:

$("#clickme").click(function() {
$("div").animate({
width: ["+=200px", "swing"],
height: ["+=50px", "linear"],
}, 2000, function() {
$(this).after("<div>Animation complete.</div>");
});
});

.live() események

Egy adott eseményt hozzárendelhetünk úgy egy
kiválasztóhoz, hogy a későbbiekben létrejövő DOM
elemekre is érvényes legyen - mostantól az események
többségével működik ez a lehetőség

.queue() támogatás
Létrehozhatunk végrehajtási sorokat, átláthatóbbá téve
kódunkat amikor egyes fü'vényeket egymás után ke*
végrehajtanunk:
jQuery("div").queue("ajax", function(next) {
var self = this;
jQuery.getJSON("/update", function(json) {
$(self).html(json.text);
next();
};
}).queue("ajax", function() {
$(this).fadeIn();
});

Üres függvény

A jQuery.noop() fü'vény egy üres fü'vény, ha valahol
explicite át szeretnénk adni egy semmit sem csináló
fü'vényt, akkor egy új funciton(){} fü'vény létrehozása
helyett ezt is használhatjuk

YUI Min helyett Closure

Az eddig használt YUI Min tömörítés helyett a
minimalizált jQuery fájlok Closue-ral kerülnek
tömörítésre

További infók

Két további olvasnivaló:

http://jquery14.com/day-01/jquery-14

http://net.tutsplus.com/tutorials/javascript-ajax/
jquery-1-4-released-the-15-new-features-you-must-
know/

�ݺ�ߣ

jQuery 1.4 újdonságok

More Related Content

jQuery 1.4 újdonságok