Cum se deschide consola google chrome. Dar care este memoria cache și de ce ar trebui să-l ștergeți

Browserul de la binecunoscuta corporație rusă Yandex este unul dintre cele mai populare browsere de pe internetul vorbitor de limbă rusă. Își datorează popularitatea funcționalității avansate și a abundenței de caracteristici ascunse, dintre care multe sunt folosite de profesioniști în acest proces.

Aceste instrumente includ consola, care este foarte des folosită pentru a găsi și remedia erorile în browser, precum și pentru a efectua o serie de alte sarcini.

Caracteristicile consolei

Înainte de a vă da seama cum să deschideți consola într-un browser Yandex, ar trebui să decideți ce este și pentru ce poate fi folosit un astfel de instrument. După cum știți, browserul Yandex a fost dezvoltat pe baza altor două proiecte deja existente, și anume Chrome, care a permis dezvoltatorilor săi să implementeze o serie de dezvoltări în propriul browser. În aceste programe a apărut consola, care poate fi folosită pentru a rezolva o gamă largă de sarcini.

Acestea includ:

• Dezvoltare de pagini web;
• Vizualizați codurile site-urilor încărcate;
• Verificarea performantei scripturilor;
• Identificarea erorilor și defecțiunilor site-urilor.

IMPORTANT! Ținând cont de importanța unor astfel de sarcini, putem numi cu încredere consola unul dintre instrumentele principale pentru un dezvoltator web.

În acest sens, este extrem de important să învățați cum să deschideți un astfel de instrument folosind capacitățile browserului. Cu toate acestea, trebuie avut în vedere faptul că un utilizator nepregătit care nu are abilitățile adecvate pentru a lucra cu astfel de instrumente ar trebui să aibă grijă să nu perturbe performanța browserului.

Cum se deschide?

Puteți deschide consola în acest browser în două moduri simultan. Primul este grafic, implicând utilizarea meniului principal al browserului, în timp ce al doilea implică utilizarea tastelor rapide. Pentru începători, primul pare a fi cel mai potrivit.

SFAT! Pot fi dificil de reținut pentru începători, dar utilizarea lor vă permite să accesați instrumentul potrivit mult mai rapid.

Există mai multe console în acest browser și fiecare servește la rezolvarea unor probleme specifice. Pentru a le accesa folosind metoda grafică, trebuie să apăsați un buton special care arată ca trei dungi orizontale, apoi selectați secțiunea Adițional. În ea, ar trebui să accesați categoria Instrumente suplimentare, după care va trebui să selectați consola dorită.

Taste rapide

Pentru a economisi timp, este foarte convenabil să folosiți tastele rapide în timp ce browserul rulează, deoarece vă permit să vă deplasați mult mai rapid la elementul sau meniul dorit. Același lucru este valabil și pentru console, fiecare dintre ele având propriile taste de scurtătură individuale pentru invocare.

Deci, pentru a examina codul sursă al paginii vizualizate în prezent, trebuie să apăsați Ctrl + U, care va deschide imediat acest instrument. Pentru a accesa instrumentele pentru dezvoltatori, trebuie să apăsați trei taste simultan: Ctrl + Shift + I. Capacitățile sale, de regulă, nu sunt de interes pentru utilizatorul mediu care nu este implicat în dezvoltarea paginilor web sau a aplicațiilor.

Consola este poate cea mai importantă, deoarece este responsabilă de funcționarea diferitelor elemente scriptate de pe pagină. Orice publicitate, aplicații interactive și alte tipuri de conținut sunt controlate de scripturi, ceea ce face dificilă supraestimarea capabilităților acestei console. Pentru a-l accesa, apăsați Ctrl + Shift + J, ceea ce vă va permite să vizualizați codurile care au fost folosite pe pagină.

Video pentru a ajuta

Yandex poate fi util nu numai pentru căutarea convenabilă a informațiilor și citirea site-urilor de internet interesante, ci și pentru crearea acestor resurse.

În acest scop, este echipat cu o funcție specială „Instrumente de dezvoltare” (disponibilă acum în toate browserele). Acesta ajută un utilizator Yandex să monitorizeze starea site-ului său web:

• prin vizualizarea codului HTML al paginii;
• urmărirea executării comenzilor solicitate de vizitatori;
• observarea tuturor acțiunilor care au loc asupra resursei;
• învățând despre erorile comune care apar la rularea scripturilor.

Cum pot deschide consola în Yandex?

Este ușor să deschideți consola în Yandex. Pentru a face acest lucru, trebuie să urmați acești pași:

• Accesați browserul dvs.
• Faceți clic pe meniul de acces rapid (butonul „Setări browser Yandex” din colțul din dreapta sus al panoului de control, o pictogramă sub forma a trei dungi paralele orizontale).
• Derulați în jos până la ultimul element din listă care se deschide sub numele „Avansat” sau „Avansat” (în engleză „Avansat”).
• Se va deschide o nouă listă, găsiți articolul „Mai multe instrumente” (în engleză „Mai multe instrumente”).
• Apoi, trebuie să alegeți între trei funcții: Afișați codul paginii, Instrumente pentru dezvoltatori și Consola JavaScript.

