nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

does Dom support selecting items by class name

EvonFranklin · 2017-02-01T21:08:34+00:00

On ( Dom . byId ( "class-name" ) <SPAN class="punctuation…

EvonFranklin

<SPAN class="token function">On</SPAN><SPAN class="punctuation token">(</SPAN>Dom<SPAN class="punctuation token">.</SPAN><SPAN class="token function">byId</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"class-name"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN>‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN></SPAN>

This works for listening for ID changes, however is there a way to target DOM elements by class name?

Finde mehr Beiträge mit dem Tag

Accepted answers

EvonFranklin

<SPAN class="token function">On</SPAN><SPAN class="punctuation token">(</SPAN>document<SPAN class="punctuation token">,</SPAN> On<SPAN class="punctuation token">.</SPAN><SPAN class="token function">selector</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">".imgs"</SPAN><SPAN class="punctuation token">,</SPAN> Mouse<SPAN class="punctuation token">.</SPAN>enter<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN><SPAN class="token function">logger</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN></SPAN>

Eventually used this, I had to import the "Mouse" and "Query" dojo kits as well.

All comments

EvonFranklin

<SPAN class="token function">On</SPAN><SPAN class="punctuation token">(</SPAN>document<SPAN class="punctuation token">,</SPAN> On<SPAN class="punctuation token">.</SPAN><SPAN class="token function">selector</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">".imgs"</SPAN><SPAN class="punctuation token">,</SPAN> Mouse<SPAN class="punctuation token">.</SPAN>enter<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN><SPAN class="token function">logger</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN></SPAN>

Eventually used this, I had to import the "Mouse" and "Query" dojo kits as well.

EvonFranklin

I see, I want to ultimately achieve a mouseover effect when the mouse hovers over a certain img tag.

RobertScheitlin__GISP

Sure

EvonFranklin

and this will be enabled for dynamically added elements with the same class name? (.someClass) is added to the DOM tree after a button is pressed. Then can I add a "hover" listener to this element?

RobertScheitlin__GISP

Evon,

You can use "dojo/query"

i.e.

<SPAN class="keyword token">var</SPAN> nl <SPAN class="operator token">=</SPAN> <SPAN class="token function">query</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">".someClass"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"someId"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN></SPAN>

Nimm an der Unterhaltung teil

Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.

Schnellzugriffe

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.