Difference between revisions of "JQuery"

From Organic Design wiki
(Document.ready may slow load time in the case of load() and ajax())
(See also: basically what this is saying is document.ready may slow you down if you do other important jQuery stuff before document.ready - which you shouldn't do)
Line 82: Line 82:
 
*[[The Module pattern]]
 
*[[The Module pattern]]
 
*[http://encosia.com/dont-let-jquerys-document-ready-slow-you-down/ Document.ready may slow load time in the case of load() and ajax()]
 
*[http://encosia.com/dont-let-jquerys-document-ready-slow-you-down/ Document.ready may slow load time in the case of load() and ajax()]
 +
:''basically what this is saying is document.ready may slow you down if you do other important jQuery stuff before document.ready - which you shouldn't do --[[User:Nad|nad]] 14:13, 17 February 2012 (PST)''
 
[[Category:Software]]
 
[[Category:Software]]

Revision as of 22:13, 17 February 2012

Supported CSS Selector expressions.

  • * any element
  • E an element of type E
  • E:nth-child(n) an E element, the n-th child of its parent
  • E:first-child an E element, first child of its parent
  • E:last-child an E element, last child of its parent
  • E:only-child an E element, only child of its parent
  • E:empty an E element that has no children (including text nodes)
  • E:enabled a user interface element E which is not disabled
  • E:disabled a user interface element E which is disabled
  • E:checked a user interface element E which is checked (for instance a radio-button or checkbox)
  • E:selected a user interface element E which is selected (one or more option elements inside a select) - not in the CSS spec, but nonetheless supported by jQuery
  • E.warning an E element whose class is "warning"
  • E#myid an E element with ID equal to "myid". (Will only match, at most, one element.)
  • E:not(s) an E element that does not match simple selector s
  • E F an F element descendant of an E element
  • E > F an F element child of an E element
  • E + F an F element immediately preceded by an E element
  • E ~ F an F element preceded by an E element
  • E,F,G select all E elements, F elements, and G elements


Using CSS and XPath Together

Hide all Paragraph elements that contain a class attribute:

$("p[@class]").hide();

Show the first paragraph on the page:

$("p:eq(0)").show();

Hide all divs that are currently showing:

$("div:visible").hide();

Get all list items that are children of an unordered list:

$("ul/li")
/* valid too: $("ul > li") */

Get all Paragraphs, with a class of 'foo', that have a link in them:

$("p.foo[a]");

Get list item that contains link with "Register" text inside:

$("li[a:contains('Register')]");

Get the input field's value with the name of 'bar':

$("input[@name=bar]").val();

All checked radio buttons:

$("input[@type=radio][@checked]")

Other libraries powered by jQuery

jKey

jFormer - jQuery Form Framework

jFormer is a form framework written on top of jQuery that allows you to quickly generate beautiful, standards compliant forms. Leveraging the latest techniques in web design, jFormer helps you create web forms that:

  • Validate client-side
  • Validate server-side
  • Process without changing pages (using AJAX)

CorMVC - jQuery-powered Model-View-Controller Framework

CorMVC is a jQuery-powered Model-View-Controller (MVC) framework that can aide in the development of single-page, web-based applications. CorMVC stands for client-only-required model-view-controller and is designed to be lowest possible entry point to learning about single-page application architecture. It does not presuppose any server-side technologies, or a web server of any kind, and requires no more than a web browser to get up and running.

It evolved out of the author's (Ben Nadel) recent presentation, Building Single-Page Applications Using jQuery And ColdFusion, and will continue to evolve as he thinks more deeply about this type of application architecture.

We're building an experimental nodal interface to make a start on the unified ontology using corMVC.

Features
  • A large sample application: The whole demo site (including the contacts section) runs off of corMVC as a single-page application.
  • No server required: The demo application does not require any additional server-side technologies. If you have a web browser, you can download and run this application immediately.
  • No building required: This framework does not require you to build the application using scaffolding or any other command-line executables. You just download it and open it up in a browser.
  • Small Framework: This framework is very small (and excessively commented). It doesn't do anything more than it is supposed to.

See also

basically what this is saying is document.ready may slow you down if you do other important jQuery stuff before document.ready - which you shouldn't do --nad 14:13, 17 February 2012 (PST)