Kuidas peita elemente HTML-is? Varjatud tekst JavaScript peidetud JavaScripti koodi vaate lehel.

Kirjeldus: On olukordi, kui te ei soovi kogu lehe sisu kohe tagasi võtta. Näiteks sektsioonis " KKK."Et tühistada ainult küsimuste nimed. Ja kui inimene on huvitatud vastusest teatud küsimusele, võib ta avada vastuse ja siis, kui ta kellad, siis sulgege. See loob lehe mugavuse ja selle kompaktsuse. Ja Selleks ma valmistasin lihtsat skript JavaScriptvõimaldades teil avada või varjata konkreetse teksti (üldiselt teatud elemente), see tähendab peidetud tekst JavaScripti.

Tulemus: Klõpsake küsimuse nimel. Kui klõpsate uuesti, siis vastus uuesti kinni.

Küsimus 1.

Vastake number 1.

Küsimus # 2.

Vastake number 2.

JavaScripti kood (sisestus silte vahel ja):

HTML-kood (sisestage sildid ja):

Küsimus 1.



Küsimus # 2.


Ausalt öeldes ei ole see iga arendaja jaoks vajalik, enamasti igasugune JavaScript-kood brauserisse lihtsalt vaadake ja seetõttu ei ole oma koodi peitmiseks erilisi põhjusi. See nii rääkida, nähtav, mida ei saa peidetud. Siiski on poisid, kes on väga häbelikud, et näidata oma koodi kellelegi, arvestades, et seda vara ei saa varastada, öeldes raamatukogusid. Te olete loonud võrguteenuse, mis on spetsiaalselt loonud võimas keerulise raamatukogu, mis täidab teatud toiminguid, ei ole teie teenuse analooge, ei ole teie raamatukogu, ja loomulikult ei tahaks teie skripti iga (arendaja) näha ja teie Näide sarnane, isegi parem. Loomulikult ei ole midagi valesti midagi paremat tehes, see on areng, kuid äritegevuse seisukohast on konkurendid ainult käepärast.

Mis selleks on vaja?

Te peate algoritmi mõistma ainult ja proovige seda parandada ja ma oma kogemusi uuesti proovida, kui ma peidetud skripte tegin. Esimene asi, mida me vajame, on testida ülesande tegelikku (kohalikku) serverit, ma teen seda Denweriga kohalik server.

aga)Testimiseks looge serveris kataloog.
Ma lähen edasi virtuaalne ketas, Mul on see draiv r, mine sinna minna kodukausta

Loo skripti kataloog ja sees luua WWW kaust, siis õnnestub: Avaleht / Script / WWW / - Pärast seda uuendage server (taaskäivitage Denwer)

b) Loo index.php-fail - näiteks see on meie pealeht. Saidi ja siin peame eemaldada peidetud skripte. Ka looge ka kausta "JS" selles kataloogis.

Meie ülesande täitmiseks on vaja Ajaxi taotlusi selleks, et saate kasutada oma ratsionaalseid funktsioone, kuid kui teie projekt kasvab suurustena, mis vajavad eriefektide kasutamist, sündmusi, ühendada raamatukogu ja ma ühendan eelnevalt jquers Kausta põhjas "JS» lisage jquery.js.

Seejärel looge samas kaustas uus kaustSkriptid, mida me peame peitma, salvestatakse selles. Ma nimetan selle "turvalisus":

sisse)Me värvata eelvaate koodi index.php


Nagu näete, on plokk

PHP eeldab teie skriptide lugemise rolli, mis blokeeritakse serveris ja seda ei saa neile rakendada.

Aga kõigepealt loome meie skriptide, mida me tahame varjata.


d) Turvalisuse kausta, luua skripti1.js ja script2.js sellise sisuga vastavalt:


Näiteks piisab! Nüüd, nii et nendega on võimatu ühendust võtta, peate seda serveris küsima, seda tehakse tänu failile.Htaccess.

Htaccess on selle serveri kasutaja poolt määratud konfiguratsioonifail.

Htaccessil on selline sisu:

Pärast seda taotluse korral:

Näete seda:

Seega on teie turvakataloog peidetud silmadelt silmadest, see on kättesaamatu.

Kui proovite skripte ühendada:

Siis igal juhul teie faile ei täideta, sest nad on ülemaailmselt peidetud server

e)Tagasi programmi PHP plokk index.php

Alumine rida on see, et PHP-l on juurdepääs kõigile serverile failidele, olenemata sellest, kas nad on peidetud või mitte, see tähendab, et kui registreerite:


Siis B. sel juhul Me näeme meie peidetud skripti sisu.

Kuid teisest serverist ei saa meie skripti sisu näha ja veateade tagastatakse 500-ni. See on meie käsi, nii et teised saidid ei saa meie peidetud faile lugeda.

e)See näeb välja lõpptulemus:

