Deci, am aflat deja că principala utilizare a scripturilor JavaScript este pe Internet. Sper ca stii macar in termeni generali. Nu voi vorbi despre asta.
Cel mai simplu site de internet este format din una sau mai multe pagini web (pagini web).
Pentru a utiliza scripturi JavaScript, trebuie să încorporați cumva codul sursă al scriptului în pagina web.
Despre asta vă voi spune astăzi.
Deci, un script în corpul unei pagini HTML poate fi inserat aproape oriunde.
Dacă introduceți o funcție, atunci este mai bine să o plasați în antetul paginii. Adică undeva la mijloc
... .Scriptul în sine este plasat între etichete
Aici ca parametru al etichetei de deschidere
După cum am spus, scriptul poate fi inserat oriunde pe pagină. Cu toate acestea, dacă faceți acest lucru între etichete, atunci codul sursă al scriptului va fi vizibil pentru utilizator. Acest lucru, desigur, este în general inutil.
Pentru a preveni afișarea codului sursă de către browser, codul sursă trebuie scris ca un comentariu de marcare HTML, adică între caractere
Adica cam asa:
Dar mai este un truc. În special browserele proste nu înțeleg simbolul ->. Prin urmare, pentru ca codul să fie garantat să nu fie vizibil pentru utilizator în toate browserele, se recomandă să faceți acest lucru:
NOTĂ
Aproape toate browserele moderne vor funcționa bine chiar dacă nu utilizați caractere de comentariu în marcajul HTML. Cu toate acestea, este mai bine să faceți acest lucru, deoarece utilizatorul poate ajunge cu un browser vechi.
Ei bine, acum pentru un exemplu de pagină HTML simplă cu JavaScript încorporat:
Creați un fișier text, schimbați-i extensia (nu ar trebui să fie txt, ci htm sau html), introduceți textul de mai sus și salvați.
Apoi faceți dublu clic pe acel fișier pentru a rula. Browserul dvs. implicit se va deschide și va apărea mesajul „Primul meu script pe o pagină web!”.
După cum probabil ați ghicit, paginile HTML și scripturile încorporate în ele pot rula pe computerul utilizatorului, chiar dacă nu au o conexiune la Internet. Aceasta înseamnă că ...
ATENŢIE!
Cu JavaScript, puteți scrie programe care rulează pe computerul utilizatorului. Și nu contează ce sistem de operare are! Principalul lucru este că browserul său acceptă scripting. Și nu aveți nevoie de instrumente speciale de dezvoltare care să coste bani nebuni - este suficient doar un editor de text!
Am lansat o nouă carte, „Marketing de conținut pe rețelele sociale: cum să intri în fruntea abonaților și să te îndrăgostești de marca ta”.
Codul sursă al unui site este o colecție de markup HTML, stiluri CSS și JavaScript pe care un browser le primește de la un server web.
Mai multe videoclipuri pe canalul nostru - învață marketing pe internet cu SEMANTICA
Poate fi comparat cu un set de comenzi date soldaților de către comandant. Imaginați-vă că publicul nu poate vedea sau auzi șeful. Din punctul lor de vedere, armata desfășoară acțiuni în mod independent. În cazul nostru, comandantul este browserul, comenzile sunt codul sursă, iar soldații în marș sunt rezultatul final.
Site-ul este stocat pe un server web care trimite pagina la cererea utilizatorului. O solicitare înseamnă introducerea unei adrese URL într-o bară de adrese, clic pe un link sau clic pe un buton de trimitere dintr-un formular. Nu contează în ce limbă sunt scrise paginile web, dacă includ cod. Rezultatul final al oricărui algoritm de pe partea serverului este un set de etichete HTML și text.
Codul sursă al unei pagini este un set de date care include:
- markup html;
- foaie de stil sau link la fișier;
- programe scrise în JavaScript sau link-uri către fișiere cu cod.
Aceste trei secțiuni sunt gestionate de browser. Pentru server, acesta este pur și simplu text care trebuie trimis ca răspuns la o solicitare.
De ce ar putea fi nevoie să studiem codul sursă
Tot ceea ce vedem, putem analiza și aplica pentru a rezolva anumite probleme care apar în timpul lucrului cu site-ul, mai ales la optimizarea acestuia. Privind codul sursă, putem:
- Vedeți metaetichetele site-ului dvs. sau al altcuiva pentru a le analiza.
- Vedeți prezența sau absența anumitor elemente pe site: contoare, coduri de identificare în diverse sisteme, anumite scripturi și multe altele.
- Aflați parametrii elementelor: dimensiuni, culori, fonturi.
- Găsiți calea către fotografii și alte elemente pe pagină.
- Explorați linkurile din pagină.
- Găsiți probleme cu codul care interferează cu procesul de optimizare a site-ului web: stiluri, scripturi, cod nevalid care nu este inclus în fișiere separate.
Acestea sunt caracteristici de bază, dar, de fapt, știind cum să citiți codul, puteți afla multe mai multe despre pagină.
Cum să vizualizați codul sursă al site-ului
Complet în forma în care este postat pe server, acest lucru nu se poate face din browser. Dar puteți vedea toate marcajele făcând clic dreapta pe pagină. În continuare, folosind exemplul Google Chrome.
Selectăm opțiunea „Vizualizare codul paginii” și obținem lista completă într-o filă separată.
Este doar un text care va trebui analizat pentru a înțelege. Dar puteți obține cod interactiv folosind instrumentele pentru dezvoltatori.
Cum să găsiți codul sursă al unei pagini de site
Faceți clic pe pictograma meniului din browser. Cel mai adesea este în dreapta și arată ca trei puncte sau dungi.
În secțiunea de instrumente suplimentare, selectați „Instrumente pentru dezvoltatori”.
Se va deschide o fereastră care arată starea activă a codului. Aceasta înseamnă că atunci când faceți clic pe marcaj, stilul elementului va fi afișat lângă acesta, iar blocurile selectate vor fi evidențiate pe pagină.
În fila „Sursă”, puteți vizualiza conținutul unor fișiere: scripturi, fonturi, imagini.
Verificarea certificatului de site este disponibilă în fila „Securitate”.
Fila „Audituri” vă va ajuta să verificați resursa postată pe găzduire.
Dacă locația panoului din dreapta este incomodă, puteți face clic pe trei puncte și îl puteți modifica selectând elementul dorit.
Cum să vizualizați metaetichetele
Fiecare document html include etichete de structură. Aici sunt câțiva dintre ei:
- HTML - întreg documentul.
- Head - secțiune de anteturi de serviciu.
- Titlu - titlul paginii (afisat pe fila).
- Corp - corpul documentului.
- H1-H6 - anteturile textului paginii.
- Articol – articol.
- Sectiune - sectiune.
- Meniu - meniu.
- Div - bloc.
- Span este un șir.
- P - paragraful.
- Masa - o masă.
Elementele sunt destinate delimitării logică a secțiunilor din pagină; dacă este necesar, sunt stilizate. Acestea conțin text care este cumva vizibil pe pagină. Dar eticheta Head conține informații de serviciu. Meta-etichetele sunt folosite pentru a o indica. Tot ceea ce este scris în ele este destinat serverului și motoarelor de căutare.
Este imposibil să aflați conținutul lor în alt mod.
Să acordăm atenție etichetei Link. Cu ajutorul acestuia, sunt indicate legături către fișiere de includere externe. Dacă doriți, puteți vedea conținutul și puteți salva pe disc. Pentru a face acest lucru, treceți cursorul peste adresă și apăsați RMB. Selectați „Deschideți într-o filă nouă”.
Fișierul specificat se va deschide într-o filă nouă și poate fi vizualizat sau salvat.
Cum să vizualizați codul sursă al unei pagini pentru depanarea unui script
În acest caz, cel mai convenabil este să deschideți pagina pe mașina locală. Dacă trebuie doar să remediați marcajul, stilurile și scripturile, atunci o puteți face chiar din folder. Codul html este vizualizat în același mod. Cu toate acestea, erorile de cod JavaScript pot fi văzute în fila „Consolă”. Afișează o descriere a erorii și numărul liniei pe care a apărut.
Sintaxa poate fi văzută direct în cod. Fila „Sursă” este destinată acestui lucru.
Cum să vizualizați codul unui anumit articol
Pentru paginile mari cu o mulțime de elemente, este dificil să găsești codul dorit în toate markupurile. În acest caz, ar trebui să utilizați o comandă specială a meniului contextual. Treceți mouse-ul peste fragment și apăsați RMB. Să selectăm comanda „Vizualizare cod”.
Se va deschide aceeași fereastră, dar cu accent pe obiectul selectat.
rezumat
V-am spus care este codul sursă al paginii. Este suficient să stăpâniți cunoștințele de bază despre HTML și CSS și, folosind instrumente convenabile pentru dezvoltatori, vă puteți depana propriile documente html.
Răsfoirea codului de resurse pe Internet vă va permite să învățați nu numai din propria experiență, ci și să folosiți exemple reale de lucru. Iar pentru specialiștii în seo vor fi utile meta tag-urile, informațiile în care pot spune multe despre site.
Este foarte simplu - doar faceți clic dreapta pe el și selectați elementul corespunzător din meniul contextual. Formularea poate diferi în funcție de browserul utilizat: în Mozilla Firefox se numește „Sursă”, în Apple Safari – „Vizualizare sursă”, în Google Chrome – „Vizualizare codul paginii”, în Opera – „Codul sursă”, în Internet Explorer - „Vizualizarea codului HTML”.
Codul sursă al scripturilor server-side care generează codul HTML al paginii atunci când software-ul serverului este configurat corect nu va putea primi o solicitare simplă. Puteți vizualiza codul sursă al scripturilor PHP sau Perl doar prin descărcarea fișierelor acestora folosind protocolul FTP sau prin managerul de fișiere al panoului de control al găzduirii sau al sistemului de management al conținutului. Puteți deschide astfel de fișiere cu un editor de text obișnuit.
Codul sursă al scripturilor la nivelul clientului care sunt executate direct în browser (de exemplu, JavaScript) poate fi vizualizat prin preluarea fișierelor acestora din memoria cache a browserului. Și chiar mai ușor - salvați pagina cu toate fișierele însoțitoare într-o anumită locație. În acest caz, nu trebuie să dezgropați tot ce este stocat în cache. Pentru a face acest lucru, în orice browser, apăsați combinația de taste CTRL + S, apoi selectați „Pagina web completă” în câmpul „Salvare ca tip”. De asemenea, puteți deschide fișiere cu extensia js care conțin codul sursă al scriptului cu un editor de text obișnuit.
Codul sursă al filmelor Flash pe care browserul le descarcă pe computer nu este atât de ușor de vizualizat. Browserul nu primește codul sursă, ci doar versiunea sa compilată - codul executabil. Cu toate acestea, există programe de decompilare care sunt capabile să efectueze procedura de conversie inversă. De exemplu, Flash Decompiler Trillix se integrează în browser și vă permite să extrageți un obiect Flash dintr-o pagină și să îl salvați. După deschiderea blițului în decompiler, veți avea acces la componentele sale individuale - imagini, scripturi, sunete etc. Desigur, acest cod nu va corespunde pe deplin surselor autorului, ci doar cu un grad suficient de acuratețe pentru a funcționa.
„Sursa” este cel mai adesea numită codul unui program într-un limbaj de programare care poate fi citit de om (la nivel înalt). Cu acest cod, puteți face modificări în program (script, film flash, aplicație java, program de aplicație etc.). Autorul sau distribuitorul programului însuși decide dacă distribuie codul sursă împreună cu produsul finit. Există o întreagă clasă de aplicații care sunt distribuite „open source”, codul sursă al altor programe (de exemplu, scripturi JavaScript sau pagini HTML), prin definiție, nu pot fi ascunse, iar codul sursă al altor programe este supus la dreptul de autor.
Instrucțiuni
Obțineți codul sursă al aplicației open source de pe site-ul web al autorului sau distribuitorului acestui produs software. De obicei, puteți afla adresa site-ului în secțiunea din meniu cu numele „Ajutor”, dacă selectați elementul „Despre” din acesta.
Faceți clic dreapta pe o pagină web dacă doriți să accesați codul sursă. În orice browser, meniul contextual derulant va conține comanda vizualizare sursă, deși formularea acesteia poate diferi ușor. Puteți face fără meniul contextual - combinația de taste ctrl + u dublează apelul la comanda vizualizare sursă. Unele dintre browsere au instrumente de navigare încorporate (Mozilla Firefox, Google Chrome), altele folosesc programe externe pentru aceasta - cel mai adesea Notepad. Puteți salva sursa paginii obținută în acest fel într-un fișier.
Natasha 31 octombrie 2011 la 03:10JavaScript: Ascundeți scriptul de privirile indiscrete
- Cameră de depozitare *
Ți-ai dorit vreodată să ascunzi de străini pe pagina ta un script care implementează un aspect nerealist de frumos al unui meniu sau care efectuează alte acțiuni pe care nu ai vrea să le vezi curând pe fiecare al doilea site?
Dacă da, atunci metoda descrisă în acest articol vă va fi utilă împreună cu ofuscarea codului. În același timp, voi face imediat o rezervă că metoda nu este 100 la sută, dar s-ar putea să protejeze de majoritatea neprofesioniștilor și de unii profesioniști.
Teorie
Să presupunem că avem o pagină nojs.php cu un script secret.js care trebuie ascuns. Browserul și utilizatorul pot obține scriptul de pe server în următoarele moduri:- Încărcarea unui script plasat direct pe pagină sau încărcat folosind DOM;
- Vizualizarea scriptului în fereastră Codul sursă al paginii;
- Salvarea unei pagini cu toate fișierele pe hard disk;
- Introducerea unui URL direct în bara de adrese.
În al doilea și al treilea caz, nu este transmis de toate browserele (Chrome, FireFox emit scriptul încărcat anterior din cache; Opera, IE descarcă din nou scriptul, dar fără a trimite un referer).
În al patrulea caz, refererul nu este trecut de niciunul dintre cele patru browsere.
Dacă emitem JavaScript în mod dinamic cu o verificare a prezenței antetului referitor în cerere, atunci ne vom proteja imediat de Opera și IE, dar pentru Crome și Firefox va trebui să venim cu ceva complicat. Mai întâi vom descărca un script, care la rândul său va descărca un alt script, în timp ce ambele descărcări vor fi verificate pentru prezența http-referer. S-a stabilit științific că, dacă creați dinamic un script pe pagina document.createElement ("script") și apoi îl eliminați din pagină, scriptul va funcționa ca de obicei, dar nu va fi salvat.