2022.2

ManualsBrandsObjectif Lune ManualsApplicationsPlanetPress Connect

1241

Table Of Contents

Selector Matched element Matched element after script execution

#box <divid="box">

<h1>Personalinformation</h1>

</div>

<divid="box">

<h1>Personalinformation</h1>

<p>PeterParker</p>

</div>

ThisscriptlooksforanelementwiththeIDboxandappendsaparagraphtoit.

query("#box").append("<p>Peter Parker</p>");



Matched element Matched element after script execution

<divid="box">

<h1>Personalinformation</h1>

</div>

<divid="box">

<h1>Personalinformation</h1>

<p>PeterParker</p>

</div>

ThisscriptlooksforanelementwiththeIDbox,appendsaparagraphtoitandcolorsalltextinsidethe

boxred.

query("#box").append("<p>Peter Parker</p>").css("color","red");



Matched element Matched element after script execution

<divid="box">

<h1>Personalinformation</h1>

</div>

<divid="box"style="color:red;">

<h1>Personalinformation</h1>

<p>PeterParker</p>

</div>

Note: Thewaythefunctionsappend()andcss()areusedinthisscriptiscalled'chaining'.Chain-

ingisoptional;thesamecouldbeachievedbystoringtheresultofthequeryinavariable:

var box = query("#box");

box.append("<p>Peter Parker</p>");

box.css("color","red");

Page 1246