КСНУМКС Бесплатни исјечци ЈаваСцрипта за ваше веб странице

Чланак написао:
  • Феатуред Артицлес
  • Ажурирано: Сеп КСНУМКС, КСНУМКС

ЈаваСцрипт је користи се свуда на мрежи ових дана - побољшати интерактивност веб страница, потврдити информације и / или побољшати изгледе на веб локацију.

ЈаваСцрипт се први пут појавио у КСНУМКС-у и од тада је прошао дуг пут у погледу прихватања и начина на који се користи. На синтаксу кориштену у ЈаваСцрипт-у снажно је утицао Ц; али Јава, Пеарл, Питхон и Сцхеме су такође играли своју улогу.

Савети за почетнике ЈаваСцрип-а: Шта треба да знате?

За почетак, неколико основа које требате знати су:

  • ЈаваСцрипт може бити искључен у прегледачу
  • ЈаваСцрипт ће се покренути сваки пут када се учита страница
  • Потребно је време да се ЈаваСцрипт учита на спору интернет везу
  • ЈаваСцрипт је још увек покренут са кешираних страница
  • Можете хостовати ЈаваСцрипт унутар веб странице или екстерно из .јс датотеке
  • ЈаваСцрипт је потпуно другачији од Јаве

Такође је важно схватити да ће ЈаваСцрипт заправо довести до катастрофе ако се користи на погрешан начин.

Лоше конфигурисани и неуредни кодирани ЈаваСцриптс успорит ће вашу веб локацију и оштетити цјелокупну навигацију по веб локацији. То заузврат утиче на стопу повратка посетилаца (због лошег корисничког искуства) као и на ранг листи претраживача (због спора стопе одговора на веб локацији и пузања бот-ова). Да бисте овде потврдили мој случај, ставите се у ципеле гледаоца. Ако је веб локација коју сте посетили полако се кретала, било је тешко кретати се, и уопште, непривлачно - да ли бисте се вратили на сајт? Не бих.

Испод је мала листа ствари о којима морате размишљати приликом додавања ЈаваСцрипта Ваш сајт.

  • Да ли је ЈаваСцрипт потребан да би страница функционирала исправно?
  • Како ће изгледати сајт ако је ЈаваСцрипт блокиран?
  • Да ли ЈаваСцрипт штети перформансама сервера?
  • Да ли ће додавање ЈаваСцрипта помоћи да се ваш сајт помера у правцу у којем желите да иде?

Не, не покушавам да вас уплашим овим стварима.

У ствари, не бојте се тога користите ЈаваСцрипт на својим веб локацијама јер пружа на тоне тона, а као што је већ поменуто, већина их користи. Кључна тачка коју овде покушавам да видим није само додавање ЈаваСцрипт функција на веб локацију када су оне непотребне. Неким веб локацијама ће требати више ЈаваСцрипт од осталих; некима је потребно мање - само зато што један сајт то ради не значи да би требало да урадите исто.

Фреебиес: КСНУМКС Цоол ЈаваСцрипт Сниппетс фор иоур вебсите

Сада се пребацимо на оно због чега сте дошли овде - у наставку се налази списак КСНУМКС ЈаваСцрипт исјечака који ће побољшати вашу веб локацију у било којој функционалности или изгледу. Код ће бити подељен на два дела, глава и тело или .јс датотека. Ако није наведен наслов одјељка, тада тај одређени исјечак није потребан.

КСНУМКС. Разумевање ХТМЛКСНУМКС видео записа

Брзи узорак

