15 fragmente JavaScript gratuite pentru site-urile dvs.

JavaScript este folosit oriunde online în zilele noastre – pentru a îmbunătăți interactivitatea site-ului, pentru a valida informațiile și / sau pentru a îmbunătăți perspectivele unui site web.


JavaScript a apărut pentru prima dată în 1995 și a parcurs un drum lung de atunci în ceea ce privește acceptarea și modul în care este folosit. Sintaxa folosită în JavaScript a fost puternic influențată de C; dar Java, Pearl, Python și Scheme au jucat și ei rolul său.

Sfaturi pentru începătorii JavaScrip: Ce trebuie să știți?

Pentru început, câteva elemente de bază pe care trebuie să le cunoașteți sunt:

  • JavaScript poate fi dezactivat în browser
  • JavaScript va rula de fiecare dată când o pagină este încărcată
  • JavaScript necesită timp pentru a se încărca pe o conexiune lentă la Internet
  • JavaScript este încă rulat din paginile din cache
  • Puteți găzdui JavaScript în cadrul unei pagini web sau extern dintr-un fișier .js
  • JavaScript este complet diferit de Java

De asemenea, este important să înțelegem că JavaScript va duce de fapt la un dezastru atunci când este folosit într-un mod greșit.

JavaScript-urile configurate și codate slab vor încetini site-ul dvs. și vor deteriora navigarea generală a site-ului. La rândul său, aceasta afectează rata de rentabilitate a vizitatorilor dvs. (din cauza experienței necorespunzătoare a utilizatorului), precum și a clasamentelor motoarelor de căutare (datorită ratelor de răspuns lente ale site-ului web și a crawling-ului de bot). Pentru a ajuta la validarea cazului meu aici, pune-te în pantofii unui telespectator. Dacă un site web pe care îl vizitai încărcat încet, era dificil de navigat și, în general, nerevizibil – te-ai întoarce pe site? Nu aș face.

Mai jos este o listă mică de lucruri la care să vă gândiți atunci când adăugați JavaScript pe site-ul dvs. web.

  • Este necesar JavaScript pentru ca site-ul să funcționeze corect?
  • Cum va arăta site-ul dacă JavaScript ar fi blocat?
  • JavaScript va dăuna performanței serverului?
  • Adăugarea JavaScript vă va ajuta să vă mutați site-ul în direcția în care doriți să meargă?

Nu, nu încerc să te sperii cu aceste puncte.

De fapt, nu vă fie frică să folosiți JavaScript pe site-urile dvs., deoarece oferă beneficii de tone și, după cum am menționat, este folosit de majorități. Punctul cheie pe care încerc să trec aici este să nu adăugați pur și simplu funcții JavaScript pe un site atunci când acestea sunt inutile. Unele site-uri sunt necesare mai mult JavaScript decât restul; unii au nevoie de mai puțin – Doar pentru că un site face acest lucru nu înseamnă că ar trebui să faceți la fel.

Freebies: 15 fragmente JavaScript minunate pentru site-ul dvs. web

Acum, să trecem la lucrurile pentru care ați venit aici – mai jos este o listă de 15 fragmente JavaScript care vă vor îmbunătăți site-ul, fie în funcționalitate, fie în aspect. Codul va fi defalcat în două secțiuni, capul și corpul sau fișierul .js. Dacă nu este dat un titlu de secțiune, atunci nu este necesar pentru fragmentul respectiv.

1. Înțelegerea HTML5 video

Proba rapidă

funcția înțelege_video () {
return !! document.createElement (“video”). canPlayType; // boolean
}

if (! înțelege_video ()) {
// Trebuie să fie browser mai vechi sau IE.
// Poate face ceva ca ascunderea personalizării
// controale HTML5. Sau orice…
videoControls.style.display = ‘niciunul’;
}

Ce face fragmentul JavaScript?

Acest mic fragment va împiedica site-ul dvs. web să încerce să afișeze un videoclip pe care browserul nu îl poate suporta, economisindu-vă lățimea de bandă și puterea de procesare.

2. Cookie-uri JavaScript

Proba rapidă

/ **

* Setează un Cookie cu numele și valoarea dată.

*

* nume Nume cookie

* valoare Valoarea cookie-ului

