2022.2

Tip: Doyoufindyourselfcopy-pastingthesamefunctionintoeverynewscript?Youcanavoid
thisbydefiningyourfunctioninaControlScript.ControlScriptsareexecutedfirst,sothefunction
willthenbeavailableinallStandardScriptsandPostPaginationScripts.
Note: AnyJavaScriptfilesincludedinasectionrunafterthescriptsintheScriptspane.
Selectors in OL Connect
SelectorsarepatternsusedtoselectoneormoreHTMLelements.Theywereoriginallydevelopedto
beabletodefinethelayoutofwebpageswithouttouchingtheircontent,throughCascadingStyle
Sheets(CSS).InOLConnect,sinceeachsectioninatemplateisinfactanHTMLfile(see"Editing
HTML"onpage171),theverysameselectorscanbeusedinstylesheets(see"Stylingtemplateswith
CSSfiles"onpage261)andStandardScripts(see"Personalizingcontent"onpage297and"Writing
yourownscripts"onpage368).Usingselectorsforscriptingcanincreasethespeedwithwhichatem-
plateanddataaremerged;see"UseanIDorclassasselector"onpage381.
StandardCSSselectors
Selectorsaremadeupofoneormoreofthefollowingcomponents:
l
AnHTML element.TypetheHTMLtagwithouttheanglebrackets(e.g.p)toselectallelements
ofthattype(pselectsallparagraphs).
l
Aclass.Typetheclassname,precededbyadot,e.g.:.green,toselectHTMLelementswith
thatclass.
l
AnID.TypetheID,precededby#,e.g.:#intro,toselectanHTMLelementwiththatID.
Note: InanHTMLfile,eachIDshouldbeunique.ThismeansthataparticularIDcanbe
usedonlyonceineachsection.
l
AnattributeofanHTMLelement.Typetheattributeand,optionally,itsvalue,betweensquare
brackets,e.g.:[target],toselectHTMLelementswithamatchingattribute.
l
Apseudo-class.Forexample,tr:nth-child(even)selectsalleventablerows.
Thesecomponentscanbecombinedindifferentways.Forexample,p divselectsallparagraphs
inside<div>elements,whilep, divselectsallparagraphsandall<div>elements.
Acompletelistofselectorsandwaystocombinethem,andatoolthatdemonstratestheirusecanbe
foundatW3Schools:http://www.w3schools.com/cssref/css_selectors.asp.
AvideoaboutCSSandScriptSelectors,canbefoundhere:ConnectwithEvie6-CSSandScript
Selectors.
Page 385