A InfoWiki wikiből

jQuery

CGI és Űrlap feldolgozás

Hernyák Zoltán

Előadás

Vizsga

Fóliák

Gyakorlat

jQuery behívása a lapra

<!-- ha helyi masolatunk van -->
  <script type="text/javascript" src="jquery.js"></script>
 
  <!-- ha eredeti forrast hasznalunk van -->
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>

DOM elem kiválasztása

• Egyetlen elem (id alapján kiválasztása):

$('#aziderteke')

• egyetlen p elem, amelynek id-je az alábbi:

$('p#myid')

• összes adott tag kiválasztása

$('div')

• összes adott class névvel rendelkező elem kiválasztása

$('.myclass')   <- class="myclass"
 $('p.myclass')  <-  <p class="myclass"
 $('.myclass.otherclass')  <- <div class="myclass"> <span class="otherclass">

• adott konténerben lévő p elemek

$('#container p') <- <div id="container"> <p>...</p>
 $('a img')        <- <a ...><img .../></a>

• E > F viszony: keressük azokat az F-eket, akik E-n belül vannak.

$('div > ul')   <- azon ul amelyek div-ben vannak

• E + F viszony: keressük azokat az F-eket, amelyek az E-n belül jönnek azonnal

$('ul + p')    <- olyan p-k, amelyek egy ul utan vannak azonnal

• minden elem

$('*')
 $('p > *')     <- minden, p-n belüli elem

Document onload event

$(document).ready(
  function() 
  {
  // ...
  }
 );

Ajax egyszerűen

Egy elem tartalmának betöltése AJAX-ból:

 $('#mydiv').load(this.href);

Manupiláció

• Attribútum érték megváltoztatása

$elem.attr('id', chapterId)