Get Content and Attributes in jQuery

Getting and assigning content of elements in jQuery is very simple because of its in-built functions. JQuery provides many in-built functions that can be used to get content of any element and can set html part for any element.

JQuery library contains many DOM related functions that make it easy to use and understand how it is working. Programmer can easily manipulate content of any element or attributes by using existing functions. In rare chances programmer have to write its own functions with collection of JQuery library functions.

To get content of any element on the web-page, programmer can use following three mostly used functions:

val(): get or set the value of forms field.
text(): get or set the text content of selected elements.
html(): get of set the whole content of selected elements including html markup.

Lookout the following example through which we will use all three types of functions and show the values returns by them.

$("#btn").click(function(){
alert($("#lblText1").val());
alert($("#lblText2").text());
alert($("#lblText3").html());
});

All the above alert messages will return respective values for selected label. The below code fragment will assign some values to all three labels:

$("#btn").click(function(){
alert($("#lblText1").val("value"));
alert($("#lblText2").text("text"));
alert($("#lblText3").html("html"));
});

In the next article we will get and set attribute's value for an element on the web-page.