* [expiră] Data de expirare a cookie-ului (implicit: sfârșitul sesiunii curente)

* [calea] Calea în care cookie-ul este valid (implicit: calea documentului de apel)

* [domeniu] Domeniu în care cookie-ul este valid

* (Implicit: domeniul documentului de apelare)

* [sigur] Valoarea booleană care indică dacă transmisia cookie necesită a

* Transmisie sigură

* /

function setCookie (nume, valoare, expiră, calea, domeniul, sigur) {

document.cookie = nume + "=" + de evacuare (valoare) +

((Expiră) ? "; expira =" + expir.toGMTString (): "") +

((cale) ? "; path =" + cale : "") +

((domeniu) ? "; domeniu =" + domeniu : "") +

((sigur) ? "; sigur" : "");

}

/ **

* Obține valoarea cookie-ului specificat.

*

* nume Numele cookie-ului dorit.

*

* Returnează un șir care conține valoarea cookie-ului specificat,

* Sau nul dacă cookie-ul nu există.

* /

funcția getCookie (nume) {

var dc = document.cookie;

prefix var = nume + "=";

var begin = dc.indexOf ("; " + prefix);

if (begin == -1) {

begin = dc.indexOf (prefix);

if (begin! = 0) return null;

} altfel {

începe + = 2;

}

var end = document.cookie.indexOf (";", începe);

if (end == -1) {

end = dc.length;

}

return unirii (dc.substring (begin + prefix.length, end));

}

/ **

* Șterge cookie-ul specificat.

*

* numele numelui cookie-ului

* [calea] cale a cookie-ului (trebuie să fie aceeași cu calea folosită pentru a crea cookie)

* Domeniul [domeniu] al cookie-ului (trebuie să fie același cu cel utilizat pentru crearea cookie-urilor)

* /

function deleteCookie (nume, cale, domeniu) {

if (getCookie (nume)) {

document.cookie = nume + "=" +

((cale) ? "; path =" + cale : "") +

((domeniu) ? "; domeniu =" + domeniu : "") +

"; expiră = Joi, 01 ianuarie-70 00:00:01 GMT";

}

}

Ce face fragmentul JavaScript?

Acest fragment este puțin lung, dar foarte util, vă va permite site-ul dvs. să stocheze informații pe computerul spectatorului, apoi să le citească în alt moment. Acest fragment poate fi utilizat în mai multe moduri diferite pentru a îndeplini sarcini diferite.

3. Preîncărcați imaginile

Proba rapidă

imagini var = new Array ();

function preloadImages () {

pentru (i = 0; i < preloadImages.arguments.length; i ++) {

imagini [i] = new Image ();

imagini [i] .src = preloadImages.arguments [i];

}

}

preloadImages ("logo.jpg", "main_bg.jpg", "body_bg.jpg", "header_bg.jpg");

Ce face fragmentul JavaScript?

Acest fragment va împiedica site-ul dvs. să aibă acel moment incomod atunci când este afișat doar o parte a site-ului; acest lucru nu numai că arată rău, dar este și neprofesional. Tot ce trebuie să faceți este să adăugați imaginile dvs. în secțiunea preloadImages și sunteți gata de rulat.

4. Validare prin e-mail

Proba rapidă

Cap:

function validateEmail (theForm) {
if (/ ^ w + ([.-]? w +) * @ w + ([.-]? w +) * (. w {2,3}) + $ /. test (theForm.email-id.value)) {
întoarcere (true);
}
alerta("Adresa email invalida! Vă rugăm să introduceți din nou cu atenție!.");
întoarce (false);
}

Corp:

Adresa de email:

Ce face fragmentul JavaScript?

Acest fragment va valida faptul că o adresă de e-mail formatată corect este introdusă într-un formular, nu poate garanta că adresa de e-mail este reală, nu există nicio modalitate de a verifica asta cu JavaScript.

5. Fără clic dreapta

Proba rapidă

funcția f1 () {
if (document.all) {return false; }
}
funcția f2 (e) {
if (document.layers || (document.getElementById) &! document.all)) {
if (e.which == 2 || e.which == 3) {return false; }
}
}
if (document.layers) {
document.captureEvents (Event.MOUSEDOWN);
document.onmousedown = f1;
}
altfel {
document.onmouseup = f2;
document.oncontextmenu = f1;
}
document.oncontextmenu = funcție nouă ("returnează fals");