Cum să deschideți rapid consola în Yandex?

Dacă doriți să utilizați mai rapid funcțiile browserului enumerate, puteți utiliza tastele rapide:

• Pentru a vizualiza codul paginii, apăsați simultan tastele „Ctrl” și „U”.
• Pentru a utiliza Instrumentele pentru dezvoltatori, apăsați simultan pe Shift, Ctrl și L.
• Pentru a deschide consola și a vizualiza jurnalele de erori în timpul funcționării scripturilor, apăsați simultan tastele „Shift”, „Ctrl” și „J”.

De ce am nevoie de o consolă Java Script?

Consola oferă utilizatorilor de browser Yandex capacitatea de a monitoriza calitatea muncii efectuate de scripturile care sunt postate pe resursele de Internet care sunt vizualizate. Cu ajutorul acestei funcții, dezvoltatorii web monitorizează activitatea scripturilor scrise, scapă de erorile care apar. Cu consola, puteți urmări lucrul pas cu pas al scripturilor, execuția fiecărui element din codul programului.

Pentru utilizatorii obișnuiți ai browserului Yandex, datele conținute în consola care se deschide nu sunt deosebit de utile (deoarece aceste informații nu sunt solicitate pentru ei). Dar, în unele cazuri, știi cum să-l folosești te poate ajuta. Dacă vreo resursă de internet funcționează defectuos pentru dvs., apar adesea mesaje de eroare, în general, nu puteți utiliza site-ul, contactați suportul tehnic, unde vă vor explica cauza și soluția problemei.

API-ul pentru linia de comandă Chrome DevTools conține multe funcții convenabile pentru realizarea unor sarcini simple: selectarea și inspectarea elementelor DOM, afișarea datelor într-un format care poate fi citit, rularea și validarea unui profiler și monitorizarea evenimentelor DOM.

Notă: acest API este disponibil numai în interiorul consolei. Nu puteți accesa linia de comandă API din scripturile de pe pagină.

$_

$ _ returnează valoarea ultimei expresii executate.

Exemplul de mai jos execută o expresie simplă (2 + 2). Apoi se execută $ _, căruia i se atribuie aceeași valoare:

În acest exemplu, expresia executată conținea o matrice de nume. Executarea $ _. Length va da lungimea matricei, iar expresia $ _ în sine va lua valoarea ultimei expresii executate, care este 4:

$0 – $4

Comenzile $ 0, $ 1, $ 2, $ 3 și $ 4 funcționează ca legături către ultimele 5 elemente DOM care au fost vizualizate în panoul Elemente sau către ultimele 5 obiecte heap JS care au fost selectate în panoul Profiluri. $ 0 returnează ultimul element sau obiect selectat, $ 1 returnează cel dinaintea acestuia și așa mai departe.

În exemplul de mai jos, în panoul Elemente, este selectat un element din clasa medie. În consolă, $ 0 a căpătat același sens:

În imaginea de mai jos, este selectat un alt articol de pe aceeași pagină. 0 USD se referă acum la acest articol și 1 USD la cel precedent:

$ (selector)

$ (selector) returnează o referință la primul element DOM cu selectorul CSS specificat. Această funcție este prescurtarea pentru document.querySelector ().

Faceți clic dreapta pe rezultat și selectați „Afișare în panoul de elemente” pentru a găsi un element în DOM sau „Derulați la vizualizare” pentru a-l vedea pe pagină.

Notă: Dacă utilizați biblioteci precum jQuery care folosesc simbolul $, atunci funcționalitatea acelei biblioteci va fi folosită.

$$ (selector)

$$ (selector) returnează o matrice de elemente care conțin selectorul specificat. Această comandă este echivalentă cu apelarea document.querySelectorAll ().

Următorul exemplu folosește $$ () pentru a crea o matrice cu toate elementele în document și returnează proprietatea src a fiecărui element:

Var imagini = $$ ("img"); pentru (fiecare în imagini) (console.log (images.src);)

Notă: Apăsați Shift + Enter în consolă pentru a merge la o nouă linie fără a executa scriptul.

$ x (cale)

$ x (cale) returnează o matrice de elemente care se potrivesc cu expresia XPath dată.

Acest exemplu va returna toate elementele

$ x ("// p")

Și acesta este toate elementele

Element care contine :

$ x ("// p [a]")

clar ()

clear () șterge istoricul consolei.

Clar ();

copie (obiect)

copy (obiect) copiază reprezentarea în șir a obiectului specificat în clipboard.

Copiere ($ 0);

depanare (funcție)

Când această funcție este apelată, este apelat depanatorul, ceea ce vă permite să treceți prin ea în panoul Surse.

