Cum să copiați codul de pe site-uri web folosind Chrome, Firefox și Edge

Crearea unui site web de la zero vă poate lăsa să vă zgârieți capul, în funcție de complexitatea proiectului. Această abilitate consumatoare de timp poate dura luni sau ani pentru a stăpâni. Drept urmare, majoritatea programatorilor profesioniști au dezvoltat procese și comenzi rapide pentru a-și perfecționa abilitățile.

Aceasta include păstrarea unei liste la îndemână a celor mai populare și repetitive coduri de programare. În acest articol, veți învăța un alt truc care vă permite să copiați în mod responsabil codul site-ului web folosind browsere populare precum Chrome, Firefox și Edge. Poate fi o resursă de învățare neprețuită, oferind exemple de cod completat.

Cum să copiați codul de pe site-uri web folosind Chrome

Puteți copia codul de pe un site web folosind următoarele metode pe Chrome.

Prin sursa paginii

Aceasta este probabil cea mai bună și mai ușoară modalitate de a accesa întreaga bază de cod a unui site web sau a unei pagini web, indiferent de browser. Pentru a vedea sursa paginii în Chrome, accesați site-ul web țintă și faceți clic dreapta pe orice parte a paginii, în afară de linkuri, imagini sau anunțuri.

Clic Vezi sursa paginii sau pur și simplu apăsați Ctrl + U (Windows, Linux) sau Comanda + U (macOS). Copiați porțiunea de cod pe care o doriți sau tot și inserați-o în editorul de cod preferat.

Prin comanda rapidă F12

Puteți accesa cu ușurință Instrumentele pentru dezvoltatori Chrome accesând un site web și apăsând pur și simplu F12. Chrome Developer Tools găzduiește codul site-ului web și funcționează ca instrument de depanare pentru dezvoltatori.

Selectați tot codul dorit, copiați-l și inserați-l într-un editor de cod la alegere.

O altă modalitate de a intra în panoul Instrumente pentru dezvoltatori Chrome este prin instrumentul Inspect. Pentru a face acest lucru, vizitați site-ul web țintă de pe care doriți să copiați codul. Acum, apăsați Ctrl + Shift + I (Windows, Linux) sau Comandă + Opțiune + I (macOS), aceasta vă va duce direct la Dev Tools.

Alternativ, faceți clic dreapta pe orice parte clară a paginii și selectați Inspecta din opțiunile de meniu, chiar sub opțiunea de a vizualiza sursa paginii.

Prin meniul Mai multe acțiuni din Chrome

O altă modalitate de a explora codul site-ului prin intermediul Instrumentelor Dev în Chrome este să faceți clic pe butonul cu trei puncte din colțul din dreapta sus al site-ului țintă. Din opțiunile de meniu, selectați Mai multe unelte, apoi Instrumente de dezvoltare.

Copiați tot codul dorit și inserați-l în orice editor de cod la alegere. De asemenea, pe lângă faptul că este un instrument de depanare, puteți și utilizați Chrome Dev Tools pentru a face capturi de ecran.

Cum să copiați codul de pe site-uri web folosind Firefox

Iată diferite moduri de a copia codul site-ului web folosind Firefox.

Vezi sursa paginii

Pentru a accesa și copia codul site-ului web în Firefox vizualizând sursa paginii, pur și simplu faceți clic dreapta pe site-ul țintă și faceți clic Vezi sursa paginii.

Alternativ, apăsați Ctrl + U (Windows, Linux) sau Comanda + U (macOS). Copiați tot codul dorit și inserați-l în editorul de cod pe care îl alegeți.

Puteți vizualiza la fel de ușor sursa paginii în Firefox făcând clic pe meniul hamburger cu trei linii, selectând Mai multe unelte, și făcând clic Sursa paginii.

Prin comanda rapidă de la tastatură F12

La fel ca Chrome, puteți accesa codul unui site web în Firefox Dev Tools, apăsând pur și simplu tasta F12 de pe tastatură.

Căutați în jur codul specific pe care îl căutați, acordând o atenție deosebită Editorului de stil. Acum, copiați și inserați tot acel cod în editorul dvs. de cod preferat și lucrați-vă.

Din nou, la fel ca Chrome, puteți accesa în mod egal codul site-ului web în Firefox folosind instrumentul încorporat Inspect. Pentru a face acest lucru, faceți clic dreapta pe orice parte clară a site-ului web țintă și fie apăsați Q sau faceți clic Inspecta. De asemenea, puteți apăsa Ctrl + Shift + I (Windows, Linux) sau Comandă + Opțiune + I (macOS).

