8/30/2015

jQuerySetContentandAttributes

jQueryTutorial
jQueryHOME(default.asp)
jQueryIntro(jquery_intro.asp)
jQueryGetStarted(jquery_get_started.asp)
jQuerySyntax(jquery_syntax.asp)
jQuerySelectors(jquery_selectors.asp)
jQueryEvents(jquery_events.asp)
HTML(/html/default.asp)
CSS(/css/default.asp)
(/default.asp)
JAVASCRIPT(/js/default.asp)
SQL(/sql/default.asp)
jQueryEffects
jQueryHide/Show(jquery_hide_show.asp)
PHP(/php/default.asp)
jQUERY(/jquery/default.asp)
jQueryFade(jquery_fade.asp)
BOOTSTRAP(/bootstrap/default.asp)
ANGULAR(/angular/default.asp)
jQuerySlide(jquery_slide.asp)
jQueryAnimate(jquery_animate.asp)
XML(/xml/default.asp)
TUTORIALS

REFERENCES

jQuerystop()(jquery_stop.asp)
EXAMPLES
FORUM(/forum/default.asp)
jQueryCallback(jquery_callback.asp)
jQueryChaining(jquery_chaining.asp)

jQueryHTML
jQueryGet(jquery_dom_get.asp)
jQuerySet(jquery_dom_set.asp)
jQueryAdd(jquery_dom_add.asp)
jQueryRemove(jquery_dom_remove.asp)
jQueryCSSClasses(jquery_css_classes.asp)
jQuerycss()(jquery_css.asp)
jQueryDimensions(jquery_dimensions.asp)

jQueryTraversing
jQueryTraversing(jquery_traversing.asp)
http://www.w3schools.com/jquery/jquery_dom_set.asp

1/8

8/30/2015

jQuerySetContentandAttributes

jQueryAncestors(jquery_traversing_ancestors.asp)
jQueryDescendants(jquery_traversing_descendants.asp)
jQuerySiblings(jquery_traversing_siblings.asp)
jQueryFiltering(jquery_traversing_filtering.asp)

jQueryAJAX
jQueryAJAXIntro(jquery_ajax_intro.asp)
jQueryLoad(jquery_ajax_load.asp)
jQueryGet/Post(jquery_ajax_get_post.asp)

jQueryMisc
jQuerynoConflict()(jquery_noconflict.asp)

jQueryExamples
jQueryExamples(jquery_examples.asp)
jQueryQuiz(jquery_quiz.asp)
jQueryCertificate(jquery_exam.asp)

jQueryReferences
jQuerySelectors(jquery_ref_selectors.asp)
jQueryEvents(jquery_ref_events.asp)
jQueryEffects(jquery_ref_effects.asp)
jQueryHTML/CSS(jquery_ref_html.asp)
jQueryTraversing(jquery_ref_traversing.asp)
jQueryAJAX(jquery_ref_ajax.asp)
jQueryMisc(jquery_ref_misc.asp)
jQueryProperties(jquery_ref_prop.asp)

http://www.w3schools.com/jquery/jquery_dom_set.asp

2/8

8/30/2015

jQuerySetContentandAttributes

jQuerySetContentandAttributes

