How would you select an element which does not exist on actual DOM tree?

JavaScript
1

such as -

const html = ' <ul class = 'somthingUl'>
                 <li class ='someLists'>
                    <img ....>
                 </li>
               </ul>'

this only exists in the script and i would like to show/hide this ul.How would you do it?

2

once they have been added to the DOM by an other method you can just select them with one of the methods to select elements

2 Likes
3

Another option is to turn this fragment into a “virtual DOM tree” in memory, using createContextualFragment. Doing this, it doesn’t need to be in the DOM to use querySelector, for example.

We can accomplish much the same result using document.createElement, creating a root element and populating that as we need, but from string to DOM, i like the first approach.

1 Like
4

This is a very powerful ways to do so.Thank you!

1 Like
5

It is an advanced API, not something to be introduced early in the curriculum, but one of the most useful DOM tools I’ve seen. I use it all the time.

1 Like
6

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.