<сцрипт типе = "тект / јавасцрипт"> функција разумије_видео () {ретурн !! доцумент.цреатеЕлемент ('видео'). цанПлаиТипе; // боолеан} иф (! разумије_видео ()) {// Мора да је старији претраживач или ИЕ. // Можда урадите нешто попут сакривања прилагођених // ХТМЛКСНУМКС контрола. Или било шта ... видеоЦонтролс.стиле.дисплаи = 'ниједан'; } </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај мали исечак ће спречити да ваш веб сајт покаже приказивање видео записа који претраживач не може да подржи, чиме се штеди пропусна моћ и снага обраде.

КСНУМКС. ЈаваСцрипт колачићи

Брзи узорак

<сцрипт типе = "тект / јавасцрипт"> / ** * Поставља колачић са заданим именом и вредностом. * * име имена колачића * вредност Вриједност колачића * [истиче] Датум истека колачића (задано: крај текуће сесије) * [стаза] Пут куда је колачић важећи (задано: пут позиваног документа) * [ домен] Домен где колачић важи * (подразумевано: домен позиваног документа) * [сигурно] Боолеан вредност која означава да ли преношење колачића захтева * сигуран пренос * / функција сетЦоокие (име, вредност, рок трајања, пут, домен, сигурно) {доцумент.цоокие = име + "=" + есцапе (вредност) + ((истиче)? "; истиче =" + истиче.тоГМТСтринг (): "") + ((путања)? "; патх =" + патх: "") + ((домен)? "; домена =" + домен: "") + ((сигурно)? "; сигурно": ""); } </сцрипт> <сцрипт типе = "тект / јавасцрипт"> / ** * Добија вредност одређеног колачића. * * име Име жељеног колачића. * * Враћа низ који садржи вредност одређеног колачића, * или нулл ако цоокие не постоји. * / функција гетЦоокие (име) {вар дц = доцумент.цоокие; вар префикс = име + "="; вар бегин = дц.индекОф (";" + префикс); иф (старт == -КСНУМКС) {бегин = дц.индекОф (префикс); ако (старт! = КСНУМКС) врати нулл; } елсе {старт + = КСНУМКС; } вар енд = доцумент.цоокие.индекОф (";", почетак); иф (крај == -КСНУМКС) {енд = дц.ленгтх; } вратити унесцапе (дц.субстринг (почетак + префик.ленгтх, крај)); } </сцрипт> <сцрипт типе = "тект / јавасцрипт"> / ** * Брише наведени колачић. * * име колачића * [пут] пут колачића (мора бити исти као пут за креирање колачића) * [домена] домен колачића (мора бити исти као домен који се користи за креирање колачића) * / функција делетеЦоокие ( име, стаза, домен) {иф (гетЦоокие (име)) {доцумент.цоокие = име + "=" + ((путања)? "; патх =" + патх: "") + ((домаин)? "; домаин = "+ домен:" ") +"; истиче = Тху, КСНУМКС-Јан-КСНУМКС КСНУМКС: КСНУМКС: КСНУМКС ГМТ "; }} </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај исечак је мало дугачак, али веома користан, омогућаваће вашем сајту да складишти информације на рачунару гледаоца, а затим га прочита у неком другом тренутку. Овај исјечак се може користити на много различитих начина за извршавање различитих задатака.

КСНУМКС. Предучитајте своје слике

Брзи узорак

<сцрипт типе = "тект / јавасцрипт"> вар имагес = нев Арраи (); функција прелоадИмагес () {фор (и = КСНУМКС; и <прелоадИмагес.аргументс.ленгтх; и ++) {имагес [и] = нова слика (); имагес [и] .срц = прелоадИмагес.аргументс [и]; }} прелоадИмагес ("лого.јпг", "маин_бг.јпг", "боди_бг.јпг", "хеадер_бг.јпг"); </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај исечак ће спречити да ваш сајт има то незгодно време када приказује само део сајта; ово не само да изгледа лоше, већ је и непрофесионално. Све што треба да урадите је да додате своје слике у секцију прелоадИмагес и спремни сте за ролл.

КСНУМКС. Провера ваљаности е-поште

Брзи узорак

Глава:

<сцрипт типе = "тект / јавасцрипт"> функција валидатеЕмаил (тхеФорм) {иф (/^в+( евиденце.-Сенсе?в+)*@в+( евиденце.-Сенсе?в+)*(.в{КСНУМКС})+$ /.тест(тхеФорм.емаил-ид.валуе)) {ретурн (тачно); } упозорење („Неважећа адреса е-поште! Молимо унесите поново пажљиво!“); повратак (лажно); } </сцрипт>

Тело: <форм онСубмит = "врати валидатеЕмаил (ово);" ацтион = ""> Адреса е-поште: <инпут типе = "тект" наме = "емаилид" /> <инпут типе = "субмит" валуе = "Пошаљите" /> <типе типе = "ресет" валуе = "Ресет" /> </форм>

Шта ради одломак ЈаваСцрипт-а?

Овај исјечак ће потврдити да је исправно обликована адреса е-поште унесена у образац, не може гарантовати да је адреса е-поште стварна, не постоји начин да то проверите помоћу ЈаваСцрипта.

КСНУМКС. Нема десног клика

Брзи узорак

<сцрипт типе = "тект / јавасцрипт"> функција фКСНУМКС () {иф (доцумент.алл) {ретурн фалсе; }} функција фКСНУМКС (е) {иф (доцумент.лаиерс || (доцумент.гетЕлементБиИд &! доцумент.алл)) {иф (е.ххицх == КСНУМКС || е.вхицх == КСНУМКС) {ретурн фалсе; }}} иф (доцумент.лаиерс) {доцумент.цаптуреЕвентс (Евент.МОУСЕДОВН); доцумент.онмоуседовн = фКСНУМКС; } елсе {доцумент.онмоусеуп = фКСНУМКС; доцумент.онцонтектмену = фКСНУМКС; } доцумент.онцонтектмену = нова функција ("ретурн фалсе"); </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај исечак спречава гледаоца да кликне десним тастером миша на вашу страницу. То може обесхрабрити просечног корисника да посуди слике или код са вашег сајта.

КСНУМКС. Прикажите случајне цитате

Брзи узорак

Глава: <сцрипт типе = "тект / јавасцрипт"> вритеРандомКуоте = фунцтион () {вар куотес = нев Арраи (); цитира [КСНУМКС] = "Акција је права мера интелигенције."; куотес [КСНУМКС] = "Бејзбол има велику предност у односу на то да се крикет што пре заврши."; цитира [КСНУМКС] = "Сваки циљ, свака акција, свака мисао, свако осећање које неко доживљава, било да се зна свесно или несвесно, је покушај повећања нивоа душевног мира."; куотес [КСНУМКС] = "Добра глава и добро срце увек су сјајна комбинација."; вар ранд = Матх.флоор (Матх.рандом () * куотес.ленгтх); доцумент.врите (цитати [ранд]); } вритеРандомКуоте (); </сцрипт>

Тело: <сцрипт типе = "тект / јавасцрипт"> вритеРандомКуоте (); </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Ок, ово није исечак који би користили сви сајтови, али се може користити за приказивање више него само случајних цитата. Можете да промените садржај у оквиру цитата у шта год желите и да имате насумичне слике или текст приказане било где на вашем сајту.

КСНУМКС. Претходна / Следећа веза

Брзи узорак

<а хреф="јавасцрипт:хистори.бацк(КСНУМКС)"> Претходна страница </а> | <а хреф="јавасцрипт:хистори.бацк(-КСНУМКС)"> Следећа страница </а>

Шта ради одломак ЈаваСцрипт-а?

Овај исјечак је одличан ако имате више страница на чланку или водичу. То ће омогућити кориснику да прегледава странице са лакоћом. Такође је мала и мала тежина са аспекта ресурса.

КСНУМКС. Означи страницу

Брзи узорак

<а хреф="јавасцрипт:виндов.ектернал.АддФаворите('хттп://ввв.иоурсите.цом', 'Име вашег сајта')"> Додај у омиљене </а>

Шта ради одломак ЈаваСцрипт-а?

Овај исечак ће омогућити кориснику да са лакоћом обележи вашу страницу; све што треба да ураде је да кликне на везу. Његове мале карактеристике попут ове могу повећати укупан доживљај гледалаца.

КСНУМКС. Једноставан линк за страницу за штампање

Брзи узорак

<а хреф="јавасцрипт:виндов.принт() ;"> Одштампај страницу </а>

Шта ради одломак ЈаваСцрипт-а?

Ова мала веза ће омогућити вашим погледима да лако одштампају вашу страницу. Она користи функцију брзог штампања коју је већ подесио ваш прегледач и не користи ресурсе док се не кликне.

КСНУМКС. Прикажи форматирани датум

Брзи узорак

Глава: <сцрипт типе = "тект / јавасцрипт"> функција сховДате () {вар д = нев Дате (); вар цурр_дате = д.гетДате (); вар цурр_монтх = д.гетМонтх () + КСНУМКС; // месеци су базиране на нули вар цурр_иеар = д.гетФуллИеар (); доцумент.врите (цурр_дате + "-" + цурр_монтх + "-" + цурр_иеар); } </сцрипт>

Тело: <сцрипт типе = "тект / јавасцрипт"> сховДате (); </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај исечак ће вам омогућити да прикажете тренутни датум било где на вашој веб страници и не треба га ажурирати. Једноставно га ставите на мјесто и заборавите на то.

КСНУМКС. Сепаратор зарез

Брзи узорак

Глава: <сцрипт типе = "тект / јавасцрипт"> функција аддЦоммас (нум) {нум + = ''; вар нКСНУМКС = нум.сплит ('.'); вар нКСНУМКС = нКСНУМКС [КСНУМКС]; вар нКСНУМКС = нКСНУМКС.ленгтх> КСНУМКС? '.' + нКСНУМКС [КСНУМКС]: ''; вар темп = / (д +) (д {КСНУМКС}) /; вхиле (темп.тест (нКСНУМКС)) {нКСНУМКС = нКСНУМКС.реплаце (темп, '' + ',' + ''); } вар оут = врати нКСНУМКС + нКСНУМКС; доцумент.врите (оут); } </сцрипт>

Тело: <сцрипт типе = "тект / јавасцрипт"> аддЦоммас ("КСНУМКС"); </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај исечак би углавном користили сајтови који често користе бројеве. Овај исечак ће задржати ваше бројеве на истом нивоу. Све што треба да урадите је да копирате линију тела где желите да додате број и да замените број тамо својим бројем.

КСНУМКС. Набавите област екрана прегледача

Брзи узорак

<сцрипт типе = "тект / јавасцрипт"> <! - вар виевпортвидтх; вар виевпортхеигхт; // прегледачи који више одговарају стандардима (мозилла / нетсцапе / опера / ИЕКСНУМКС) користе виндов.иннерВидтх и виндов.иннерХеигхт иф (типеоф виндов.иннерВидтх! = 'ундефинед') {виевпортвидтх = виндов.иннерВидтх, виевпортхеигхт = виндов.иннерХеигхт} / / ИЕКСНУМКС у режиму компатибилном са стандардима (тј. Са важећим документом као први ред у документу) другачије ако (типеоф доцумент.доцументЕлемент! = 'Ундефинед' && типеоф доцумент.доцументЕлемент.цлиентВидтх! = 'Ундефинед' && доцумент.доцументЕлемент.цлиентВидтх ! = КСНУМКС) {виевпортвидтх = доцумент.доцументЕлемент.цлиентВидтх, виевпортхеигхт = доцумент.доцументЕлемент.цлиентХеигхт} // старије верзије ИЕ друго {виевпортвидтх = до ( 'тело') [КСНУМКС] .цлиентВидтх, виевпортхеигхт = до ('боди') [КСНУМКС] .цлиентХеигхт} доцумент.врите ('<п> Ваша ширина приказа је' + ширина приказа + 'к' + висина приказа + '</п>'); // -> </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај исечак ће вам омогућити да добијете ширину и висину области приказа у прегледачу приказа. Ово ће дизајнеру омогућити да креира и користи различите дисплеје на основу величине прозора претраживача корисника.

КСНУМКС. Преусмерите са опционим кашњењем

Брзи узорак

<сцрипт типе = "тект / јавасцрипт"> сетТимеоут ("виндов.лоцатион.хреф = 'хттп://валкервинес.цом.ау/'", КСНУМКС * КСНУМКС); </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај исечак ће вам омогућити да преусмерите гледаоце на другу страницу и да има могућност постављања одлагања. Употреба овог исјечка је прилично разумљива и врло је вриједна алатка која се налази у вашем појасу.

КСНУМКС. Откривање иПхонеа

Узорак

<сцрипт типе = "тект / јавасцрипт"> иф ((навигатор.усерАгент.матцх (/ иПхоне / и)) || (навигатор.усерАгент.матцх (/ иПод / и))) {иф (доцумент.цоокие.индекОф ( "ипхоне_редирецт = фалсе") == -КСНУМКС) {виндов.лоцатион = "хттп://м.еспн.го.цом/вирелесс/?ипхоне&и=ЦОМР"; }} </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај фрагмент ће вам омогућити да откријете да ли је ваш прегледач на иПхоне-у или иПод-у који вам омогућава да прикажете различите садржаје. Овај одломак је непроцјењив у томе колико је тржиште за мобилне уређаје и само ће наставити да расте.

КСНУМКС. Одштампај поруку на статусној траци

Брзи узорак

<сцрипт лангуаге = "јавасцрипт" типе = "тект / јавасцрипт"> <! - виндов.статус = "<Унесите своју поруку>"; // -> </сцрипт>

Шта ради одломак ЈаваСцрипт-а?

Овај мали исечак ће вам омогућити да одштампате поруку на статусној траци. Можете приказати недавне или важне вијести у подручју које ће привући пажњу корисника.

Абоут ВХСР Гуест

Овај чланак је написао дописник госта. Доле приказани аутори су у потпуности његови и не могу одражавати ставове ВХСР-а.