Previous(jquery_dom_get.asp)NextChapter(jquery_dom_add.asp

SetContenttext(),html(),andval()
Wewillusethesamethreemethodsfromthepreviouspagetosetcontent:
text()Setsorreturnsthetextcontentofselectedelements
html()Setsorreturnsthecontentofselectedelements(includingHTML
markup)
val()Setsorreturnsthevalueofformfields
ThefollowingexampledemonstrateshowtosetcontentwiththejQuerytext(),html(),
andval()methods:

Example
$("#btn1").click(function(){
$("#test1").text("Helloworld!");
});
$("#btn2").click(function(){
$("#test2").html("<b>Helloworld!</b>");
});
$("#btn3").click(function(){
$("#test3").val("DollyDuck");
});
Tryityourself(tryit.asp?filename=tryjquery_dom_html_set)

ACallbackFunctionfortext(),html(),andval()
AllofthethreejQuerymethodsabove:text(),html(),andval(),alsocomewitha
callbackfunction.Thecallbackfunctionhastwoparameters:theindexofthecurrent
elementinthelistofelementsselectedandtheoriginal(old)value.Youthenreturn
thestringyouwishtouseasthenewvaluefromthefunction.
Thefollowingexampledemonstratestext()andhtml()withacallbackfunction:

Example
$("#btn1").click(function(){
http://www.w3schools.com/jquery/jquery_dom_set.asp

3/8

8/30/2015

jQuerySetContentandAttributes

$("#test1").text(function(i,origText){
return"Oldtext:"+origText+"Newtext:Helloworld!
(index:"+i+")";
});
});
$("#btn2").click(function(){
$("#test2").html(function(i,origText){
return"Oldhtml:"+origText+"Newhtml:Hello<b>world!</b>
(index:"+i+")";
});
});
Tryityourself(tryit.asp?filename=tryjquery_dom_html_callback)

SetAttributesattr()
ThejQueryattr()methodisalsousedtoset/changeattributevalues.
Thefollowingexampledemonstrateshowtochange(set)thevalueofthehrefattribute
inalink:

Example
$("button").click(function(){
$("#w3s").attr("href","http://www.w3schools.com/jquery");
});
Tryityourself(tryit.asp?filename=tryjquery_dom_attr_set)

Theattr()methodalsoallowsyoutosetmultipleattributesatthesametime.
Thefollowingexampledemonstrateshowtosetboththehrefandtitleattributesatthe
sametime:

Example
$("button").click(function(){
$("#w3s").attr({
"href":"http://www.w3schools.com/jquery",
"title":"W3SchoolsjQueryTutorial"
});
});

http://www.w3schools.com/jquery/jquery_dom_set.asp

4/8

8/30/2015

jQuerySetContentandAttributes

Tryityourself(tryit.asp?filename=tryjquery_dom_attr_set2)

ACallbackFunctionforattr()
ThejQuerymethodattr(),alsocomewithacallbackfunction.Thecallbackfunctionhas
twoparameters:theindexofthecurrentelementinthelistofelementsselectedand
theoriginal(old)attributevalue.Youthenreturnthestringyouwishtouseasthenew
attributevaluefromthefunction.
Thefollowingexampledemonstratesattr()withacallbackfunction:

Example
$("button").click(function(){
$("#w3s").attr("href",function(i,origValue){
returnorigValue+"/jquery";
});
});
Tryityourself(tryit.asp?filename=tryjquery_dom_attr_callback)

TestYourselfwithExercises!
Exercise1(exercise.asp?filename=exercise_set1)

Exercise2(exercise.asp?filename=exercise_set2)

Exercise3(exercise.asp?filename=exercise_set3)

Exercise4(exercise.asp?filename=exercise_set4)

Exercise5(exercise.asp?filename=exercise_set5)

jQueryHTMLReference
ForacompleteoverviewofalljQueryHTMLmethods,pleasegotoourjQuery
HTML/CSSReference(jquery_ref_html.asp).

http://www.w3schools.com/jquery/jquery_dom_set.asp

5/8

8/30/2015

jQuerySetContentandAttributes

Previous(jquery_dom_get.asp)NextChapter(jquery_dom_add.asp

W3SCHOOLSEXAMS
HTML,CSS,JavaScript,PHP,jQuery,andXMLCertifications(http://www.w3schools.com/cert/default.asp)

COLORPICKER
(/tags/ref_colorpicker.asp)

http://www.w3schools.com/jquery/jquery_dom_set.asp

6/8

8/30/2015

jQuerySetContentandAttributes

SHARETHISPAGE

(http://www.facebook.com/sharer.php?u=http://www.w3schools.com/jquery/jquery_dom_set.asp)
(http://twitter.com/home?status=Currentlyreading
http://www.w3schools.com/jquery/jquery_dom_set.asp)

(https://plus.google.com/share?url=http://www.w3schools.com/jquery/jquery_dom_set.asp)

REPORTERROR()
PRINTPAGE()
FORUM(/forum/default.asp)
ABOUT(/about/default.asp)

Top10Tutorials
HTMLTutorial(/html/default.asp)
CSSTutorial(/css/default.asp)
JavaScriptTutorial(/js/default.asp)
SQLTutorial(/sql/default.asp)
PHPTutorial(/php/default.asp)
jQueryTutorial(/jquery/default.asp)
BootstrapTutorial(/bootstrap/default.asp)
AngularTutorial(/angular/default.asp)
ASP.NETTutorial(/aspnet/default.asp)
XMLTutorial(/xml/default.asp)

Top10References
HTMLReference(/tags/default.asp)
CSSReference(/cssref/default.asp)
JavaScriptReference(/jsref/default.asp)
http://www.w3schools.com/jquery/jquery_dom_set.asp

7/8

8/30/2015

jQuerySetContentandAttributes

BrowserStatistics(/browsers/default.asp)
HTMLDOM(/jsref/dom_obj_document.asp)
PHPReference(/php/php_ref_array.asp)
jQueryReference(/jquery/jquery_ref_selectors.asp)
HTMLColors(/tags/ref_colornames.asp)
HTMLCharacterSets(/charsets/default.asp)
XMLDOM(/dom/dom_nodetype.asp)

Top10Examples
HTMLExamples(/html/html_examples.asp)
CSSExamples(/css/css_examples.asp)
JavaScriptExamples(/js/js_examples.asp)
HTMLDOMExamples(/js/js_dom_examples.asp)
PHPExamples(/php/php_examples.asp)
jQueryExamples(/jquery/jquery_examples.asp)
XMLExamples(/xml/xml_examples.asp)
XMLDOMExamples(/dom/dom_examples.asp)
ASPExamples(/asp/asp_examples.asp)
SVGExamples(/svg/svg_examples.asp)

WebCertificates
HTMLCertificate(/cert/default.asp)
HTML5Certificate(/cert/default.asp)
CSSCertificate(/cert/default.asp)
JavaScriptCertificate(/cert/default.asp)
jQueryCertificate(/cert/default.asp)
PHPCertificate(/cert/default.asp)
BootstrapCertificate(/cert/default.asp)
XMLCertificate(/cert/default.asp)

W3Schoolsisoptimizedforlearning,testing,andtraining.Examplesmightbesimplifiedtoimprovereadingand
basicunderstanding.Tutorials,references,andexamplesareconstantlyreviewedtoavoiderrors,butwecannot
warrantfullcorrectnessofallcontent.Whileusingthissite,youagreetohavereadandacceptedourtermsof
use(/about/about_copyright.asp),cookieandprivacypolicy(/about/about_privacy.asp).Copyright19992015
(/about/about_copyright.asp)byRefsnesData.AllRightsReserved.
(http://www.w3schools.com)

http://www.w3schools.com/jquery/jquery_dom_set.asp

8/8