Овај водич ће описати процедуру за проналажење ДОМ елемента на основу било које вредности атрибута.
Како пронаћи/преузети елемент у ДОМ-у на основу вредности атрибута?
Да бисте пронашли елемент у ДОМ-у на основу вредности атрибута, користите „ куериСелецтор() ” метод. Даје први елемент пронађен у документу који одговара датој вредности ЦСС селектора.
Белешка : Да бисте добили све елементе који одговарају наведеној вредности селектора, користите „ куериСелецторАлл() ” метод.
Синтакса
За коришћење методе „куериСелецтор()“, користите следећу синтаксу:
документ. куериСелецтор ( селектор ) ;
Овде ће селектор бити ид или класа као „ #ид ”, “ .класа ”:
Такође можете користити дату синтаксу за проналажење елемента на основу вредности атрибута:
документ. куериСелецтор ( '[селецтор='валуе']' ) ;
У горњој синтакси, „ селектор ' биће ' ид ” или “ класа ', или ' вредност ' биће ' идНаме ” или “ Назив класе ”.
Пример
У ХТМЛ датотеци направите див елемент који садржи наслов користећи х4 елемент, обичан текст помоћу ознаке <спан> и див за поруку са додељеним ид-ом “ порука ”:
< див ид = 'див' стил = 'тект-алигн:центер;' >< х4 класа = 'сек' ид = 'наслов' > Пронађите ан Елемент у ДОМ-у На основу ан Атрибут Валуе х4 >
< спан ид = 'Добродошли' > Добродошли у Линукхинт спан >
< див ид = 'порука' >
< п ид = 'порука' > Здраво момци ! Добродошли у Линукхинт ЈаваСцрипт туторијале стр >
див >
див >
Страница ће изгледати овако:
Сада ћемо добити елемент где је ид “ порука ” се додељује помоћу „ куериСелецтор() ” метод:
сваки елемент = документ. куериСелецтор ( '#мессаге' )На крају, одштампајте елемент на конзоли:
конзола. Пријава ( елемент ) ;У излазу, „ див ” елемент је приказан са додељеним ИД-ом “ порука “, што указује да је тражени елемент успешно преузет:
Такође можете добити елемент користећи дату синтаксу. Овде ћемо добити елемент чији је ид „ мсг ”:
сваки елемент = документ. куериСелецтор ( '[ид='мсг']' ) ;Излаз
Сада ажурирајте његову боју помоћу „ стил ' имовина:
елемент. стил . боја = 'Плави' ;Као што видите, текст је био у „ зелен ” боја, а сада је ажурирана у „ Плави ”:
То је све о проналажењу елемента у ДОМ-у на основу вредности атрибута.
Закључак
Да бисте пронашли елемент у ДОМ-у на основу вредности атрибута, користите „ куериСелецтор() ” метод који даје први елемент у документу који одговара наведеној вредности ЦСС селектора. Штавише, да бисте добили све елементе који одговарају наведеној вредности селектора, користите „ куериСелецторАлл() ” метод. Овај водич је описао процедуру за проналажење ДОМ елемента на основу било које вредности атрибута.