Sun Dial Menu
More on queryselectorall
Menu querySelectorAll()
 

querySelectorAll() for Manipulation of the DOM

When I firat looked at this Selector I was trying to develop a method to select menu entries on the menus that I was using. When found the menu options, links to other pages, could be set programatically. This is similar to what I am doing with my Contextual Page design

The querySelectorAll() method is a little too powerful and for the use of selecting the menu items the use of getElementsByClassName() would be more useful.

<script>
function myFunction() {
  var x = document.getElementsByClassName("menu li");
//  x[0].style.backgroundColor = "red";
}
</script>
Need a loop to display the innerHTML
If I want to dispaly them on the page

The example on my page on selecting elements in general is a little confusing. I started off selecting li tags and then expanded it to p tags. I found that I could select pretty much everything on the page (document object). While this could be good if that is what you wanted but I am not sure why you would want that.

Top Menu

Links

Top

References: - a note on these

  • Document.querySelectorAll() - https:// developer.mozilla.org/ en-US/docs/Web/API/Document/ querySelectorAll
  • HTML DOM getElementsByTagName() Method - https://www.w3schools.com/jsref/ met_document_getelementsbytagname.asp

Site design by Tempusfugit Web Design -