Tutorial

❮ Previous Next ❯

Get Material and Characteristics with jQuery

jQuery has a number of useful methods for modifying and altering Html code and character traits.

Manipulation of the DOM with jQuery

The ability to manipulate the DOM is a critical feature of jQuery.

A number of DOM-related methods are included in jQuery, making it simple to availability and exploit components and characteristics.

DOM stands for Document Object Model.

The DOM establishes a standard for interacting with HTML and XML files, which is as follows:

" DOM (Document Object Model) is a platform- and language-independent platform that enables programmes and scripts to interactively access and update a report's content, structure, and style."

Text(), html(), and val() are methods for obtaining content ()

The following are three simple but useful jQuery DOM exploitation strategies:

text() - Sets or returns the text content of the elements specified.

html() - Sets or returns the content of the elements specified (including HTML markup)

val() - This function sets or returns the value of form fields.

Using the jQuery text() and html() methods, the following example shows where to go to get content:

Illustration:

EXAMPLE ❯


                                $("#btn1").click(function(){<br />
  alert("Text: " + $("#test").text());<br />
});<br />
$("#btn2").click(function(){<br />
  alert("HTML: " + $("#test").html());<br />
});

The jQuery val() method is used to get the value of an input field in the following cases:

Illustration:

EXAMPLE ❯


                                $("#btn1").click(function(){<br />
  alert("Value: " + $("#test").val());<br />
});

Obtain Attributes - attr ()

To obtain attribute values, use the jQuery attr() method.

This same following illustration shows how to find out the value of a link's href attribute:

Illustration:

EXAMPLE ❯


                                $("button").click(function(){<br />
  alert($("#w3s").attr("href"));<br />
});

This same content and attribute values can be set (changed) in the next chapter.

❮ Previous Next ❯