Ja nüüd me tegeleme sellega, kuidas see kõik toimib. JQuery täidab postituse päringu (see aitab vältida aukude index.php) "index.php? JS \u003d tulemus" server, seal on tšekk, kui taotlus meie server (stros () funktsiooni ja aadress meie aadress meie Server "http: / / script" - C Selle näite arvessevõtmisel kontrollib skript muutujajärgse, st meie peidetud skripti aadressi ja annab tekstitulemuse. JQuery tehtud () Meetod saab selle teksti sisu kujul vastuse ja seda teksti saab konverteerida JavaScripti tööks, muudab see standardne trammide funktsiooni eval ();

Lõpuks

Me saame oma tulemust, meie skriptide ei saa vaadelda staatiliselt või dünaamiliselt brauseri konsooli kaudu, kuid nende töö on lihtne näha. Need skriptid ja nende funktsioonid on kergesti teostatud. Siiski on vaja seda tehnikat rakendada, sest sel juhul tõstatatakse tulemuslikkuse küsimus. Eval (kood) funktsioon javaScripti arendajad Seda peetakse kurjaks ja soovitatakse kasutada selle uue funktsiooni analoogi (edaspidi "tagasi" + kood), kuigi viimane ei tea, kuidas määrata funktsioone sees, st kui funktsioon määratlus salvestatakse teie muutuja , Kood \u003d "funktsiooni test () (hoiatus (1);); Test (); ", kood ei ole täidetud, mis tähendab eval () läheneb kõigile elujuhtumitele, tõde on oma nüanss, mis on veel vaja lugeda.

Kas olete kunagi varjata teie skripti lehekülgede kõrvalistestjate varjamisest, mis rakendab menüü ebarealistlikku ilusat välimust või toimides muid tegevusi, mida te ei taha näha varsti iga teise saidi?
Kui jah, siis on käesolevas artiklis kirjeldatud meetod teile kasulik koos koodeksi menetlusega. Samal ajal ma teen reservatsiooni kohe, et meetod ei ole 100%, vaid kõige mitte-professionaalne ja osa spetsialistid ta kaitseb.

Teooria

Oletame, et meil on Nojs.php leht ja sellel on saladus.js skript, mis peab olema peidetud. Brauser ja kasutaja saavad serverist skripti järgmistel viisidel:
  1. Skripti laadimine otse leheküljel või DOM-i koormatud;
  2. Vaadake aknas skripti Lehe lähtekood;
  3. Lehe salvestamine kõigi kõvakettaga failidega;
  4. Otsese URL-i sisestamine aadressiribale.
Esimesel juhul edastab brauser HTTP-päise http_refereri.
Teisel ja kolmandal juhul edastatakse see kõik brauserid (Chrome, Firefox väljastab vahemälust eelnevalt allalaaditud skripti; ooper, st laaditakse skripti uuesti, kuid ilma viite saatmiseta).
Neljandal juhul ei edastata viiteid ühelegi neljale brauserile.
Kui annate JavaScripti dünaamiliselt, kontrollides päringu viidete päise kaudu, siis me kaitseme kohe ooperi eest ja st Crome'i ja Firefoxi puhul tuleb salvestada midagi salvestamiseks. Me esimest korda alla ühe skripti, mis omakorda laadivad teise skripti, samas mõlema allalaadimist kontrollitakse HTTP-viite jaoks. Teadusmeetodit leitakse, et kui te dünaamiliselt luua skripti dokumendil

Praktika

nojs.php.
See lehekülg kannab eesmärki Script1.php allalaadimiseks
Leia JS.
10 sekundi pärast peaksite nägema peidetud skripti tööd allerti kujul, klõpsake pärast hoiatust linki, et veenduda, et sündmused ka ei langenud. Sellel lingil näete peidetud skripti
script1.php.
Tema ülesanne: dünaamiliselt alla laadida Script2.php, kui on olemas viidete päis. Korda saab vähendada, sõltuvalt peidetud skripti ligikaudsest ajast.
script2.php.
Tema ülesanne: andke lõpp-skript, kui on olemas viite päis

TULEMUSED

Selle tulemusena saame, et saame lehe algses leheküljel näha ega alla laadida ega salvestada peidetud skripti katsetatud nelja brauseri vahenditega. Üldiselt näete seda kahel viisil:
  • Minge lingile otse, mis juhtis Script2.php ja asub meie saidi leheküljel;
  • HTTP-päringu moodustamine, mis näitab viite päises.
Suurendage peitmise tõhusust selle meetodi abil:
  1. Mod-ümberkirjutamise abil, asendades Script1.js ja Script2.js server Script1.js ja Script2.js Script1.php ja Script2.php, nii et lehel on kõik tavalised JS-failid, kuna PHP kõrkjad järsult;
  2. Tee fiktiivse skripti keeruliseks kui võimalik, usutav ja segane nii, et inimene üritab teda lahti võtta, on päris valatud enne teadlikkust sellest, mida ta peeti;
  3. Töötlemise kood.

Tere, lugeja.
Selles väikeses artiklis tahame teile öelda, kuidas veebipoe kategooriate õigesti optimeerida.
Kui hakkame teksti optimeerida, seadistate kõigepealt leht maksimaalse tähtsuse jaoks. Kuidas seda teha.
Kuid sellises olukorras tekib järgmine probleem - peate lõpetama liiga palju teksti ja see ei sobi saidi disainiga.
Nii et peate kasutajate teksti osa peitma osaAga kui äkki soovib külastaja seda lugeda, nii et ta saaks seda kergesti avada.

Huvitav lahendus rakendatakse Interneti hüpermarketi "pesa". Näiteks kategooriad:

Kui klõpsame sellel lingil, avaneb see täielik kirjeldus ilma lehe taaskäivitamiseta. Kui soovite rakendada sama otsust, siis kirjeldatakse allpool, kuidas seda praktikas rakendatakse.
See hetk saab lahendada JavaScripti programmeerimiskeele tõttu.
JavaScript loodi algselt, et muuta veebilehtede "elus".
Veebilehe määramiseks javaScript skriptid, peate sisestama deskriptor. Koodi saab paigutada nagu päise korpus (silte vahel ) ja lehekülje kehas (silte vahel ).
Skripti töötamiseks peate looma funktsiooni, mida kasutatakse saidi mis tahes osas. Me kasutame funktsiooni funktsiooni SH ()

Skripti kasutamise kuvamiseks peate selle vormi määratud kohas panema.

Loe rohkem ...



Funktsioon Sh () nimetatakse siia.
Vaikimisi peidetud tekst oli koodi muutmisel avatud ekraan: Puudub kohta ekraan: plokk.

Siin on näide sellest, mis juhtus pärast teksti rakendamist tekstile:

Selles näites peeti lehel 3000 SEO-teksti tähemärki, mis olid saidi reklaamimiseks kirjutatud välja. Kui klõpsate lingile ise, kaob link "Veel ..." tänu funktsioonile märgitud stiili stiili stiilile.
Nii saate selle funktsionaalsust rakendada. Kui teil on küsimusi, paluge neil kommentaarides.

Lihtsaim lahendus dokumendi HTML-elemendi näitamiseks ja peitmiseks, kasutades JavaScripti. Detailid Protsessi sisu ja selle omaduste kirjeldus.

Tavapärased vahendid kuivama (ENG. peitma) või näidata (ENG. näita.) Dokumendi HTML element ei ole võimalik. Selleks kasutage CSS-i vara ekraan. või nähtavus.. Nende vahe on see nähtavus.Kuigi see muudab HTML-elemendi nähtamatu, kuid tema hõivamise koht jääb tema taga. On selge, et seda kasutatakse palju sagedamini ekraan..

ekraan. (inglise keeles. näitama) - mitmeotstarbeline vara, mis määrab kindlaks, kuidas element dokumendis kuvatakse.

Nimekiri võimalikest CSS-i omaduste väärtustest ekraan.Erinevate brauserite poolt arusaadav ei ole suur, kuid see on küllaltki piisavalt.

  • plokk - Element kuvatakse plokina. Selle väärtuse kasutamine sisseehitatud elementide jaoks, näiteks span silt, põhjustab selle käitumise plokkidena, st Sõudmine toimub sisu alguses ja lõpus.
  • järjekorras - Üksus kuvatakse sisseehitatud sisseehitatud. Selle väärtuse kasutamine plokkide elementide jaoks, näiteks div silt, põhjustab selle sisseehitatud, s.t. Selle sisu algab kohaga, kus eelmine element lõppes.
  • nimekiri. - Element kuvatakse plokina ja loendi marker lisatakse.
  • ükski - peidab dokumendi elemendi. Nende poolt hõivatud koht ei ole reserveeritud ja veebileht on moodustatud nii nagu element ja seal ei olnud.

On selge, et konkreetse HTML-elemendi CSS-i omandi muutmiseks peate kasutama skriptimisprogrammi keelt. Meie puhul on see JavaScript. Aga kõik on korras.

Esiteks peate otsustama täpselt, kuidas ühendust võtta dokumendi HTML-elemendiga. Selleks saate kasutada dokumendiobjekti geteelemetbyidi objekti meetodit, mis tagastab viide ID-atribuudi ID HTML-elemendile. Näiteks:

document.gettelemetbyid ("test")

Nüüd peame kasutama vastava HTML-elemendi stiili omadusi. See kasutab stiili vara. Näiteks:

document.geletelemetbyid ("test"). Style.display

See jääb ainult juhtimise elemendi loomiseks, mis vahetab CSS-i kinnisvara väärtusi ekraan.Igal juhul, näiteks OnClick (Click Mouse). Tasub pöörata tähelepanu asjaolule, et ülesande lahendamiseks peate kontrollima praegust CSS-i vara väärtust ekraan. Ja muutke seda "vastassuunas". Meie puhul, et peita, kasutame väärtust ükskija kuvada "Tühi". Teisel juhul eemaldame CSS-i vara ekraan. Asjakohas element, mis võimaldab töötada õigesti nii plokkide ja sisseehitatud HTML elemente.

Selguse huvides annan ma järgmise näite:

Muutuma

Pange tähele, et div siltil on ekraani stiili atribuut: puudub. Sellel viisil? Me määrame CSS-i omaduste väärtuse ekraan. Vaikimisi, võrdne ükski. HTML-element on algselt peidetud.