Palikuća To je bitan alat za one koji programiraju ili optimiziraju web stranice, bilo da su dizajneri ili webmasteri. Tako možemo eliminirati greške u programiranju ili dizajnu, znati kako funkcioniraju i kakva je struktura web stranice, kako svi elementi koji je čine.
Instaliramo dodatak Firebug
Za instaliranje dodatka idemo na web mjesto za preuzimanje firebuga i tamo tražimo najnoviju verziju alata za preuzimanje.
Kartica konzole
Konzola Palikuća Tu će se prikazivati poruke o tome što web radi i pogreške koje se pojavljuju. Možemo vidjeti poruke o pozivima na funkcije ili stranice koje web stvara tijekom naše interakcije, prikazujući nam funkcije, pozive na povratne pozive ili web -usluge i vrijednosti koje se razmjenjuju u vrijeme izvođenja dok kontroliramo tijek aplikacije.
Pogledajmo neke primjere, pristupamo web stranici motores.com.ar, kliknemo desnom tipkom miša i aktiviramo Palikuća.
Također možemo vidjeti kako prilikom dodavanja proizvoda u košaricu šalje sljedeće parametre: funkciju, količinu proizvoda i ID proizvoda.
Ajax funkcija pozvana insertItem cant 1 Id 5850326Iako možemo vidjeti da će se dodati samo ako smo prijavljeni kao korisnici, u protivnom će tražiti da se registriramo.
Tako možemo vidjeti kako aplikacija radi i koji parametar šalje ili prima te koje odgovore daje i koje je vrijeme odziva bilo, na primjer za dodavanje proizvoda kojemu je trebalo 335 milisekundi.
HTML kartica
omogućuje vam da vidite strukturu weba i uredite kôd web stranice u stvarnom vremenu. Na primjer, možemo promijeniti kôd HTML web stranice ili css koda i pregledajte ih izravno bez da su te promjene trajne. Na primjer, ako pristupamo web stranici Ebay, možemo upotrijebiti Firebug za promjenu boje glavnog ili bloka web sadržaja.
pozadina: crveno nema ponavljanja pomicanja 0 0;Kad završite s pisanjem, središnji blok će postati crven, ako ažuriramo stranicu, promjene će se izgubiti i vratit će se u izvorni dizajn.
Također možemo pokušati manipulirati html kodom i css kodom kako bismo promijenili Ebay logotip za Google, to se radi promjenom urla slike logotipa Ebaya za drugi url slike koju želimo.
Ova funkcionalnost ne funkcionira radi promjene kompletnog dizajna, već radi malih testova i vizualizacije promjena, bez potrebe za pristupom uređivaču.
CSS kartica
Kartica ploče CSS Prikazuje sve CSS klase i identifikatore koje stvaramo ili koje ima web koji analiziramo. Na ovoj ploči možemo izmijeniti naše klase i css rečenice kao što smo to prethodno učinili na kartici Stilovi na HTML ploči.
Kartica Skripta
Ova ploča služi za otklanjanje pogrešaka u kodu JavaScript ili jQuery. Pokazuje nam sve što skripta radi, njezine varijable, njezine funkcije, ispravljanje pogrešaka po točkama prekida, postupno izvršavanje skripte, zaslon za upravljanje varijabilnim hrpom, a možemo vidjeti i ponašanje funkcija.
DOM kartica
Ploča SUNCE ili Način rada objekta dokumentaOn je taj koji dobiva informacije o svim različitim DOM svojstvima i njihovim metodama. DOM je dio elemenata weba i omogućuje programerima pristup i upravljanje XHTML web stranicama.
JQuery nudi metode za učinkovito upravljanje DOM -om. Možemo pristupiti bilo kojem atributu bilo kojeg elementa ili izdvojiti HTML kôd iz odlomka ili bloka. Osim toga pruža metode kao što su .attr (), .HTML (), Y .val () Oni djeluju kao dobavljači i dohvaćanje informacija iz DOM elemenata za kasniju upotrebu.
Pogledajmo u ovom primjeru jQuery i DOM kako kontrolirati div i izdvojiti tekst:
Jquery i DOMIzdvoji tekst iz bloka:
Ovo je DOM testni tekst
Oznake HTML Elementu se pristupa putem css klase ili id -a, a zatim svojstva koje može biti tekstualno ili neko drugo koje dopušta jQuery i DOM.
Kartica Mreža
Svrha ploče Mreža je nadziranje web prometa i učitavanja i potrošnje svakog HTTP web zahtjeva, ovo izvješće se sastoji od popisa unosa, pri čemu svaki od njih predstavlja zahtjev / odgovor koji je stranica izvršila.
Prozor mrežne ploče prikazuje popis zahtjeva, dok se web učitava i koristi. Svaka stavka na popisu prikazuje informacije koje proizvodi zahtjev, a grafička vremenska traka prikazuje potrošene bajtove, vrijeme potrebno za odgovor, što predstavlja faze učitavanja u vremenu. Slijedi popis informacija koje se prikazuju za svaki zahtjev:
- Metoda HTTP zahtjeva
- HTTP kod odgovora i opis (200.301.404, itd.)
- Naziv datoteke koji se poziva
- Naziv domene odakle je odgovor
- Veličina odgovora u bajtima
- Vrijeme u milisekundama potrebno je za odgovor.
