Hi,
Apart from our usual document.getElementsById and document.getElementsByTagName method to select element from the DOM we can now make use of document.querySelector and document.querySelectorAll .
With them we can use the same selectors that we use in CSS to select elements for styling.
A simple example
<html> <head> <title>Selectors API</title> <script> window.onload = function () { // select div element with id myDivId var myDiv = document.querySelector("#myDivId"); // select p element with text "Paragraph 1" var paragraph1 = myDiv.querySelector("span>p"); // select p element having class as p1Class var paragraph2 = document.querySelector("p.p2Class"); // select all p element var allParagraph = document.querySelectorAll("div>span>span>p"); } </script> </head> <body> <div id="myDivId" class='divClass'> <span><span class='spanClass'> <p> Paragraph 1</p> <p id="p2" class="p2Class"> Paragraph 2</p> </span></span> </div> </body> </html>
More details
http://msdn.microsoft.com/en-us/ie/cc307217.aspx
http://msdn.microsoft.com/en-us/library/cc288326(v=vs.85).aspx
Browser supported