Capitolul 2. Schimbarea stilurilor diferitelor obiecte
În acest capitol, vă continuați să vă familiarizați cu diferite moduri de a schimba stilurile diferitelor obiecte. După cum am văzut deja, Dynamic HTML vă permite să modificați diferite atribute ale obiectelor, de exemplu, atributul SRC al obiectului
Modificarea conținutului IFRAME
funcție change_background (culoare) document.frames.myiframe.document.body.style.backgroundColor = culoare;
>
Acum, culoarea este scrisă fără ghilimele, deoarece nu este numele culorii, ci numele variabilei, argumentul funcției. Ca acest argument, puteți transmite orice nume de culoare valabil. Am spus că funcțiile vă permit să acționați foarte flexibil!
În primul capitol, ați învățat despre conceptul de clase, ca asociații de atribute ale unui obiect. În acest capitol continuăm discuțiile.
Există două moduri de a specifica stilul unui obiect: primul este direct, de exemplu, this.style.color = 'roșu' sau document.all.myHeading.style.fontSize = '20px'. Toate acestea sunt exemple de acces direct la proprietatea obiectului.
A doua modalitate este de a folosi clasele. Folosindu-le, puteți specifica mai multe linii simultan. Deci, de ce clase? Când aveți o mulțime de obiecte de aproximativ același scop pe pagină, puteți utiliza setările de stil globale pentru ele, aplicând un stil tuturor acestor obiecte. Fiecare obiect are un atribut care îl asociază cu o anumită clasă. Prin acest atribut, este ușor să setați stilul unui obiect asociându-l cu o anumită clasă. În plus, puteți modifica dinamic atributul clasei, respectiv modificarea stilului obiectului.
Acest exemplu arată cum puteți efectua o schimbare de clasă dinamică.
Arătați mouse-ul la mine pentru a vedea cum se schimbă dinamic clasele
Există două clase numite textRed și textBlack. Când inițializați, obiectul
clasa textBlack este atribuită, rețineți că în acest caz se utilizează atributul de clasă, iar numele clasei este scris fără ghilimele. Acest lucru se datorează faptului că acest cod face parte din limbajul HTML, dar când numele clasei trebuie modificat, există o parte a limbajului script în ghilimele duble, astfel încât atributul className este folosit și numele clasei este scris în citate simple.
Cu ajutorul clasei, puteți modifica toate atributele de stil, cu excepția poziției. Nu puteți defini un stil de poziționare: absolut sau poziționat altfel decât prin cod HTML direct.
Când atribuiți valori atributelor, rețineți că aceste valori sunt întotdeauna șiruri de caractere. Prin urmare, nu puteți manipula valorile de proprietate într-un sens matematic. Și mai ales în acest scop au fost introduse mai multe proprietăți, ale căror valori sunt numere întregi.
Dacă proprietatea presupune o anumită varietate de valori, puteți specifica valoarea în care introduceți valoarea. Următoarele exemple utilizează valorile punctelor și pixelilor. Acestea sunt specificate în mod corespunzător prin pointerii pt și px.
Dacă nu specificați un pointer, se utilizează valoarea implicită. Există un avantaj: puteți specifica valoarea unei proprietăți ca număr întreg. Cele două linii următoare sunt identice:
document.all.MyElement.style.fontSize = "72";
document.all.MyElement.style.fontSize = 72;