jQuery has a simple but powerful model for its interactions. It always follows the same pattern depicted in Figure 145.
To instantiate a
JQueryClass you ask a factory object for a new instance by sending the message
jQuery. In most cases the factory object is your
WAHtmlCanvas, but it can also be a
html jQuery returns an instance of
To create a
JQueryInstance we specify a CSS selector that queries for certain DOM elements on the your web-page. For example, to select all HTML div tags with the CSS class
special one would write:
html jQuery expression: 'div.special'
This expression returns a
JQueryInstance object that represents all HTML tags matching the given CSS query
div.special. There is also a slightly shorter form that does exactly the same:
html jQuery: 'div.special'
You find more details on creating queries in Section 21.2.1.
If you browse the class
JQueryInstance, you will see that you can add more elements or filter out elements before applying the jQuery action. For example, to select the siblings of the currently selected elements you would write:
(html jQuery: 'div.special') siblings
You find more details on refining queries in Section 21.2.2.
Once you have identified the elements, you can specify the actions you wish to perform. These actions can delete, move, transform, animate or change the contents of the element. For example, to remove the elements we selected earlier we write:
(html jQuery: 'div.special') siblings; remove
There are over 180 actions provided by jQuery; these can be investigated by browsing the
JQueryInstance class in Smalltalk, and by visiting the jQuery documentation at http://api.jquery.com/.
You find more details on performing actions in Section 21.2.3.