Како динамички направити оквир за текст у ЈаваСцрипт-у

Неки то називају магијом - способношћу да се предмети изненада појаве ниоткуда. Ову врсту чаролије можете створити на својој веб локацији користећи неколико редова ЈаваСцрипт-а. На пример, оквири за текст су добри ХТМЛ елементи који се користе када се учи да се објекти динамички појављују. Уместо да их уграђујете у свој код када дизајнирате своју веб страницу, додајте оквире за текст по потреби и истовремено импресионирајте посетиоце странице.

Стварање оквира за текст

Пре него што се оквир за текст материјализује, морате разумети шта је то оквир за текст. ХТМЛ га познаје као улазну ознаку, као што је приказано у следећем примеру:

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

Динамички оквири за текст

ХТМЛ-у је свеједно када дефинишете атрибуте елемента све док им негде дајете вредности. То значи да имате могућност да динамички креирате елемент текстуалног оквира и поставите његове атрибуте било када. Функција доцумент.цреатеЕлемент то омогућава на следећи начин:

вар бок = доцумент.цреатеЕлемент ("улаз");

То је све што је потребно за креирање ХТМЛ улазног елемента и додељивање променљивој под називом „бок“. Објекат оквира не постаје оквир за текст док његовом атрибуту типа не дате вредност „тект“ као што је приказано у овом примеру:

бок.типе = "текст";

Интеграција веб страница

Овај доњи код додаје текстуални оквир ХТМЛ документу.користећи корисну функцију аппендЦхилд:

доцумент.боди.аппендЦхилд (кутија);

Ако желите да додате текстуално поље након одређене контроле, уместо тога користите следећу изјаву:

доцумент.гетЕлементБиИд ("соме_Елемент_ИД"). аппендЦхилд (оквир);

Замените "соме_Елемент_ИД" именом елемента након којег желите да додате поље за текст. На пример, ако је тај елемент дугме чији је ИД био „буттон1“, наредба аппендЦхилд ће се појавити на следећи начин:

доцумент.гетЕлементБиИд ("буттон1"). аппендЦхилд (оквир);

Опционални атрибути

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

бок.валуе = бокВалуе; бок.ид = бокИД;

Вредности бокВалуе и бокИД проследите функцији, а она примењује те атрибуте на оквир за текст. Ако доделите вредност ИД-а, можете је касније користити за ажурирање својстава оквира за текст као што је приказано у примеру испод:

вар бокОбјецт = доцумент.гетЕлементБиИд (бокИД); бокОбјецт.стиле.бацкгроундЦолор = "црвено";

Прва изјава добија референцу на оквир за текст, а последња наредба мења боју позадине оквира за текст у црвену.

Рецент Постс