Depanare (getData);

Utilizați undebug (fn) pentru a opri depanarea sau interfața pentru a elimina toate punctele de întrerupere.

dir (obiect)

dir (obiect) afișează o listă cu toate proprietățile obiectului specificat. Această metodă este un înlocuitor pentru metoda console.dir ().

Următorul exemplu arată diferența dintre apelarea document.body pe linia de comandă și utilizarea dir () pentru a afișa același element:

document.corp; dir (document.corp);

Consultați secțiunea console.dir () din API-ul Console pentru mai multe informații.

dirxml (obiect)

dirxml (obiect) redă reprezentarea XML a obiectului specificat. Această metodă este echivalentă cu metoda console.dirxml ().

inspectați (obiect/funcție)

inspect (obiect/funcție) se deschide și selectează elementul sau obiectul specificat în panoul corespunzător: Elemente sau Profile.

Acest exemplu deschide document.body în panoul Elemente:

Inspectați (document.corp);

Când este transmis unei funcții, acesta deschide documentul în panoul Surse.

getEventListeners (obiect)

getEventListeners (obiect) returnează toți ascultătorii de evenimente atașați la obiectul specificat. Valoarea returnată este un obiect care conține matrice pentru toate tipurile de evenimente găsite (de exemplu, „click” sau „keydown”). Elementele fiecărei matrice sunt obiecte care descriu ascultătorul fiecărui tip. De exemplu, următorul exemplu va afișa toți ascultătorii de evenimente pentru obiectul document:

GetEventListeners (document);

Dacă la un obiect sunt atașați mai mult de un ascultător, atunci matricea conține elemente pentru fiecare dintre ele. De exemplu, aici doi ascultători pentru evenimentul „mousedown” sunt atașați elementului #scrollingList:

Puteți vizualiza proprietățile fiecăruia dintre aceste obiecte:

chei (obiect)

keys (obiect) returnează o matrice de nume de proprietăți obiect. Utilizați valorile () pentru a obține valorile proprietăților.

Să presupunem că aplicația dumneavoastră declară următorul obiect:

Var player1 = ("nume": "Ted", "nivel": 42)

Lăsați jucătorul1 să fie declarat global, apoi cheile (player1) și valorile (player1) vor scoate următoarele:

monitor (funcție)

Când funcția specificată este apelată, pe consolă este afișat un mesaj care spune că această funcție a fost apelată cu argumentele corespunzătoare.

Funcția sumă (x, y) (retur x + y;) monitor (suma);

Utilizați unmonitor (funcția) pentru a anula.

monitorEvents (obiect,)

Când unul dintre evenimentele specificate are loc pe obiectul specificat, obiectul Event este scris în consolă. Puteți specifica un anumit eveniment, o serie de evenimente sau unul dintre „tipurile” de evenimente. Vezi exemple de mai jos.

Următoarea solicitare monitorizează toate modificările aduse dimensiunii obiectului fereastră.

MonitorEvents (fereastră, „redimensionare”);

Această solicitare monitorizează toate evenimentele de „redimensionare” și „defilare” de pe obiectul fereastră:

MonitorEvents (fereastră, [„redimensionare”, „defilare”)

De asemenea, puteți seta unul dintre „tipurile” disponibile de evenimente din tabelul de mai jos:

De exemplu, această interogare monitorizează toate evenimentele de tip „cheie” de pe elementul selectat din panoul Elemente:

MonitorEvents ($ 0, „cheie”);

Iată un exemplu de rezultat după tastarea caracterelor într-o casetă de text:

profile () și profileEnd ()

Pentru a începe profilarea:

Profil („Profilul meu”)

A termina:

ProfileEnd ("Profilul meu")

Profilurile pot fi, de asemenea, imbricate:

Profil ("A"); profil („B”); profileEnd ("A"); profileEnd ("B");

Rezultat:

Notă: Profilele pot rula simultan și nu trebuie să fie închise în ordinea creării.

tabel (date)

Ieșirea datelor obiect în format tabel. De exemplu, pentru a afișa o listă de nume, trebuie să faceți următoarele:

Nume de var = (0: (prenume: „John”, prenume: „Smith”), 1: (prenume: „Jane”, prenume: „Doe”)); tabel (nume);

undebug (funcție)

undebug (funcție) oprește depanarea funcției specificate.

Undebug (getData);

unmonitor (funcție)

unmonitor (funcție) oprește monitorizarea funcției specificate.

Unmonitor (getData);

unmonitorEvents (obiect,)

unmonitorEvents (obiect,) oprește monitorizarea obiectului și evenimentelor specificate:

UnmonitorEvents (fereastră);

De asemenea, puteți opri monitorizarea evenimentelor individuale:

MonitorEvents ($ 0, „mouse”); unmonitorEvents ($ 0, „mousemove”);

valori (obiect)

values ​​(obiect) returnează o matrice care conține valorile tuturor proprietăților obiectului specificat.