15 nemokamų „JavaScript“ pavyzdžių fragmentų jūsų svetainėms

Šiomis dienomis „JavaScript“ visur naudojamas tinkle – tinklalapių interaktyvumui pagerinti, informacijai patvirtinti ir (arba) tinklalapių perspektyvoms pagerinti.


„JavaScript“ pirmą kartą pasirodė 1995 m. Ir nuo to laiko nuėjo ilgą kelią kalbant apie jo priėmimą ir kaip jis naudojamas. „JavaScript“ naudojamai sintaksei didelę įtaką darė C; tačiau „Java“, „Pearl“, „Python“ ir „Scheme“ taip pat vaidino savo vaidmenį.

„JavaScrip“ pradedančiųjų patarimai: ką reikia žinoti?

Pradedantiesiems keli pagrindiniai dalykai, kuriuos turite žinoti:

  • „JavaScript“ naršyklėje galima išjungti
  • „JavaScript“ veiks kiekvieną kartą įkeliant puslapį
  • „JavaScript“ reikia laiko, kad įkeltų lėtą interneto ryšį
  • „JavaScript“ vis dar veikia iš talpykloje laikomų puslapių
  • Galite talpinti „JavaScript“ tinklalapyje arba išorėje iš .js failo
  • „JavaScript“ visiškai skiriasi nuo „Java“

Taip pat svarbu suprasti, kad „JavaScript“ iš tikrųjų sukels katastrofą, kai jis bus naudojamas neteisingai.

Prastai sukonfigūruoti ir aptakūs „JavaScripts“ kodai sulėtins jūsų svetainę ir sugadins bendrą naršymą svetainėje. Tai savo ruožtu turi įtakos jūsų lankytojų grąžos rodikliams (dėl blogos vartotojo patirties), taip pat paieškos sistemų reitingavimui (dėl lėto svetainių atsako greičio ir robotų nuskaitymo). Norėdami padėti patvirtinti mano atvejį čia, įsidėkite į žiūrovo batus. Jei svetainė, kurioje lankėtės, buvo įkelta lėtai, buvo sunku naršyti, ir apskritai nepatraukli – ar grįžtumėte į šią svetainę? Aš ne.

Žemiau yra nedidelis sąrašas dalykų, kuriuos reikia apgalvoti pridedant „JavaScript“ į savo svetainę.

  • Ar norint, kad svetainė tinkamai veiktų, reikalingas „JavaScript“?
  • Kaip atrodys svetainė, jei „JavaScript“ bus užblokuota?
  • Ar „JavaScript“ pakenks serverio našumui??
  • Pridėjęs „JavaScript“ padės jūsų svetainė judėti ta linkme, kuria norite?

Ne, aš nesistengiu jūsų atbaidyti šiais klausimais.

Tiesą sakant, nebijokite naudoti „JavaScript“ savo svetainėse, nes tai teikia daug naudos, ir, kaip minėta, ja naudojasi dauguma. Svarbiausias dalykas, kurį bandau peržvelgti, yra ne tik pridėti „JavaScript“ funkcijų į svetainę, kai jos nereikalingos. Kai kurioms svetainėms reikės daugiau „JavaScript“ nei kitoms; kai kuriems tiesiog reikia mažiau – vien todėl, kad tai daro viena svetainė, dar nereiškia, kad turėtum daryti tą patį.

„Freebies“: 15 puikių „JavaScript“ fragmentų jūsų svetainei

Dabar pažiūrėkime į dalykus, dėl kurių čia apsilankėte – žemiau pateiktas 15 „JavaScript“ fragmentų sąrašas, kurie padidins jūsų svetainės funkcionalumą ar išvaizdą. Kodas bus suskaidytas į dvi dalis: galvos ir kūno arba .js failą. Jei nenurodytas joks skyriaus pavadinimas, jis nėra reikalingas tam konkrečiam fragmentui.

1. HTML5 vaizdo įrašo supratimas

Greitas pavyzdys

funkcija supranta_video () {
return !! document.createElement (‘video’). canPlayType; // boolean
}

if (! supranta_video ()) {
// Turi būti senesnė naršyklė arba IE.
// Gal ką nors panašaus paslėpti
// HTML5 valdikliai. Ar koks skirtumas…
videoControls.style.display = ‘nėra’;
}

Ką daro „JavaScript“ fragmentas?

Šis mažas fragmentas neleis jūsų svetainei bandyti rodyti vaizdo įrašo, kurio naršyklė nepalaiko, taupydami pralaidumą ir apdorojimo energiją..

2. „JavaScript“ slapukai

Greitas pavyzdys

/ **

* Nustato slapuką su nurodytu vardu ir verte.

