Eroare de pagina web de depanat. Erori de script în Internet Explorer. Motive și metode de eliminare. Profilarea interogărilor SQL Depanați o pagină web
În timp ce navighezi pe internet motor de cautare Explorer poate afișa mesaje că pagina conține erori și poate să nu fie afișate corect. Să ne uităm la câteva modalități de a remedia această problemă.
Instruire
Există, desigur, și altele – cu siguranță le voi menționa.
Firebug pentru Firefox
Nu stiu sigur daca firebug precursorul altor instrumente de dezvoltare, dar este cu siguranță cel mai popular, convenabil și funcțional până în prezent.
Firebug este un program de completare pentru Firefox, ceea ce înseamnă că trebuie descărcat de pe site-ul de suplimente Firefox și instalat.
Pentru a apela firebug, trebuie doar să apăsați F12.
Caracteristicile acestui supliment:
- Inspectarea și editarea HTML care se schimbă dinamic;
- Editare CSS din mers;
- Depanare JavaScript Linie de comanda pentru a executa scripturi;
- Monitorizarea solicitărilor de rețea - puteți vedea dimensiunea și timpul de descărcare a fișierelor și scripturilor, antete de solicitare;
- Analizor DOM.
Puteți vorbi despre aceste caracteristici în detaliu mult timp, dar cred că sunt cunoscute de toți cititorii noștri, iar dacă nu - informatii detaliate este pe pagina de pornire a lui Firebug sau același lucru în traducerea lui Ilya Kantor.
Pe lângă firebug în sine, este posibil să aveți nevoie loțiune utilă către el - firecookie, cu care (surpriza:-) puteti vizualiza si modifica cookie-urile.
Bara de instrumente pentru dezvoltatori WEB pentru Firefox
Un alt plus util pentru Ognelis. Arata cam asa:
Să trecem prin puncte.
Dezactivați
Vă permite să dezactivați JavaScript, să dezactivați utilizarea cache-ului, ceea ce este foarte util la dezvoltare (vă permite să fiți sigur că pagina este încărcată cu ultimele actualizări), anulați culorile folosite pe pagină și înlocuiți-le cu unele standard, dezactivați trimiterea în antetul referitor (pagina de la care s-a făcut tranziția).
Cookie-uri
O opțiune utilă pentru lucrul cu cookie-uri: acestea pot fi vizualizate, șterse, blocate și adăugate.
css
Acest meniu conține cea mai tare caracteristică a Barei de instrumente pentru dezvoltatori - editarea CSS din mers. În plus, este posibil să vizualizați css, dezactivați și așa mai departe și așa mai departe. În opinia mea, prezența comenzilor rapide de la tastatură este foarte utilă aici (CTRL + SHIFT + C, de exemplu, vă permite să mergeți imediat la vizualizarea stilurilor de pagină)
Forme
Totul pentru lucrul cu formulare: afișați parole, afișați informații despre formulare, convertiți metodele de formulare (GET » POST și invers) și multe altele. Funcție utilă „Populați câmpuri de formular” pentru completarea automată a câmpurilor de formular (de exemplu, la testarea unui site când funcția de memorare a parolei este dezactivată. În caz contrar, nu văd nimic util în acest paragraf.
imagini
Există o funcție utilă pentru a dezactiva imaginile - pentru a vedea cum arată site-ul tău fără imagini. Imaginile pot fi încercuite, afișați dimensiunile lor, afișați alt-atribute.
informație
Acest meniu are o mulțime de opțiuni. Poate fi util să afișați atributele de clasă și id pe pagină. În plus, elementul „Vizualizare informații despre culoare” este interesant - pentru a obține rapid informații despre culorile care sunt utilizate pe pagină. „Vizualizați dimensiunea documentului” - vizualizați dimensiunea paginii. „Vedeți anteturile de răspuns” - vedeți anteturile paginii.
Diverse
Funcția cea mai frecvent utilizată este ștergerea memoriei cache. În plus, „Rglă de pagină” - riglă, „Lupă de pagină” - lupă și „Ghiduri de linii” - sunt disponibile aici câteva linii, care pot fi utile pentru a tăia șablonul.
contur
Selectarea diferitelor elemente ale paginii - tabele, titluri, linkuri, cadre, blocuri. Redimensionare vă permite să redimensionați fereastra browserului pentru a se potrivi oricăror extensii standard de ecran. Instrumentele de aici sunt funcții stocate pentru validarea paginii. Atât local, cât și extern. Convenabil și acces rapid validarea HTML, CSS și multe altele. Puteți utiliza comanda rapidă de la tastatură CTRL+SHIFT+H pentru a valida HTML.
Vizualizare sursă
Vedere cod sursa. Posibilitatea de a vizualiza într-o aplicație externă, de a vizualiza codul generat.
Cel din dreapta este preferatul meu. Este un HTML rapid, validator CSS și indicator de eroare JavaScript. Dacă nu există probleme, pictograma este verde, iar dacă există probleme, este roșie.
Bara de instrumente pentru dezvoltatori Internet Explorer
Începând de la 8.0, depanarea erorilor este deja încorporată în acest browser. Se numește ușor Tasta F12. Adevărat, este mizerabil ca program al anilor 90.
Dar există un instrument mult mai cool pentru acest browser, așa-numita Bară de instrumente pentru dezvoltatori Internet Explorer poate fi descărcată de pe link.
În aparență, această bară de instrumente, desigur, arată ca firebug, dar, din păcate, încă nu a ajuns la ea. Deși, pe de altă parte, are unele caracteristici pe care firebug-ul nu le are. Aș numi Internet Explorer Developer Toolbar un hibrid de Firebug și dezvoltator web firefox Bara de instrumente.
Ca și în firebug, există o opțiune de a inspecta un element cu un simplu clic. Dar, dacă putem vedea imediat umpluturi și margini, atunci nu există o astfel de posibilitate aici.
De asemenea, Bara de instrumente pentru dezvoltatori Internet Explorer nu actualizează în mod dinamic arborele de elemente, așa cum face Firebug. Adică, dacă schimbăm ceva în pagină folosind js, nu vom vedea nimic folosind această bară de instrumente.
Din ceea ce vă puteți bucura - schimbarea CSS din mers (o modalitate ușoară de a găsi ce să piratați :), capacitatea de a dezactiva CSS și imaginile, capacitatea de a șterge rapid memoria cache și de a vă juca cu cookie-uri, acces rapid la validare.
Cel mai delicios: există un selector de culori încorporat care vă permite să obțineți orice culoare din pagină folosind o pipetă. (pentru ff există un plugin separat ColorZilla).
Depanare Bara de depanare pentru Internet Explorer
Puteți descărca DebugBar pentru Internet Explorer de la linkul dat.
O extensie interesantă în sine. Instalat ca panou suplimentar pentru browser:
Din anumite motive, există un motor de căutare încorporat, un pipetă, capacitatea de a redimensiona fereastra și, din nou, din anumite motive, capacitatea de a trimite o pagină unui prieten pentru săpun. Deși ar putea fi util. Dar nu am reușit să profit de această oportunitate.
În plus, există un inspector:
Metoda de inspecție prin clic sau indicare nu s-a potrivit dezvoltatorilor: au venit cu un lucru mai interesant. În DebugBar, trebuie să trageți ținta către elementul dorit pentru a o vedea în arbore. Nu există nicio opțiune de a edita CSS. Dar există un validator și o consolă js încorporată.
Și dacă cercetați setările, puteți găsi asta:
Atat amuzant cat si trist.
Se știe că Bara de instrumente pentru dezvoltatori va fi încorporată în al optulea explorator. Va fi asemănător cu cel descris în al treilea paragraf, dar sperăm că va fi mai bine.
Depanați DragonFly pentru Opera
DragonFly a fost încorporat în Opera începând cu versiunea 9.5, deci nu este nevoie să îl instalați. Pentru a activa Dragonfly, accesați Instrumente → Avansat → Instrumente pentru dezvoltatori. Și dacă este în engleză, atunci Instrumente → Avansat → Instrumente pentru dezvoltatori.
Vă voi avertiza imediat că DragonFly este în stadiul Alpha2, asta explică multe dintre erorile sale.
Lista de caracteristici:
- inspector DOM;
- Faceți clic pe Inspecție (din nou, nu vom vedea umplutură ca în FireFox);
- Editare;
- Acces rapid la consola de erori.
DF este ceva ca o pagină separată într-un cadru. Dacă îl deschideți, acesta va fi deschis pentru toate filele (spre deosebire de firebug). Prin urmare, înainte de a inspecta un element, trebuie să selectăm pagina pe care dorim să o vizualizam din listă.
Din păcate, aici, ca și în Internet Explorer, Bara de instrumente Dav nu afișează elemente create dinamic. Și, în general, atunci când inspectăm pagina, nu se rulează JavaScript: nu se face clic pe link-urile și butoanele. Să sperăm că atunci când DragonFly se va apropia de lansare, vom vedea toate aceste caracteristici.
Depanați inspectorul WEB în Safari
Voi spune imediat asta despre browser safari Am fluierat informația, așa că, după cum se spune, nu sunt responsabil pentru caracterul adecvat al materialului.
Pentru a activa elementul „Dezvoltare” din meniul Safari, trebuie să activați elementul corespunzător în setări (fila „Avansat”):
Următoarele funcții ne sunt disponibile în meniul „Dezvoltare”:
Să aruncăm o privire mai atentă la inspectorul WEB:
În mod implicit, inspectorul se deschide în modul de vizualizare HTML. Dar poate fi comutat în modul de vizualizare DOM. Pentru a face acest lucru, există un comutator pe placa de sus. Când treceți cu mouse-ul peste un element din inspector, acesta va fi evidențiat pe pagina însăși. Nu puteți vedea umplutură, modificați marcajul sau CSS din mers sau nu puteți vedea modificări dinamice ale DOMe din mers, așa cum nu puteți în FireBug. Dar, vezi tu, arată foarte frumos.
Dacă doriți să lucrați cu inspectorul într-o fereastră de browser, puteți face clic pe butonul din colțul din stânga jos.
Chiar și în safari, este disponibilă o astfel de funcție precum „Cronologia rețelei” (butonul „Rețea” din inspector):
Puteți vedea clar când și cât timp sunt încărcate fișierele. De asemenea, puteți vizualiza antetele solicitărilor, dar, din păcate, nu puteți vizualiza conținutul în sine.
Depanare pentru dezvoltatori în Google Chrome
Lame s-a născut într-o formă avansată și are imediat, deși strâmb pentru moment, dar totuși instrumente pentru dezvoltatori.
- Inspector DOM;
- depanator javascript;
- Consola JavaScript.
Pentru a inspecta un element, faceți clic dreapta pe el și meniul contextual selectați „Vedeți codul elementului”:
Funcționalitatea este aceeași ca în Safari: elementele sunt evidențiate la trecerea cursorului, dar editarea CSS și HTML nu este disponibilă, modificările în DOM nu sunt urmărite. Numai că butonul din colțul din stânga jos, care ar trebui să atașeze inspectorul la fereastra browserului, nu funcționează.
În fila „Resurse”, putem vedea următoarele:
Puțin diferit de scara din safari. Translucide în această diagramă sunt dimensiunile relative ale fișierelor, iar culoarea completă este timpul de descărcare. Într-un fel sau altul, este evident că această parte a Chrome este încă departe de a fi finalizată.
În acest articol, am trecut în revistă cele mai faimoase extensii și instrumente încorporate pentru browsere.
Mai sunt si altele, de exemplu:
- Internet Explorer WEB Development Helper este un bun ajutor pentru dezvoltatorii ASP.NET (Internet Explorer);
- WEB Developer Toolbar - bară de instrumente pentru Internet Explorer și FireFox. Există mai multe caracteristici utile;
- WEB Accessibility Toolbar - bară de instrumente pentru Internet Explorer. Nimic interesant.
Dacă există suplimente pe care nu le-am menționat, dar ar merita, sau există funcții pentru extensiile menționate pe care le-am ratat, scrieți.
Folosește-te pentru sănătate!
Scrierea HTML este grozavă, dar de unde știi unde este eroarea atunci când ceva nu funcționează? Acest articol descrie mai multe instrumente care vă ajută să găsiți și să remediați erorile în HTML.
Depanarea nu este înfricoșătoare
În timp ce scrii un cod, totul merge de obicei bine până în momentul în care faci o greșeală. Deci codul tău nu funcționează sau nu funcționează așa cum ai vrut. Dacă încercați să compilați un program Rust care nu funcționează, compilatorul va raporta o eroare:
În acest caz, mesajul de eroare este relativ ușor de înțeles - „șir de ghilimele neterminate”. Dacă te uiți cu atenție la println!(Bună ziua, lume!"); , vei observa că nu există citat dublu. Desigur, mesajele de eroare pot deveni mult mai greu de înțeles pe măsură ce codul tău crește și chiar și cele mai simple cazuri pot fi intimidante pentru cei care nu știu nimic despre Rust.
Dar nu vă fie frică să depanați! Pentru a scrie și a depana confortabil orice cod, trebuie să înțelegeți limbajul și instrumentele sale.
HTML și depanare
HTML nu este la fel de greu de înțeles ca Rust. HTML-ul nu este compilat în nicio altă formă înainte ca browserul să-l analizeze și să afișeze rezultatul (este interpretat, nu compilat). Sintaxă elemente HTML mult mai clar decât „limbajele de programare reale” precum Rust, JavaScript sau Python. Modul în care browserele citesc HTML este mai mult tolerant decât limbaje de programare care își interpretează codul mai strict. Acest lucru este și rău și bun în același timp.
cod tolerant
Deci, ce înseamnă tolerant? În termeni generali, atunci când încurci codul, există două tipuri de erori în care vei întâlni:
- Erori de sintaxă: Acestea sunt greșeli de ortografie, ca mai sus în exemplul Rust. Acestea sunt de obicei ușor de remediat, atâta timp cât sunteți familiarizat cu sintaxa limbii și știți ce înseamnă mesajele de eroare.
- Erori de logica: Sunt erori care apar atunci când sintaxa este corectă, dar codul nu își îndeplinește scopul, adică programul nu se execută corect. Acestea sunt mai greu de remediat decât cele sintactice, deoarece nu sunt afișate mesaje care să indice locul în care ați făcut o greșeală.
HTML nu suferă de erori de sintaxă deoarece browserul citește codul tolerant, în sensul că paginile pot fi redate chiar dacă sunt prezente erori de sintaxă. Browserele au reguli încorporate pentru interpretarea markupurilor scrise prost și poți rula ceva chiar dacă ai vrut să spui altceva. Aceasta poate fi o problemă reală!
Pe o notă: HTML este lizibil, deoarece atunci când web-ul a apărut pentru prima dată, s-a decis să se permită oamenilor să publice conținut chiar dacă codul era incorect, deoarece acest lucru este mult mai important decât să ne asigurăm că sintaxa este absolut corectă. Web-ul nu ar fi atât de popular acum dacă ar fi strict în privința noilor veniți.
Învățare activă: introducerea codului tolerant
E timpul să explorezi natura codului tolerant în HTML.
Validare HTML
Din exemplul de mai sus reiese clar că merită să verificați validitatea HTML-ului. În exemplul simplu de mai sus, puteți doar să parcurgeți tot codul și să găsiți erori, dar ce rămâne cu paginile uriașe și complexe?
Cel mai bine este să verificați pagina în serviciul de validare a marcajului. A fost creat și întreținut de W3C, organizația responsabilă pentru specificarea HTML, CSS și a altor tehnologii web. Serviciul va verifica codul HTML și va raporta erorile din acesta.
HTML poate fi verificat la adresa prin încărcarea fișierului sau pur și simplu copierea acestuia pe pagină.
Învățare activă: validarea unui document HTML
- Deschideți serviciul de validare a marcajului în browser.
- Comutați la modul Validare prin introducere directă.
- Copiați întregul cod al documentului (nu doar corpul) și inserați-l în spațiul de introducere.
- presa verifica (verifica).
Veți vedea o listă de erori și alte informații.
Lucrul cu mesaje de eroare
De obicei, este imediat clar ce înseamnă mesajele, dar uneori trebuie să încerci să înțelegi despre ce este vorba. Acum vom trece prin toate erorile și vom analiza ce înseamnă acestea. Rețineți că mesajele includ un rând și o coloană de cod pentru a facilita găsirea erorilor.
- „Eticheta de final a fost implicită, dar au fost elemente deschise” (2 cazuri): Nu există nicio etichetă de final explicită, deși browserul ghicește unde ar trebui să fie. Mesajul indică linia de după cea în care era așteptată eticheta de final, dar veți găsi locul potrivit.
- „Element neînchis puternic”: Acest lucru este foarte simpla greseala- element) indică faptul că conținutul său este de mare importanță, seriozitate sau urgență. Browserele redau de obicei conținut cu aldine."> nu este închis și mesajul indică direct eticheta de pornire.
- „Eticheta de final puternică încalcă regulile de imbricare”: elementul este imbricat incorect - nu există nicio etichetă de deschidere care să se potrivească la acest nivel.
- „Sfârșitul fișierului atins când se află în interiorul unei valori de atribut. Se ignoră eticheta”: mesaj misterios. Problema este că undeva (cel mai probabil, la sfârșitul documentului) proprietatea unui element este înregistrată incorect, iar sfârșitul fișierului a apărut în această proprietate. Linkul nu este vizibil în browser - cel mai probabil, problema este lângă el.
- „Sfârșitul fișierului văzut și au fost elemente deschise”: fișierul s-a încheiat, dar unele elemente nu sunt închise. Mesajul indică sfârșitul fișierului, în acest caz elementul nu este închis exemplu: link către pagina de start Mozilla ↩
Destul de des, utilizatorii pot observa o situație în care apare un mesaj de eroare de script în browser (IE). Dacă situația este izolată, atunci nu ar trebui să vă faceți griji, dar atunci când astfel de erori devin regulate, atunci ar trebui să vă gândiți la natura acestei probleme.
O eroare de script în Internet Explorer este de obicei cauzată de faptul că browserul nu gestionează corect codul paginii HTML, prezența fișierelor temporare de Internet, setările contului și multe alte motive pentru care va fi discutatîn acest material. Se vor lua în considerare și metodele de rezolvare a acestei probleme.
Înainte de a continua cu metode obișnuite de diagnosticare a problemelor cu Internet Explorer care cauzează erori de script, trebuie să vă asigurați că eroarea apare nu numai pe un anumit site, ci pe mai multe pagini web simultan. De asemenea, trebuie să verificați pagina web în care apare problema sub o altă pagină cont, pe alt browser și pe alt computer. Acest lucru va restrânge căutarea cauzei erorii și va exclude sau confirma ipoteza că mesajele apar ca urmare a prezenței anumitor fișiere sau setări pe computer.
Blocarea scripturilor active din Internet Explorer, ActiveX și Java
Scripturile active, controalele ActiveX și Java afectează modul în care informațiile sunt generate și afișate pe site și pot fi cauza reală a problemei descrise anterior dacă sunt blocate pe PC-ul utilizatorului. Pentru a vă asigura că apar erori de script din acest motiv, trebuie doar să resetați setările de securitate ale browserului. Pentru a face acest lucru, urmați următoarele instrucțiuni.
- Deschideți Internet Explorer 11
- Serviciu
- În fereastră, accesați fila Siguranță
- Apoi faceți clic pe butonul Mod implicit iar apoi butonul Bine
Fișiere temporare Internet Explorer
De fiecare dată când deschideți o pagină web, Internet Explorer salvează o copie locală a acestei pagini web pe computer în așa-numitele fișiere temporare. Când există prea multe astfel de fișiere și dimensiunea folderului care le conține ajunge la câțiva gigaocteți, pot apărea probleme la afișarea paginii web și anume, va apărea un mesaj de eroare de script. Ștergerea în mod regulat a folderului cu fișiere temporare poate ajuta la rezolvarea acestei probleme.
Pentru a șterge fișierele temporare de Internet, urmați pașii de mai jos.
- Deschideți Internet Explorer 11
- Serviciu
- În fereastră, accesați fila Sunt comune
- În capitolul Istoricul browserului apasa butonul Șterge…
- La fereastră Șterge istoricul de navigare bifați casetele de lângă articole Fișiere temporare ale internetului și site-urilor web, Cookie-uriși datele site-ului web, Revistă
- Faceți clic pe butonul Șterge
Operarea software-ului antivirus
Erorile de script sunt posibile prin muncă program antivirus când blochează scripturile active, controalele ActiveX și Java de pe pagină sau folderele pentru a salva fișierele temporare ale browserului. În acest caz, ar trebui să consultați documentația pentru produsul antivirus instalat și să dezactivați scanarea folderelor pentru a salva fișiere temporare de Internet, precum și pentru a bloca obiectele interactive.
Procesarea incorectă a codului paginii HTML
Apare, de regulă, pe un anumit site și indică faptul că codul paginii nu este complet adaptat pentru a funcționa cu Internet Explorer. În acest caz, cel mai bine este să dezactivați depanarea scriptului în browser. Pentru a face acest lucru, urmați acești pași.
- Deschideți Internet Explorer 11
- În colțul din dreapta sus al browserului, dați clic pe pictogramă Serviciu sub formă de roată (sau combinația de taste Alt + X). Apoi, în meniul care se deschide, selectați
- În fereastră, accesați fila În plus
- Apoi, debifați caseta Afișați notificarea pentru fiecare eroare de scriptși apăsați butonul Bine.
Aceasta este o listă a celor mai multe cauze comune, care provoacă erori de script în Internet Explorer, așa că dacă te-ai săturat de astfel de mesaje, acordă puțină atenție și rezolvă problema odată pentru totdeauna.
Pe acest moment există un număr mare de browsere diferite care acceptă într-o oarecare măsură standardele HTML existente. Personal, prefer browserul de la Mozilla Corporation. Acest browser are o istorie lungă (se bazează pe faimosul browser Netscape Navigator). Îmi place și acest browser pentru că acceptă un sistem de plug-in-uri - suplimente distribuite separat, când sunteți conectat, puteți modifica funcționalitatea și o puteți personaliza în funcție de nevoile dvs. Și, în sfârșit, acest browser este distribuit gratuit cu coduri open source, ceea ce este, de asemenea, important. Prin urmare, am decis să descriu posibilitățile pe care acest browser le oferă nu numai utilizatorului, ci și dezvoltatorului de pagini Web, cât de ușor și convenabil poate fi procesul de depanare a produselor scrise.
Mozilla Firefox este unul dintre cele mai populare browsere printre dezvoltatori și dezvoltatori web. Le atrage atenția datorită oportunităților pe care le oferă acest browser pentru depanarea proiectelor create, remedierea erorilor și îmbunătățirea. Browserul vine standard cu o consolă java (sau „consola de erori”). Acest utilitar vă permite să depanați scripturile java încorporate. Însă, pluginurile de la terțe părți oferă mult mai multă funcționalitate browserului, care poate fi descărcat și instalat de pe site-ul oficial al Fundației Mozilla. Acum vreau să mă uit la două dintre aceste pluginuri - Web Developer și Firebug. Ambele aceste suplimente pot fi descărcate de la linkurile de mai sus de pe site-ul oficial de suplimente. După instalarea acestora și repornirea browserului, dezvoltatorul are oportunități ample, pe care le voi descrie mai jos, pe rând pentru fiecare dintre pluginuri.
plugin firebug
După cum se spune pe pagina oficială: „Firebug se integrează cu browserul Firefox pentru a îmbogăți foarte mult setul de instrumente pentru dezvoltatori. Veți putea edita, depana și explora CSS, HTML și Javascript live, pe orice pagină web.” Și într-adevăr este. Luați în considerare câteva dintre funcțiile acestui plugin, și anume:
- Vizualizați și editați HTML.
- Construirea CSS.
- Monitorizarea cererilor de rețea
- Depanare JavaScript
- Cercetare JavaScript
- Înregistrare pentru JavaScript
Aceasta nu este o listă completă a tuturor caracteristicilor sale. Deoarece proiectul este open source, oricine poate schimba și adăuga funcționalități.
Pentru a lucra cu pluginul, trebuie să apăsați tasta F12 (Ctrl-F12 pentru a lucra cu el într-o fereastră separată). După o lansare cu succes, obținem următoarele - Figura 1a, 1b.
Figura 1a. Fereastra inițială a pluginului firebug.
Figura 1b. Fereastra inițială a pluginului firebug.
În continuare, începe lucrul propriu-zis cu pluginul. Să presupunem că trebuie să găsim acest sau acel obiect în codul HTML sau să stabilim cu exactitate cum este implementat folosind CSS fragment actual. Pentru a face acest lucru, trebuie doar să selectați opțiunile necesare în meniul ferestrei plug-in cu mouse-ul. În exemplul de mai jos, acesta este HTML în modul Inspect. Acum, mergând la pagina documentului, sub cursorul mouse-ului vom observa o zonă dreptunghiulară care ilustrează aici zona cu care lucrăm. În fereastra pluginului, vom vedea parametrii HTML și CSS care sunt utilizați. De asemenea, făcând clic pe fiecare dintre ele, puteți face modificări și le puteți urmări în dinamică. Acțiunile descrise sunt ilustrate în figurile 2,3,4.
În dezvoltarea acestui proiect, pluginul descris mai sus a fost folosit tocmai în aceste scopuri. Cu toate acestea, deși nu a fost folosit niciun script java aici, pluginul firebug poate fi folosit și pentru a-l depana. Un exemplu de depanare este prezentat în Figura 5.
În acest sens, așa cum este descris mai sus, funcționalitatea acestei extensii nu este limitată. Îl poți studia complet și îl poți folosi după nevoile tale, descarcându-l din linkurile furnizate, după instalarea Mozilla Firefox.
plugin pentru dezvoltatori web
Web Developer - a doua extensie pentru browser Mozilla Firefox, foarte puternic și funcțional, care permite o depanare rapidă și eficientă. După instalarea acestuia, o bară de instrumente suplimentară va apărea în fereastra browserului, prezentată în Figura 6.Lucrul în continuare cu pluginul este intuitiv. De exemplu, dacă trebuie să lucrăm CSS (deși nu este la fel de complet funcțional ca în cazul pluginului Firebug), putem face clic pe meniul CSS și putem dezactiva, activa sau dezactiva.
Este foarte convenabil pentru un dezvoltator să poată vedea cum va arăta proiectul său pe monitoare cu rezoluții diferite. Pentru a face acest lucru, utilizați fila Redimensionare. Aici puteți seta manual permisiunile necesare ecran (800x600, 1024x768 etc.), apoi comutați liber între ele, măriți sau micșorați conținutul. Această funcționalitate este prezentată în Figura 7.
Această extensie are, de asemenea, funcționalități bogate, care sunt toate descrise și disponibile pe site-urile oficiale.
Lista surselor utilizate
- 1. www.getfirebug.com
Site-ul oficial al suplimentului. - 2. http://addons.mozilla.org
Site-ul oficial al Mozilla care găzduiește pluginuri pentru browser Firefox, informații pentru dezvoltatori, informații despre utilizarea pluginurilor. - 3. http://chrispederick.com/work/web-developer/
Site-ul oficial al dezvoltatorului de pluginuri WebDeveloper.
În timpul navigării pe Internet, Internet Explorer poate afișa mesaje că pagina conține erori și nu se poate afișa corect. Să ne uităm la câteva modalități de a remedia această problemă.
Instruire
Destul de des, utilizatorii pot observa o situație în care apare un mesaj de eroare de script în browserul Internet Explorer (IE). Dacă situația este izolată, atunci nu ar trebui să vă faceți griji, dar atunci când astfel de erori devin regulate, atunci ar trebui să vă gândiți la natura acestei probleme.
O eroare de script în Internet Explorer este de obicei cauzată de faptul că browserul nu procesează corect codul paginii HTML, prezența fișierelor temporare de Internet, setările contului și multe alte motive, care vor fi discutate în acest material. Se vor lua în considerare și metodele de rezolvare a acestei probleme.
Înainte de a continua cu metode obișnuite de diagnosticare a problemelor cu Internet Explorer care cauzează erori de script, trebuie să vă asigurați că eroarea apare nu numai pe un anumit site, ci pe mai multe pagini web simultan. De asemenea, trebuie să verificați pagina web care se confruntă cu această problemă cu un alt cont, pe un alt browser și pe un alt computer. Acest lucru va restrânge căutarea cauzei erorii și va exclude sau confirma ipoteza că mesajele apar ca urmare a prezenței anumitor fișiere sau setări pe computer.
Blocarea scripturilor active din Internet Explorer, ActiveX și Java
Scripturile active, controalele ActiveX și Java afectează modul în care informațiile sunt generate și afișate pe site și pot fi cauza reală a problemei descrise anterior dacă sunt blocate pe PC-ul utilizatorului. Pentru a vă asigura că apar erori de script din acest motiv, trebuie doar să resetați setările de securitate ale browserului. Pentru a face acest lucru, urmați următoarele instrucțiuni.
- Deschideți Internet Explorer 11
- Serviciu
- În fereastră, accesați fila Siguranță
- Apoi faceți clic pe butonul Mod implicit iar apoi butonul Bine
Fișiere temporare Internet Explorer
De fiecare dată când deschideți o pagină web, Internet Explorer salvează o copie locală a acestei pagini web pe computer în așa-numitele fișiere temporare. Când există prea multe astfel de fișiere și dimensiunea folderului care le conține ajunge la câțiva gigaocteți, pot apărea probleme la afișarea paginii web și anume, va apărea un mesaj de eroare de script. Ștergerea în mod regulat a folderului cu fișiere temporare poate ajuta la rezolvarea acestei probleme.
Pentru a șterge fișierele temporare de Internet, urmați pașii de mai jos.
- Deschideți Internet Explorer 11
- În colțul din dreapta sus al browserului, dați clic pe pictogramă Serviciu sub formă de roată (sau combinația de taste Alt + X). Apoi, în meniul care se deschide, selectați
- În fereastră, accesați fila Sunt comune
- În capitolul Istoricul browserului apasa butonul Șterge…
- La fereastră Șterge istoricul de navigare bifați casetele de lângă articole Fișiere temporare ale internetului și site-urilor web, Cookie-uri și date ale site-ului web, Revistă
- Faceți clic pe butonul Șterge
Operarea software-ului antivirus
Erorile de script sunt posibile prin funcționarea unui program antivirus atunci când blochează scripturile active, controalele ActiveX și Java pe o pagină sau folderele pentru a salva fișierele temporare ale browserului. În acest caz, ar trebui să consultați documentația pentru produsul antivirus instalat și să dezactivați scanarea folderelor pentru a salva fișiere temporare de Internet, precum și pentru a bloca obiectele interactive.
Procesarea incorectă a codului paginii HTML
Apare, de regulă, pe un anumit site și indică faptul că codul paginii nu este complet adaptat pentru a funcționa cu Internet Explorer. În acest caz, cel mai bine este să dezactivați depanarea scriptului în browser. Pentru a face acest lucru, urmați acești pași.
- Deschideți Internet Explorer 11
- În colțul din dreapta sus al browserului, dați clic pe pictogramă Serviciu sub formă de roată (sau combinația de taste Alt + X). Apoi, în meniul care se deschide, selectați
- În fereastră, accesați fila În plus
- Apoi, debifați caseta Afișați notificarea pentru fiecare eroare de scriptși apăsați butonul Bine.
Aceasta este o listă cu cele mai frecvente motive care provoacă erori de script în Internet Explorer, așa că dacă te-ai săturat de astfel de mesaje, acordă puțină atenție și rezolvă problema odată pentru totdeauna.
Există, desigur, și altele – cu siguranță le voi menționa.
Firebug pentru Firefox
Nu stiu sigur daca firebug precursorul altor instrumente pentru dezvoltatori, dar este cu siguranță cel mai popular, ușor de utilizat și plin de funcții .
Firebug este un program de completare pentru Firefox, ceea ce înseamnă că trebuie descărcat de pe site-ul de suplimente Firefox și instalat.
Pentru a apela firebug, trebuie doar să apăsați F12.
Caracteristicile acestui supliment:
- Inspectarea și editarea HTML care se schimbă dinamic;
- Editare CSS din mers;
- Depanare JavaScript, linie de comandă pentru executarea scripturilor;
- Monitorizarea solicitărilor de rețea - puteți vedea dimensiunea și timpul de descărcare a fișierelor și scripturilor, antete de solicitare;
- Analizor DOM.
Despre aceste caracteristici puteți vorbi în detaliu mult timp, dar cred că sunt cunoscute de toți cititorii noștri, iar dacă nu, informații detaliate sunt pe pagina de start Firebug sau același lucru este tradus de Ilya Kantor.
Pe lângă firebug în sine, este posibil să aveți nevoie de o loțiune utilă pentru el - firecookie, cu care (surpriza:-) puteti vizualiza si modifica cookie-urile.
Bara de instrumente pentru dezvoltatori WEB pentru Firefox
Un alt plus util pentru Ognelis. Arata cam asa:
Să trecem prin puncte.
Dezactivați
Vă permite să dezactivați JavaScript, să dezactivați utilizarea cache-ului, ceea ce este foarte util în dezvoltare (vă permite să fiți sigur că pagina este încărcată cu cele mai recente actualizări), să anulați culorile folosite în pagină și să le înlocuiți cu unele standard, dezactivați trimiterea în antetul referitor (pagina de la care a fost tranziția).
Cookie-uri
O opțiune utilă pentru lucrul cu cookie-uri: acestea pot fi vizualizate, șterse, blocate și adăugate.
css
Acest meniu conține cea mai tare caracteristică a Barei de instrumente pentru dezvoltatori - editarea CSS din mers. În plus, este posibil să vizualizați css, dezactivați și așa mai departe și așa mai departe. În opinia mea, prezența comenzilor rapide de la tastatură este foarte utilă aici (CTRL + SHIFT + C, de exemplu, vă permite să mergeți imediat la vizualizarea stilurilor de pagină)
Forme
Totul pentru lucrul cu formulare: afișați parole, afișați informații despre formulare, convertiți metodele de formulare (GET » POST și invers) și multe altele. Funcție utilă „Populați câmpuri de formular” pentru completarea automată a câmpurilor de formular (de exemplu, la testarea unui site când funcția de memorare a parolei este dezactivată. În caz contrar, nu văd nimic util în acest paragraf.
imagini
Există o funcție utilă pentru a dezactiva imaginile - pentru a vedea cum arată site-ul tău fără imagini. Imaginile pot fi încercuite, afișați dimensiunile lor, afișați alt-atribute.
informație
Acest meniu are o mulțime de opțiuni. Poate fi util să afișați atributele de clasă și id pe pagină. În plus, elementul „Vizualizare informații despre culoare” este interesant - pentru a obține rapid informații despre culorile care sunt utilizate pe pagină. „Vizualizați dimensiunea documentului” - vizualizați dimensiunea paginii. „Vedeți anteturile de răspuns” - vedeți anteturile paginii.
Diverse
Funcția cea mai frecvent utilizată este ștergerea memoriei cache. În plus, „Rglă de pagină” - riglă, „Lupă de pagină” - lupă și „Ghiduri de linii” - sunt disponibile aici câteva linii, care pot fi utile pentru a tăia șablonul.
contur
Selectarea diferitelor elemente ale paginii - tabele, titluri, linkuri, cadre, blocuri. Redimensionare vă permite să redimensionați fereastra browserului pentru a se potrivi oricăror extensii standard de ecran. Instrumentele de aici sunt funcții stocate pentru validarea paginii. Atât local, cât și extern. Acces convenabil și rapid pentru validarea HTML, CSS și multe altele. Puteți utiliza comanda rapidă de la tastatură CTRL+SHIFT+H pentru a valida HTML.
Vizualizare sursă
Vizualizați codul sursă. Posibilitatea de a vizualiza într-o aplicație externă, de a vizualiza codul generat.
Cel din dreapta este preferatul meu. Este un HTML rapid, validator CSS și indicator de eroare JavaScript. Dacă nu există probleme, pictograma este verde, iar dacă există probleme, roșie.
Bara de instrumente pentru dezvoltatori Internet Explorer
Începând de la 8.0, depanarea erorilor este deja încorporată în acest browser. Se numește ușor Tasta F12. Adevărat, este mizerabil ca program al anilor 90.
Dar există un instrument mult mai cool pentru acest browser, așa-numita Bară de instrumente pentru dezvoltatori Internet Explorer poate fi descărcată de pe link.
În aparență, această bară de instrumente, desigur, arată ca firebug, dar, din păcate, încă nu a ajuns la ea. Deși, pe de altă parte, are unele caracteristici pe care firebug-ul nu le are. Aș numi Internet Explorer Developer Toolbar un hibrid de Firebug și dezvoltator web firefox Bara de instrumente.
Ca și în firebug, este posibil să inspectați un element cu un simplu clic. Dar, dacă putem vedea imediat umpluturi și margini, atunci nu există o astfel de posibilitate aici.
De asemenea, Bara de instrumente pentru dezvoltatori Internet Explorer nu actualizează în mod dinamic arborele de elemente, așa cum face Firebug. Adică, dacă schimbăm ceva în pagină folosind js, nu vom vedea nimic folosind această bară de instrumente.
Din ceea ce vă puteți bucura - schimbarea CSS din mers (o modalitate ușoară de a găsi ce să piratați :), capacitatea de a dezactiva CSS și imaginile, capacitatea de a șterge rapid memoria cache și de a vă juca cu cookie-uri, acces rapid la validare.
Cel mai delicios: există un selector de culori încorporat care vă permite să obțineți orice culoare din pagină folosind o pipetă. (pentru ff există un plugin separat ColorZilla).
Depanare Bara de depanare pentru Internet Explorer
Puteți descărca DebugBar pentru Internet Explorer de la linkul dat.
O extensie interesantă în sine. Instalat ca panou suplimentar pentru browser:
Din anumite motive, există un motor de căutare încorporat, un pipetă, capacitatea de a redimensiona fereastra și, din nou, din anumite motive, capacitatea de a trimite o pagină unui prieten pentru săpun. Deși ar putea fi util. Dar nu am reușit să profit de această oportunitate.
În plus, există un inspector:
Metoda de inspecție prin clic sau indicare nu s-a potrivit dezvoltatorilor: au venit cu un lucru mai interesant. În DebugBar, trebuie să trageți ținta către elementul dorit pentru a o vedea în arbore. Nu există nicio opțiune de a edita CSS. Dar există un validator și o consolă js încorporată.
Și dacă cercetați setările, puteți găsi asta:
Atat amuzant cat si trist.
Se știe că Bara de instrumente pentru dezvoltatori va fi încorporată în al optulea explorator. Va fi asemănător cu cel descris în al treilea paragraf, dar sperăm că va fi mai bine.
Depanați DragonFly pentru Opera
DragonFly a fost încorporat în Opera începând cu versiunea 9.5, deci nu este nevoie să îl instalați. Pentru a activa Dragonfly, accesați Instrumente → Avansat → Instrumente pentru dezvoltatori. Și dacă este în engleză, atunci Instrumente → Avansat → Instrumente pentru dezvoltatori.
Vă voi avertiza imediat că DragonFly este în stadiul Alpha2, asta explică multe dintre erorile sale.
Lista de caracteristici:
- inspector DOM;
- Faceți clic pe Inspecție (din nou, nu vom vedea umplutură ca în FireFox);
- Editare;
- Acces rapid la consola de erori.
DF este ceva ca o pagină separată într-un cadru. Dacă îl deschideți, acesta va fi deschis pentru toate filele (spre deosebire de firebug). Prin urmare, înainte de a inspecta un element, trebuie să selectăm pagina pe care dorim să o vizualizam din listă.
Din păcate, aici, ca și în Internet Explorer, Bara de instrumente Dav nu afișează elemente create dinamic. Și, în general, atunci când inspectăm pagina, nu se rulează JavaScript: nu se face clic pe link-urile și butoanele. Să sperăm că atunci când DragonFly se va apropia de lansare, vom vedea toate aceste caracteristici.
Depanați inspectorul WEB în Safari
Voi spune imediat asta despre browser safari Am fluierat informația, așa că, după cum se spune, nu sunt responsabil pentru caracterul adecvat al materialului.
Pentru a activa elementul „Dezvoltare” din meniul Safari, trebuie să activați elementul corespunzător în setări (fila „Avansat”):
Următoarele funcții ne sunt disponibile în meniul „Dezvoltare”:
Să aruncăm o privire mai atentă la inspectorul WEB:
În mod implicit, inspectorul se deschide în modul de vizualizare HTML. Dar poate fi comutat în modul de vizualizare DOM. Pentru a face acest lucru, există un comutator pe placa de sus. Când treceți cu mouse-ul peste un element din inspector, acesta va fi evidențiat pe pagina însăși. Nu puteți vedea umplutură, modificați marcajul sau CSS din mers sau nu puteți vedea modificări dinamice ale DOMe din mers, așa cum nu puteți în FireBug. Dar, vezi tu, arată foarte frumos.
Dacă doriți să lucrați cu inspectorul într-o fereastră de browser, puteți face clic pe butonul din colțul din stânga jos.
Chiar și în safari, este disponibilă o astfel de funcție precum „Cronologia rețelei” (butonul „Rețea” din inspector):
Puteți vedea clar când și cât timp sunt încărcate fișierele. De asemenea, puteți vizualiza antetele solicitărilor, dar, din păcate, nu puteți vizualiza conținutul în sine.
Depanare pentru dezvoltatori în Google Chrome
Lame s-a născut într-o formă avansată și are imediat, deși strâmb pentru moment, dar totuși instrumente pentru dezvoltatori.
- Inspector DOM;
- depanator javascript;
- Consola JavaScript.
Pentru a inspecta un element, faceți clic dreapta pe el și selectați „Vizualizare cod element” în meniul contextual:
Funcționalitatea este aceeași ca în Safari: elementele sunt evidențiate la trecerea cursorului, dar editarea CSS și HTML nu este disponibilă, modificările în DOM nu sunt urmărite. Numai că butonul din colțul din stânga jos, care ar trebui să atașeze inspectorul la fereastra browserului, nu funcționează.
În fila „Resurse”, putem vedea următoarele:
Puțin diferit de scara din safari. Translucide în această diagramă sunt dimensiunile relative ale fișierelor, iar culoarea completă este timpul de descărcare. Într-un fel sau altul, este evident că această parte a Chrome este încă departe de a fi finalizată.
În acest articol, am trecut în revistă cele mai faimoase extensii și instrumente încorporate pentru browsere.
Mai sunt si altele, de exemplu:
- Internet Explorer WEB Development Helper este un bun ajutor pentru dezvoltatorii ASP.NET (Internet Explorer);
- WEB Developer Toolbar - bară de instrumente pentru Internet Explorer și FireFox. Există mai multe caracteristici utile;
- WEB Accessibility Toolbar - bară de instrumente pentru Internet Explorer. Nimic interesant.
Dacă există suplimente pe care nu le-am menționat, dar ar merita, sau există funcții pentru extensiile menționate pe care le-am ratat, scrieți.
Folosește-te pentru sănătate!
Internet Explorer 11 în Windows 8.1 și Windows 7 vine cu un set complet reproiectat și îmbunătățit de instrumente pentru dezvoltatori încorporate în browser pentru a ajuta dezvoltatorii să creeze, să diagnosticheze și să optimizeze site-uri web și aplicații moderne pe multe dispozitive. Noile instrumente, pe care le numim pur și simplu F12 din motive de concizie, permit dezvoltatorilor web să lucreze rapid și eficient.
Grupurile de lucru Visual Studio și Internet Explorer au lucrat împreună pentru a crea instrumentele F12, care se bazează pe principiul de a ajuta dezvoltatorii să treacă rapid de la problemă la soluție folosind date semnificative. Noua suită F12 oferă o experiență web rapidă și flexibilă, cu instrumente pentru diagnosticarea și remedierea problemelor de performanță, precum și instrumente care vă ajută să înțelegeți mai bine modul în care Internet Explorer prezintă și redă aplicațiile web. Instrumentele F12 acceptă fluxul de lucru rapid și interactiv utilizat de dezvoltatorii web de astăzi.
Set universal de unelte
Noul set F12 îi ajută pe dezvoltatori să treacă rapid de la problemă la soluție. Unele dintre noile funcții interesante includ:
- Analiza răspunsului UI și instrumente de profilare a memoriei pentru a ajuta dezvoltatorii să creeze aplicații web rapide și flexibile.
- Live DOM Explorer și verificatorul CSS au fost actualizate cu pagina, astfel încât dezvoltatorii să poată explora interactiv modul în care conținutul dinamic afectează aspectul și stilul
- Abilitatea de a depana JavaScript care se lansează rapid fără a reîmprospăta pagina, astfel încât dezvoltatorii să se poată pune la lucru mai repede
Pe măsură ce utilizați instrumentele F12, veți observa multe alte îmbunătățiri care vă vor ajuta să obțineți un flux de lucru rapid și interactiv:
- Acces rapid la aceste instrumente făcând clic dreapta pe un element de meniu cu „elementul de inspecție”
- Interacțiune eficientă cu tastatura
- Capacitate extinsă de a copia elemente și componente din instrumente, astfel încât acestea să poată fi lipite în orice editor fără formatare suplimentară
Cel mai important, aceste instrumente afișează acum cele mai complete și precise informații disponibile, de la regulile @media și!importante din DOM Explorer până la structura costurilor pe element din UI Response Profiler. Aceste instrumente oferă, de asemenea, date direct semnificative; de exemplu, profilerul de memorie identifică nodurile DOM care sunt „în direct”, dar nu fac referire din marcaj sau arborele de randare.
Capacitățile noii suite F12 sunt disponibile și în Visual Studio, astfel încât dezvoltatorii au o experiență consecventă și perfectă pe toate instrumentele și platformele noastre de dezvoltare web.
Să aruncăm o privire rapidă asupra acestor instrumente în acțiune.
Profilarea aplicațiilor cu UI Responsiveness Analyzer
Instrumentul de răspuns al interfeței de utilizare vă ajută să înțelegeți unde este petrecut timpul CPU, astfel încât aplicația dvs. să își poată atinge potențialul de performanță maxim. Acest instrument vă oferă informațiile de care aveți nevoie pentru a înțelege funcționarea interioară a Internet Explorer, oferind vizualizare în timp de rulare a codului HTML, CSS și JavaScript, precum și efecte secundare importante, cum ar fi marcajul și colectarea gunoiului. Dintr-o privire, puteți vedea exact cât de repede răspunde aplicația dvs. și cum se redă. Acest lucru vă va permite să identificați surse specifice blocajeleși o abordare mai inteligentă a optimizării sale.
Profilarea site-ului web
Analizați utilizarea memoriei aplicației cu Memory Profiler
Acest analizor de memorie vă va ajuta să evitați pierderile de memorie sau consumul excesiv de memorie. Crearea de aplicații web care funcționează pentru clienți non-stop sau complexe aplicații interactiveînseamnă adesea că dezvoltatorul lor trebuie să acorde o atenție deosebită problemelor de utilizare a memoriei.
În timp ce JavaScript este un mediu de colectare a gunoiului, aplicațiile consumă de obicei mai multă memorie pur și simplu pentru că referințele la obiect nu au (și nu pot) fi eliberate. Analizorul de memorie vă ajută să identificați aceste probleme, oferind informații despre fiecare obiect din pagină, indiferent dacă este vorba despre un obiect JavaScript sau DOM. Cu aceste informații puteți, de exemplu, să vedeți câtă memorie este deținută de un element și ce obiecte îi susțin persistența. Dar, cel mai important, puteți compara două instantanee și puteți vedea ce s-a schimbat. Acest lucru vă va permite să înțelegeți de ce aplicația dvs. a folosit mai multă memorie și să corectați această situație.
Instantaneu în grămada care arată elementele DOM dezactivate
Obțineți o înțelegere rapidă a performanței aplicației cu Performance Dashboard
Pentru a vă ajuta să identificați rapid problemele care afectează performanța paginii dvs., Internet Explorer 11 oferă un widget „pagină” numit Performance Dashboard, care este accesat utilizând comanda rapidă de la tastatură Ctrl+Shift+U sau elementul corespunzător din meniu Instrumente ( Alt+T ). Acest panou afișează dinamic statistici în Internet Explorer pentru valori cheie de performanță, cum ar fi timpul de randare, memoria, cadrele pe secundă (fps) și utilizarea procesorului. Tabloul de bord performanță nu necesită utilizarea instrumentelor F12 și poate fi folosit și în browserele moderne.
Cu Tabloul de bord performanță, puteți identifica rapid interacțiunile cu paginile care cauzează scăderi ale ratei cadrelor sau o utilizare ridicată a procesorului. Puteți trece apoi la F12 pentru a reproduce problema și a găsi o soluție.
Inspectarea elementelor și modificarea marcajului și a stilurilor folosind DOM Explorer
DOM Explorer facilitează configurarea interactivă a interogărilor @media și a regulilor CSS și a proprietăților acestora. De aceea interfața cu utilizatorul aplicația dvs. devine o interfață cu mai multe dispozitive foarte receptivă. Puteți începe rapid pe o pagină web făcând clic dreapta și inspectând elementul dorit, care va lansa instrumentele F12 împreună cu acel element selectat în DOM Explorer, afișând dinamic DOM și regulile CSS aplicate. Tabelele DOM și CSS redate sunt dinamice, permițându-vă să înțelegeți cum interpretează Internet Explorer particularitățile marcajului, stilurilor CSS și regulilor dvs. Pe măsură ce interacționați sau modificați pagina folosind DOM Explorer, modificările pe care le faceți vor fi afișate imediat.
Verificați marcajul și stilurile
DOM Explorer facilitează obținerea valorii corecte a unei proprietăți sau proprietăți folosind IntelliSense atunci când se efectuează modificări la un tabel CSS. Puteți vedea cu ușurință ce proprietăți sunt greșite sau nerecunoscute și apoi copiați regula pentru a o aplica din nou la sursa dvs.
Depanarea JavaScript cu Debugger și Console
Noul depanator JavaScript vă oferă instrumentele pentru a localiza și a remedia rapid codul care nu este de încredere. Depanatorul JavaScript poate deschide și vizualiza mai multe fișiere, chiar dacă biblioteca dvs. de scripturi a fost redusă, setează puncte de întrerupere și puncte de urmărire, inspectează obiectele JavaScript, valorile, lanțurile de domeniu și poate vizualiza conținutul stivei. Rularea instrumentelor F12 va lansa și depanatorul JavaScript imediat, astfel încât să puteți începe imediat
În timpul depanării, probabil că veți dori să interacționați cu site-ul dvs. Consola este instrumentul cheie pentru această sarcină. Puteți accesa consola în orice moment, ceea ce face ca utilizarea acestui mediu interactiv cu IntelliSense și instrumente de redare a obiectelor să fie eficientă. Consola oferă, de asemenea, o gamă largă de API-uri specializate care vă permit să înregistrați ieșirea, să analizați timpul petrecut într-un anumit cod și să furnizați instrumente de redare a obiectelor atunci când trebuie să faceți o inspecție profundă a obiectelor JavaScript.
Rezumând
Această postare de blog conține pur și simplu o schiță a descrierii noilor elemente din instrumentele F12. puteți găsi lista plina nou funcţionalitate disponibil pentru dezvoltatori în Internet Explorer 11 în articolul „Ce este nou în Instrumentele F12” și în „Ghidul pentru dezvoltatori de previzualizare a Internet Explorer 11 ”. De asemenea, puteți afla mai multe în demonstrația de testare a Internet Explorer, „F12 Adventure”.
Așteptăm cu nerăbdare feedbackul dumneavoastră și așteptăm cu nerăbdare o colaborare îndelungată cu comunitatea de dezvoltatori. Partajați-vă sugestiile prin instrumentul Feedback și Suggestion din Internet Explorer 11 sau pe site-ul Connect.
P. J. Hough
, Vicepreședinte, Visual Studio
