!JQuery

2011.03.02. 07:24 stack

Azt tapasztaltam, hogy sokan csupán azért használják az ExtJS-t a JQuery könyvtárral, mert úgy gondolják, hogy azzal egyszerűbb a szelektorok használata, a CSS módosítás vagy éppen az animáció.
Pedig ezeknek mind létezik az ExtJS-es megfelelője:

DOM Basic + CSS:

$("#id, .class, div").addClass('blue');
Ext.select("#id, .class, div").addClass('blue');
$("input[type='text']").css('background', 'red');
Ext.select("input[type='text']").setStyle('background', 'red');

Effektek + Animáció:

$('#id').slideUp();
Ext.get('id').slideOut('t', {useDisplay: true});
$('#id').animate({opacity: 0.5, width: 20}, 1500, 'easeOutBounce');
Ext.get('id').shift({
    opacity: 0.5,
    width: 20,
    duration: 1.5,
    easing: 'bounceOut'
});

DOM manipuláció:

$('body').append('<b>Bold text...<\/b>');
Ext.getBody().createChild('<b>Bold text...<\/b>');
$('#id').html('...');
Ext.get('id').update('...');

Események:

$('#id').click(function () {
    $(this).css({background: 'red', color: 'blue'});
});
Ext.get('id').on('click', function () {
    this.applyStyles({background: 'red', color: 'blue'});
});

Ajax hívások:

$('#id').load('ajax.html');
Ext.get('id').load('ajax.html');
$.ajax({
    url: 'ajax.html',
    context: this,
    success: function (req) {
        alert(req);
    }
});
Ext.Ajax.request({
    url: 'ajax.html',
    scope: this,
    success: function (req) {
        alert(req.responseText)
    }
});

DOM Ready:

$(document).ready(function () { /* ... */ });
Ext.onReady(function () { /* ... */ });

Parse JSON:

$.parseJSON('{"a":1}');
Ext.decode('{"a":1}');

is IE:

$.browser.msie
Ext.isIE

foreach:

var list = ['a', 'b', 'c'];
$.each(list, function (index, item) { /* ... */ });
Ext.each(list, function (item, index) { /* ... */ });

XY:

$('#foo').offset();     // {left=50, top=100}
Ext.get('foo').getXY(); // [50, 100]

empty function:

$.noop();
Ext.emptyFn();

get version:

$().jquery
Ext.version

Szólj hozzá!

Címkék: element jquery animate

A bejegyzés trackback címe:

https://extjs.blog.hu/api/trackback/id/tr682703240

Kommentek:

A hozzászólások a vonatkozó jogszabályok  értelmében felhasználói tartalomnak minősülnek, értük a szolgáltatás technikai  üzemeltetője semmilyen felelősséget nem vállal, azokat nem ellenőrzi. Kifogás esetén forduljon a blog szerkesztőjéhez. Részletek a  Felhasználási feltételekben és az adatvédelmi tájékoztatóban.

Nincsenek hozzászólások.

ExtJS blog, mi ez?

Az ExtJS egy JavaScript keretrendszer, melyet a blog írója elfogultan a legjobbnak tart, és ez a blog olyan apróságok gyűjteménye, melyek ExtJS használata közben felmerültek, eszébe jutottak...

Címkék

ajax (4) alignto (1) állás (3) analytics (1) anchorto (1) android (4) animate (2) array (9) auto (1) back button (1) beautifier (1) beforeevent (1) benchmark (1) blur (1) budapest.js (1) button (1) canvas (1) capture (1) case sensitive (1) center (1) change (1) cikkajánló (1) class (2) closure compiler (1) collapse (1) combobox (3) comment (1) console.log (2) contextmenu (2) core (2) count (1) css (15) csv (1) dataview (1) date (4) datefield (3) datepicker (1) debug (1) doksi (1) dragdrop (1) easing (1) eclipse (1) editor (1) element (5) error (5) eval (2) event (1) fejtörő (1) field (2) fieldset (1) filter (1) firefox (4) firefox extension (2) focus (3) fonts (1) fun (1) function (1) google (2) google chrome (1) grayscale (1) grid (4) group contact (1) header (3) height (2) hidden (1) hirek (2) history (1) htaccess (1) html5 (2) htmleditor (2) https (1) icon (3) id (2) ie (2) ie6 (1) ie9 (1) iframe (3) image (2) indexof (1) javascript (1) jquery (2) jslint (2) jsmin (1) json (7) keymap (1) kipróbálom (2) könyvajánló (2) label (1) layout (1) lint (1) log (1) loop (1) magyar (2) mandelbrot (1) mask (1) math (1) maxlength (1) mistake (1) mysql (5) napi szívás (16) nem extjs (12) node (1) nth child (1) number (1) off (5) offline (1) operator (1) override (20) pagesize (1) paging (2) panel (2) php (7) picker (1) plugin (3) pozicionálás (2) preload (1) print (1) propertygrid (1) pseudo (3) readonly (2) record (1) regexp (1) replace (1) resizable (1) rotate (1) round (1) scale (1) sencha touch (2) server (1) shuffle (1) slider (1) sort (3) sortable (1) store (2) string (7) sum (1) tabchange (1) tabpanel (1) tab key (2) tdd (1) template (1) textarea (2) textfield (1) textitem (1) theme (2) throw (1) timer (1) timestamp (1) title (2) toggle (1) toolbar (6) tools (1) total count (1) transparent (1) tree (1) treenode (1) trigger (1) truncate (1) try (1) ucfirst (1) undefined (2) unique (1) unload (1) urlencode (1) utf8 (2) verzió (1) video (1) viewer (1) viewport (2) visible (2) vtype (1) window (2) xtype (1) zindex (2)

Extjs.blog.hu - RSS

Kérdés?

süti beállítások módosítása