*

* name Slapuko pavadinimas

* vertė Slapuko vertė

* [galiojimo laikas] slapuko galiojimo laikas (numatytasis: dabartinės sesijos pabaiga)

* [kelias] Kelias, kuriame slapukas galioja (numatytasis: iškvietimo dokumento kelias)

* [domenas] Domenas, kuriame galioja slapukas

* (Numatytasis: skambinančiojo dokumento domenas)

* [saugi] loginė reikšmė, nurodanti, ar slapukų perdavimui reikalinga a

* Saugus perdavimas

* /

funkcija setCookie (vardas, vertė, pasibaigia galiojimo laikas, kelias, domenas, saugus) {

document.cookie = vardas + "=" + pabėgti (vertė) +

((baigiasi) ? "; pasibaigia =" + galiojimo laikas.toGMTSstring (): "") +

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

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

((saugus) ? "; saugus" : "");

}

/ **

* Gauna nurodyto slapuko vertę.

*

* name Norimo slapuko pavadinimas.

*

* Grąžina eilutę, kurioje yra nurodyto slapuko vertė,

* Arba negalioja, jei slapuko nėra.

* /

funkcija getCookie (vardas) {

var dc = document.cookie;

var priešdėlis = vardas + "=";

var pradėti = dc.indexOf ("; " + priešdėlis);

if (pradėti == -1) {

pradėti = dc.indexOf (priešdėlis);

if (pradėti! = 0) grąžina nulį;

} Kitas {

pradėti + = 2;

}

var end = document.cookie.indexOf (";", pradėti);

if (pabaiga == -1) {

pabaiga = ilgio ilgis;

}

grąžinti unescape (dc.substring (pradžia + priešdėlis.length, end));

}

/ **

* Ištrina nurodytą slapuką.

*

* slapuko pavadinimas

* slapuko kelias [kelias] (turi būti toks pat kaip kelias, naudojamas kuriant slapuką)

* Slapuko [domenas] domenas (turi būti toks pat kaip domenas, naudojamas kuriant slapuką)

* /

funkcija deleteCookie (vardas, kelias, domenas) {

if (getCookie (vardas)) {

document.cookie = vardas + "=" +

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

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

"; galiojimo laikas = Ketvirtadienis, sausio 1-70 00:00:01 GMT";

}

}

Ką daro „JavaScript“ fragmentas?

Šis fragmentas yra šiek tiek ilgas, bet labai naudingas, jis leis jūsų svetainei saugoti informaciją žiūrinčiojo kompiuteryje, tada perskaityti ją kitu laiko momentu. Šis fragmentas gali būti naudojamas įvairiais būdais skirtingoms užduotims atlikti.

3. Iš anksto įkelkite savo vaizdus

Greitas pavyzdys

var vaizdai = naujas masyvas ();

funkcija preloadImages () {

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

vaizdai [i] = naujas vaizdas ();

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

}

}

preloadImages ("logo.jpg", "main_bg.jpg", "kūno_bg.jpg", "antraštė_bg.jpg");

Ką daro „JavaScript“ fragmentas?

Šis fragmentas neleis jūsų svetainei būti nepatogiai tuo metu, kai joje rodoma tik dalis svetainės; tai ne tik atrodo blogai, bet ir neprofesionalu. Viskas, ką jums reikia padaryti, tai pridėti savo paveikslėlius į skiltį „preloadImages“ ir jūs esate pasirengęs ridenti.

4. El. Pašto patvirtinimas

Greitas pavyzdys

Galva:

funkcija validateEmail (theForm) {
jei (/ ^ w + ([.-]? w +) * @ w + ([.-]? w +) * (. w {2,3}) + $ /. testas (theForm.email-id.value)) {
grįžti (tiesa);
}
budrus("Neteisingas el. pašto adresas! Prašau dar kartą įvesti atsargiai!.");
grįžti (klaidingai);
}

kūnas:

Elektroninio pašto adresas:

Ką daro „JavaScript“ fragmentas?

Šis fragmentas patikrins, ar tinkamai įformuotas el. Pašto adresas įvestas į formą; jis negali garantuoti, kad el. Pašto adresas yra tikras, nėra galimybės to patikrinti naudojant „JavaScript“.

5. Nėra dešiniojo pelės mygtuko paspaudimo

Greitas pavyzdys

funkcija f1 () {
if (document.all) {return false; }
}
funkcija f2 (e) {
if (document.layers || (document.getElementById &! dokumentas.all)) {
if (e.which == 2 || e.which == 3) {return false; }
}
}
if (document.layers) {
document.captureEvents (Event.MOUSEDOWN);
document.onmousedown = f1;
}
Kitas {
document.onmouseup = f2;
document.oncontextmenu = f1;
}
document.oncontextmenu = nauja funkcija ("grąžinti klaidingą");

