jQuery in Action
58
CHAPTER 3
Bringing pages to life with jQuery
WARNING
Disabling the submit button(s) in this way doesn't relieve the server-side
code from its responsibility to guard against double submission or any
other types of validation. Adding this type of feature to the client code
makes things nicer for the end user and helps prevent the double-submit
problem under normal circumstances. It doesn't protect against attacks
or other hacking attempts, and server-side code must continue to be on
its guard.
code from its responsibility to guard against double submission or any
other types of validation. Adding this type of feature to the client code
makes things nicer for the end user and helps prevent the double-submit
problem under normal circumstances. It doesn't protect against attacks
or other hacking attempts, and server-side code must continue to be on
its guard.
We mentioned the
className
property earlier in this section as an example of the
case where markup attribute names differ from property names; but, truth be
told, class names are a bit special in other respects and are handled as such by
jQuery. The next section will describe a better way to deal with class names than
by directly accessing the
told, class names are a bit special in other respects and are handled as such by
jQuery. The next section will describe a better way to deal with class names than
by directly accessing the
className
property or using the
attr()
command.
3.2 Changing element styling
If we want to change the styling of an element, we have two options. We can add
or remove a
or remove a
CSS
class, causing the existing stylesheet to restyle the element
based on its new classes. Or we can operate on the
DOM
element itself, applying
styles directly.
Let's look at how jQuery makes it simple to make changes to an element's
style classes.
3.2.1 Adding and removing class names
The class name attributes and properties of
DOM
elements are unique in their
format and semantics and are also important to the creation of rich user inter-
faces. The addition of class names to and removal of class names from an ele-
ment is one of the primary means by which their stylistic rendering can be
modified dynamically.
faces. The addition of class names to and removal of class names from an ele-
ment is one of the primary means by which their stylistic rendering can be
modified dynamically.
One of the aspects of element class names that make them unique--and a
challenge to deal with--is that each element can be assigned any number of class
names. In
names. In
HTML
, the
class
attribute is used to supply these names as a space-
delimited string. For example:
<div class="someClass anotherClass yetAnotherClass"></div>
Unfortunately, rather than manifesting themselves as an array of names in the
DOM
element's corresponding
className
property, the class names appear as the