Ce face fragmentul JavaScript?

Acest fragment va împiedica telespectatorul să facă clic dreapta pe pagina dvs. Acest lucru poate descuraja utilizatorul obișnuit să împrumute imagini sau cod de pe site-ul dvs..

6. Afișați citate aleatorii

Proba rapidă

Cap:

writeRandomQuote = function () {
var quotes = new Array ();
citate [0] = "Acțiunea este adevărata măsură a inteligenței.";
citate [1] = "Baseball-ul are marele avantaj față de cricket de a fi încheiat mai devreme.";
citate [2] = "Fiecare obiectiv, fiecare acțiune, fiecare gând, fiecare sentiment pe care îl experimentează, fie că este cunoscut conștient sau inconștient, este o încercare de a crește nivelul de pace sufletească..";
citate [3] = "Un cap bun și o inimă bună sunt întotdeauna o combinație formidabilă.";
var rand = Math.floor (Math.random () * quotes.length);
document.write (citate [rand]);
}
writeRandomQuote ();

Corp:

writeRandomQuote ();

Ce face fragmentul JavaScript?

Ok, deci nu este un fragment pe care l-ar folosi toate site-urile, dar poate fi folosit pentru a afișa mai mult decât simple ghilimele aleatorii. Puteți schimba conținutul în mod corespunzător ghilimelelor în orice doriți și aveți imagini sau text aleatoriu afișate oriunde pe site-ul dvs..

7. Link-uri anterioare / următoare

Proba rapidă

Pagina anterioară | Pagina următoare

Ce face fragmentul JavaScript?

Acest fragment este excelent dacă aveți mai multe pagini dintr-un articol sau tutorial. Acesta va permite utilizatorului navigarea între pagini cu ușurință. De asemenea, este mică și ușoară din punct de vedere al resurselor.

8. Marcarea unei pagini

Proba rapidă

Adauga la favorite

Ce face fragmentul JavaScript?

Acest fragment va permite utilizatorului să marcheze pagina dvs. cu ușurință; tot ce trebuie să facă este să facă clic pe link. Micile sale caracteristici de genul acesta vă pot spori telespectatorii în general.

9. Link prin imprimare ușoară

Proba rapidă

Imprima pagina

Ce face fragmentul JavaScript?

Acest mic link vă va permite vizualizările să vă imprimați cu ușurință pagina. Utilizează funcția de imprimare rapidă deja configurată de browserul dvs. și nu utilizează resurse până când nu este făcută clic.

10. Afișați data formatată

Proba rapidă

Cap:

funcție showDate () {
var d = Data nouă ();
var curr_date = d.getDate ();
var curr_month = d.getMonth () + 1; // luni sunt zero
var curr_year = d.getFullYear ();
document.write (curr_date + "-" + curr_month + "-" + curr_year);
}

Corp:

showDate ();

Ce face fragmentul JavaScript?

Acest fragment vă va permite să afișați data curentă oriunde pe pagina dvs. web și nu trebuie să fie actualizate. Pur și simplu puneți-l în loc și uitați de el.

11. Separator de virgule

Proba rapidă

Cap:

function addCommas (num) {
num + = ”;
var n1 = num.split (‘.’);
var n2 = n1 [0];
var n3 = n1.lungime > 1? ” + n1 [1]: ”;
var temp = / (d +) (d {3}) /;
while (temp.test (n2)) {
n2 = n2.replace (temp, ” + ‘,’ + ”);
}
var out = return n2 + n3;
document.write (out);
}

Corp:

addCommas ("4550989023");

Ce face fragmentul JavaScript?

Acest fragment va fi folosit mai ales de site-urile care folosesc numere des. Acest fragment vă va menține numerele la fel de peste tot. Tot ce trebuie să faceți este să copiați linia corpului unde doriți să adăugați un număr și să înlocuiți numărul de acolo cu numărul dvs..

12. Obțineți zona de afișare a unui browser

Proba rapidă

Jeffrey Wilson Administrator

Sorry! The Author has not filled his profile.
follow me
    0
    Like this post? Please share to your friends:
    Adblock
    detector
    map