După cum s-a explicat, puteți folosi în continuare Editorul de stil pentru a vă găsi drumul până când găsiți codul pe care îl căutați. Apoi copiați și lipiți-l în oricare dintre cele mai bune editori de cod pe care le puteți găsi.

Prin meniul Firefox More Actions

Pentru a copia codul site-ului web în Firefox prin meniul mai multe acțiuni, de pe site-ul al cărui cod doriți să îl copiați, faceți clic pe meniul hamburger cu trei linii din colțul din dreapta sus.

Selectați Mai multe unelte, apoi apasa Instrumente pentru dezvoltatori web. De aici, puteți utiliza fie Inspector, fie Style Editor pentru a copia codul dorit.

Pentru Inspector, utilizați tastele săgeți de pe tastatură sau bara de defilare pentru a naviga în intrări. Pentru Editorul de stil, vă puteți concentra pe anumite elemente rând folosind panoul de navigare din stânga. Când ați găsit ceea ce doriți, inserați codul copiat în editorul de cod și personalizați-l după gustul dvs.

Cum să copiați codul de pe site-uri web folosind Edge

Puteți copia cu ușurință codul site-ului web în diferite moduri folosind Edge, după cum urmează.

Vezi sursa paginii

Pentru a copia codul site-ului web vizualizând sursa paginii în Microsoft Edge, pur și simplu faceți clic dreapta pe orice parte clară a site-ului țintă și selectați Vezi sursa paginii.

Alternativ, puteți apăsa pur și simplu Ctrl + U (Windows, Linux) sau Comanda + U (macOS), copiați porțiunea dorită, inserați-o într-un editor și începeți să personalizați codul.

Prin comanda rapidă de la tastatură F12

Dacă utilizați Edge, puteți copia în mod egal codul site-ului web prin simpla apăsare a tastei F12 când vizitați site-ul web de pe care doriți să copiați codul.

Confirmați alegerea făcând clic Deschideți DevTools. Pe panoul Instrumente de dezvoltare, puteți copia cu ușurință tot codul dorit și vă puteți face munca mai rapidă.

Pentru a copia codul site-ului web folosind instrumentul Inspect de la Edge, accesați site-ul web al cărui cod doriți să-l copiați, faceți clic dreapta pe orice porțiune clară și selectați Inspecta.

De asemenea, puteți apăsa Ctrl + Shift + I (Windows, Linux) sau Comandă + Opțiune + I (macOS). Apoi puteți copia și lipi codul pe care doriți să îl duplicați și să editați.

Prin butonul Mai multe acțiuni din Edge

Edge vă permite, de asemenea, să accesați panoul DevTools prin meniul mai multe acțiuni. Pentru a face acest lucru, accesați site-ul web al cărui cod doriți să îl copiați. Faceți clic pe butonul cu trei puncte din colțul din dreapta sus și faceți clic Mai multe unelte, apoi Instrumente de dezvoltare.

Dacă browserul dvs. nu are oricare dintre aceste opțiuni sau caracteristici, vă recomandăm să verificați dacă este actualizat. Iată cum să verificați și să actualizați Chrome, Firefox și Edge.

Indiferent de abordarea pe care o adoptați și de orice browser bazat pe Chromium pe care îl utilizați (Chrome, Firefox sau Edge), dvs poate căuta anumite fișiere sau elemente făcând clic pe meniul cu trei puncte din panoul Instrumente de dezvoltare și selectând Căutare. Alternativ, apăsați pur și simplu Ctrl + Shift + F (Windows, Linux) sau Comandă + Opțiune + F (macOS).

The Deschide fișierul și Executa comanda opțiunile sunt, de asemenea, utile pentru găsirea codului pe un site web, la fel de mult ca și Editor de stil în Firefox și Elemente în panoul de instrumente de dezvoltare Chrome și Edge.

Rafinați-vă abilitățile utilizând codul site-ului existent

Indiferent dacă utilizați Chrome, Firefox, Edge sau alte browsere web bazate pe Chromium (de altfel), puteți economisi o mulțime de timp și energie prin simpla copiere a codului de pe site-uri web deja existente.

Cu toate acestea, copierea codului site-ului ar trebui să fie făcută numai pentru propria dvs. învățare și pentru a căuta offline. Încercarea de a crea o copie a unui site web existent și de a o publica așa cum este poate duce la încălcarea drepturilor de autor. De asemenea, vă puteți lua codificarea din mers cu editorii de coduri mobile.