Manipulating Content, Attributes, and Custom Data - Appendices - Web Development with jQuery (2015)

Web Development with jQuery (2015)

Part IV. Appendices

Appendix E. Manipulating Content, Attributes, and Custom Data

Method/Property

Description

Return Value

Attributes

attr(name)

Returns the attribute value for the specified attribute from the first element present in a selection. If no element is present, the method returns undefined.

String,
Undefined

attr(object)

Allows you to set attributes via the specification of key, value pairs. For example:
attr({
id : 'idName',
href : '/example.html',
title : 'Tooltip text.'
});

jQuery

attr(key, value)

Allows you to specify an attribute by providing the name of the attribute in the key argument and its value in the value argument.

jQuery

attr(key, function)

Sets an attribute's value depending on the return value of the callback function that you specify. The callback function is executed within the context of each selected element, where each selected element can be accessed within the function via this.

jQuery

removeAttr(name)

Removes the specified attribute from the element(s).

jQuery

Class Names

addClass(className)

Adds the specified class name to each selected element. Elements can have one or more class names.

jQuery

addClass(function())

Adds one or more space separated class names returned from a callback function.

jQuery

hasClass(className)

Returns true if the specified class name is present on at least one of the selected elements.

Boolean

removeClass([className])

Removes the specified class name from each selected element. If multiple class names are provided, each is separated by a single space.

jQuery

removeClass(function())

Removes the specified class name from each selected element by executing a callback function to determine whether the class should be removed. The function should return one or more class names to be removed. If multiple class names are removed, they should be separated by a single space.

jQuery

toggleClass(className[, switch])

Adds the specified class name if it is not present, and removes the specified class name if it is present.
If the switch argument is provided, it explicitly tells toggleClass() whether the class name should be added or removed. true adds the class, and false removes it.

jQuery

toggleClass([switch])

switch explicitly tells toggleClass() whether the class name should be added or removed. true adds the class, and false removes it.

jQuery

toggleClass(function()[, switch])

If a function is provided, it returns one or more space separated class names to be toggled.
If the switch argument is provided, it explicitly tells toggleClass() whether the class name should be added or removed. true adds the class, and false removes it.

jQuery

HTML

html()

Returns the HTML contents, or innerHTML, of the first element of the selection. This method does not work on XML documents but does work on XHTML documents.

String

html(htmlString)

Sets the HTML contents of every selected element.

jQuery

html(function())

If a function is provided, it returns the HTML content to set for each selected element.
As with most jQuery callback functions, this refers to the current element within the callback function, and the callback function is provided the argument list: offset, oldHTML.

jQuery

Text

text()

Returns the text content of each selected element.

String

text(value)

Sets the text content of each selected element. HTML source code will not be rendered.

jQuery

text(function())

If a function is provided, it returns the text content to set for each selected element.
As with most jQuery callback functions, this refers to the current element within the callback function, and the callback function is provided the argument list: offset, oldText.

jQuery

Value

val()

Returns the contents of the value attribute for the first element of the selection. For <select> elements with attribute multiple="multiple", an array of selected values is returned.

String,
Number,
Array

val(value)

When providing a single value, this method sets the contents of the value attribute for each selected element.

jQuery

val(valuesArray)

When providing multiple values, this method checks or selects radio buttons, check boxes, or select options that match the set of values.

jQuery

val(function())

If a function is provided, it returns the content to set as the value for each selected element.
As with most jQuery callback functions, this refers to the current element within the callback function, and the callback function is provided the argument list: offset, oldValue.

jQuery

Custom Data Attributes

data()

Returns all custom data attributes set on the selected element(s) as a simple object.

Object

data(object)

Sets custom data on all selected elements, where the key portion is used to name the data, and the corresponding value sets the value of that attribute.

jQuery

data(key)

Returns data stored for an element by the specified name for the selected elements.

Mixed

data(key, value)

Stores data with the specified name and value for each selected element(s).

jQuery

$.data(element, key, value)

Associates data by the specified name with the specified value with the specified DOM element object reference.

Object

removeData([name])

Removes the data by the specified name from the selected elements. If no name is specified then all data is removed.

jQuery

removeData([list])

Removes data by specifying an array of data names to remove, or a space-separated list of data names to remove. If no list is provided, all data is removed.

jQuery

$.removeData(element[, name])

Removes data from the specified DOM element object reference going by the specified name.

jQuery