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

Рећи ћу ово сада - не морате да учите Јавасцрипт да бисте користили јКуери. Вероватно је најбоље ако сматрате јКуери еволуцијом Јавасцрипта - бољим начином за то - него једноставно библиотеком која додаје функционалност. Било који Јавасцрипт који вам је потребан биће покупљен успут. Претпоставља се, међутим, да као веб програмер имате прилично добро знање о ХТМЛ -у и ЦСС -у (а ево и корисног бесплатног кХТМЛ водича ако не!).

Модел објекта документа

јКуери се бави преласком и манипулацијом ПРЕСУДА - тхе Д. оцумент ИЛИ бјецт М. одел. ДОМ је хијерархијски приказ странице у облику стабла, који су направили прегледачи након читања читавог ХТМЛ кода. У јКуери -у користићемо терминологију попут родитељ , деца , и браћа и сестре прилично често, па бисте требали имати идеју шта то значи у односу на ДОМ.

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

jQuery code codes here`

$ ('селектор').метода();

То је то, у наслову горе. То је основна структура једног комада јКуери кода за манипулацију ДОМ -ом. Лако, зар не?

Тхеселекторговори јКуери -у да пронађе ствари које одговарају овом правилу, и исто је што и селектори ЦСС -а (а затим још неки на врху). Дакле, баш као у ЦСС -у са којим бисте стилизовали све везе

a { }

Исто би се урадило у јКуери као

$('a')

Ово се може учинити за било који ХТМЛ елемент - див, х1, спан - шта год. Да бисте били прецизнији, можете користити и ЦСС класе и ИД -ове.

На пример, да бисте пронашли све везе са класом 'финдме', користили бисте:

$('a.findme')

Не морате сваки пут да наводите врсту елемента - али ако то учините, то једноставно чини правило специфичнијим. Могао си само рећи

$('.findme')

што би све одговарало класи Нађи ме , без обзира да ли је то била веза или не.

Да бисте користили именовани ИД елемент, користите # потпиши уместо тога. Кључна разлика овде је што ће бирач ИД -а изабрати само један објекат, док бирач класа може да пронађе више од једног.

како додати водени жиг у гоогле документе

$('#something')

У основи, ако то можете учинити у ЦСС -у, тада ће то учинити и јКуери. У ствари, можете користити и неке прилично сложене псеудо селекторе у стилу ЦСС3 попут: прво

$('body p:first')

Што би узело пасус странице. Наћи ћете и елементе са одређеним атрибутима. Размотримо овај пример; желимо да пронађемо све везе на страници које интерно воде на искористи и на неки начин их истакнути. Ево како бисмо их могли пронаћи:

$('a[href*='makeuseof']')

Није ли то кул? Па, мислим да јесте.

Ваш следећи порт би требао бити јКуери АПИ документација за селекторе . То је огромна листа свих различитих врста селектора доступних за употребу и нико не би очекивао да ћете их све научити.

Следећи део једначине јеметода- шта да радите са тим стварима када их све пронађете - али то ћемо оставити за следећу лекцију. Ако сада желите да почнете са испробавањем различитих селектора, предлажем да се придржавате следеће методе цсс. Ово узима два параметра - ЦСС име имовине , и нови вредност да се додели тој имовини. Дакле, да бисте свим везама дали црвену боју позадине, урадили бисте:

$('a').css('background-color','red');

Довољно једноставно! Иако ово можда неће бити од неке практичне користи, омогућиће вам да лако видите све елементе који се налазе помоћу ваших бирача. Сада идите и изаберите - ДОМ вас чека.

Надам се да вам је овај водич био од користи; Покушао сам да га учиним што једноставнијим за разумевање. Слободно поставите било које питање или оставите повратне информације, али имајте на уму да ја свакако нисам елитни јКуери нинџа.

Објави Објави Твеет Емаил 5 савета за суперпуњење ваших ВиртуалБок Линук машина

Уморни сте од лоших перформанси које нуде виртуелне машине? Ево шта треба да урадите да бисте побољшали перформансе ВиртуалБок -а.

Прочитајте следеће Повезане теме

Веб Цултуре
Веб Девелопмент
ЈаваСцрипт
Програмирање
јКуери

О аутору Јамес Бруце(707 објављених чланака)

Јамес је дипломирао вештачку интелигенцију и има ЦомпТИА А+ и Нетворк+ сертификат. Кад није заузет као уредник прегледа хардвера, ужива у ЛЕГО, ВР и друштвеним играма. Пре него што се придружио МакеУсеОф -у, био је техничар осветљења, учитељ енглеског језика и инжењер дата центра.

Више од Јамеса Бруцеа

Претплатите се на наш билтен

Придружите се нашем билтену за техничке савете, критике, бесплатне е -књиге и ексклузивне понуде!

Кликните овде да бисте се претплатили