teisipäev, 16. märts 2010

Kuidas vabaneda lärakast Äripäeva bännerist?

Äripäev on tore leht ja seda tasub kindlasti vaadata. Samas püsilugejal (eriti widescreen ekraaniga, kus ekraan on küll lai, aga mitte eriti kõrge), kes on muidu tubli ja AdBlock'i ei kasuta, on kindlasti too Äripäeva tobe lärakas päisebänner pinnuks silmas. Iphone brauseriga vaadates scrollib bänner muu lehega kaasa, minnes artikli edenedes ilusti serva taha, aga tavabrauseriga on bänner fixed positsiooniga, mis teeb ta üsna ebameeldivaks kui mitte öelda lausa häirivaks.

Õnneks saab selle läraka suhteliselt kerge vaevaga eemaldatud. Selle jaoks pole vaja teha muud kui lisada brauseri URL reale järgmine rida ja vajutada Enter klahvi.

javascript:void($("#siteHeaderContainer").remove())

Peale seda peaks bänner imeväel ekraanilt kaduma. Veel mugavam on teha uus järjehoidja brauseri järjehoidjaribale, niiöelda bookmarklet'ina. Selle jaoks tee sellel lingil parem hiireklõps, vali "Lisa järjehoidja" ning asukohaks määra järjehoidjariba. Kui nüüd Äripäeva vaadata ja klõpsata järjehoidjaribal uut järjehoidjat, kaob bänner ära.

Aga miks see järjehoidja või URL niiviisi töötab?

Brauseri URL riba on seotud hetkel brauseri poolt avatud dokumendiga - tegu oleks nagu millegi lingi laadsega, kus pead klikkimise asemel lingi aadressi ise kirjutama. Linke aga on mitmesuguseid - on http protokolli suunas minevaid linke, on https protokolli suunas minevaid, on ka ftp ja maili saatmiseks mailto lingid, kuid lisaks on veel olemas javascript link, mille järel oleva "aadress" käivitatakse tavalise JavaScriptina nagu see käivituks eesoleva lehe enda seest.

Kuna URL riba on mõeldud siiski lehelt minema navigeerimiseks, üritab brauser seda teha ka javascript: URL'i puhul. Juhul kui käivitatud JavaScript tagastab mingi väärtuse (kusjuures false on ka väärtus!!!), üritab JavaScript seda väärtust lehel "avada". Antud väärtus teisendatakse tekstikujule ning seatakse eesoleva brauseri sisuks (valge leht, kus on rida teksti). Kirjuta URL-i ribale näiteks

javascript:1+1

ja vajuta Enterit. Tulemuseks on valge taustaga leht, kus on kiri 2.

Bänneri eemaldamisel selline tulemus muidugi ei rahulda - kui bänner on ära koristatud, peaks õige leht siiski ette jääma. Aga kuidas mitte tagastada väärtust, kui isegi false on väärtus? Point on selles, et JavaScriptis on olemas ka mitte-väärtus, milleks on undefined. Kui tagastadagi undefined, siis ei oska brauser kuhugi minna ning olemasolev leht jääbki ette. Seega tuleks JavaScript käsk lõpetada undefined väärtuse tagastamisega.

undefined väärtust saab esile manada mitmeti. Kõige lihtsam oleks see kirjutada lihtsalt avaldise lõppu - tagastusväärtuseks on viimase käsu tulemus. Kuna viimane käsk on undefined, siis on ka selle tagastus undefined. Teine võimalus on sisestada käivitatav kood mõne funktsiooni parameetriks, millel enda tagastusväärtus puudub. Eriti hästi sobib selle jaoks void (pole tehniliselt võttes küll mitte funktsioon, vaid operaator), kuna see ei tee üldse mitte midagi.

javascript:1+1;undefined
javascript:void(1+1)

Mõlemal juhul käivitatakse avaldis 1+1, kuid lehelt ära ei navigeerita.

Järgmiseks tuleb tegeleda bänneri eemaldamisega. Kuna Äripäev kasutab jQuery teeki, saab bänneri DOM elemendi mugavalt $ funktsiooniga kätte. Vastasel korral tuleks kasutada pikemat ja kohmakamat document.getElementById("id") vormi (vs. lühike $("#id"))). Kui viide bänneri DOM elemendi juurde on olemas, tuleb see DOM puust eemaldada. "Normaalsetes" oludes tuleks seda teha käsuga dom_element.parentNode.removeChild(dom_element), aga jQuery pakub õnneks tunduvalt mugavamat ja kiiremat varianti - DOM elemendi meetodit remove.

Kui nüüd Äripäeva HTML lähtekoodist järgi vaadata, on bänneri elemendi id väärtuseks siteHeaderContainer. Pannes selle kokku saadud teadmistega, tuleb välja, et bänneri kustutamiseks tuleb käivitada käsklus

$("#siteHeaderContainer").remove()

JavaScripti käivitamiseks paneme saadud käskluse void parameetriks ja moodustame sellest javascript: URL'i ning saamegi kokku vajaliku rea:

javascript:void($("#siteHeaderContainer").remove())

Nii, et ei midagi keerulist!

1 kommentaar:

Hardi ütles ...

aga jättab bänneri pläraka asemel valge pläraka .... ega see ka nüüd parem pole :S