Ką daro „JavaScript“ fragmentas?

Šis fragmentas neleis žiūrinčiajam dešiniuoju pelės mygtuku spustelėti jūsų puslapio. Tai gali atgrasinti paprastą vartotoją skolintis vaizdų ar kodo iš jūsų svetainės.

6. Rodyti atsitiktines citatas

Greitas pavyzdys

Galva:

writeRandomQuote = function () {
var citatos = naujas masyvas ();
citatos [0] = "Veiksmas yra tikras intelekto matas.";
citatos [1] = "Beisbolas turi didelį pranašumą prieš kriketą, nes greičiau baigsis.";
citatos [2] = "Kiekvienas tikslas, kiekvienas veiksmas, kiekviena mintis, kiekvienas išgyvenamas jausmas, nesvarbu, ar tai būtų sąmoningai, ar nesąmoningai, yra bandymas padidinti savo ramybės lygį..";
citatos [3] = "Gera galva ir gera širdis visada yra puikus derinys.";
var rand = matematikos grindys (matematika.dažnai () * kabučių ilgis);
document.write (citatos [rand]);
}
writeRandomQuote ();

kūnas:

writeRandomQuote ();

Ką daro „JavaScript“ fragmentas?

Gerai, kad tai nėra fragmentas, kurį naudotų visos svetainės, tačiau jis gali būti naudojamas rodyti ne tik atsitiktines citatas. Galite pakeisti turinį ir kabutes į bet ką, ir bet kurioje jūsų svetainės vietoje gali būti rodomi atsitiktiniai vaizdai ar tekstas.

7. Ankstesnės / kitos nuorodos

Greitas pavyzdys

Ankstesnis puslapis | Kitas puslapis

Ką daro „JavaScript“ fragmentas?

Šis fragmentas yra puikus, jei straipsnyje ar vadove yra keli puslapiai. Tai vartotojui leis lengvai naršyti po puslapius. Taip pat išteklių atžvilgiu jis yra mažas ir lengvas.

8. Pažymėkite puslapį

Greitas pavyzdys

Įtraukti į adresyną

Ką daro „JavaScript“ fragmentas?

Šis fragmentas leis vartotojui lengvai pažymėti jūsų puslapį žymėse; viskas, ką jie turi padaryti, yra paspausti nuorodą. Tokios mažos funkcijos kaip ši, gali padidinti jūsų žiūrovų patirtį.

9. Lengva spausdinimo puslapio nuoroda

Greitas pavyzdys

Spausdinti puslapį

Ką daro „JavaScript“ fragmentas?

Ši maža nuoroda leis jūsų vaizdams lengvai atsispausdinti jūsų puslapį. Jis naudoja greito spausdinimo funkciją, kurią jau nustatė jūsų naršyklė, ir nenaudoja resursų, kol nebus spustelėtas.

10. Rodyti suformatuotą datą

Greitas pavyzdys

Galva:

funkcija showDate () {
var d = nauja data ();
var curr_date = d.getDate ();
var curr_month = d.getMonth () + 1; // mėnesiai pagrįsti nuliu
var curr_year = d.getFullYear ();
dokumentas.rašymas (curr_date + "-" + curr_month + "-" + curr_year);
}

kūnas:

showDate ();

Ką daro „JavaScript“ fragmentas?

Šis fragmentas leis rodyti dabartinę datą bet kurioje jūsų tinklalapio vietoje ir jo nereikia atnaujinti. Tiesiog padėkite jį į vietą ir pamirškite.

11. Kablelių atskyriklis

Greitas pavyzdys

Galva:

funkcija addCommas (num) {
num + = ”;
var n1 = num.split (‘.’);
var n2 = n1 [0];
var n3 = n1.length > 1? ‘.’ + n1 [1]: ”;
var temp = / (d +) (d {3}) /;
o (temp.test (n2)) {
n2 = n2.pakeisti (temp, ” + ‘,’ + ”);
}
var out = grįžti n2 + n3;
dokumentas.rašyti (išrašyti);
}

kūnas:

„addCommas“ ("4550989023");

Ką daro „JavaScript“ fragmentas?

Šį fragmentą daugiausia naudotų svetainės, kurios dažnai naudoja numerius. Šis fragmentas leis išlaikyti jūsų numerius vienodus. Viskas, ką jums reikia padaryti, tai nukopijuoti kūno liniją, kur norite pridėti numerį, ir pakeisti numerį ten savo numeriu.

12. Gaukite naršyklės ekrano sritį

Greitas pavyzdys

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