Is it necessary to use document.getElementById() to access a specific DOM object, or can its Id be used directly? <p>In a lot of what I'm reading about Javascript the examples show how to edit a given element by first getting its object using document.getElementById(). However I've seen other code where this isn't used and the element's Id is just used directly.</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;script&gt; function test1(){ document.getElementById("paragraph").innerHTML = "test 1 works"; } function test2(){ paragraph.innerHTML = "test 2 works"; } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;a href="#" onClick="test1()"&gt;Run Test 1&lt;/a&gt; &lt;a href="#" onClick="test2()"&gt;Run Test 1&lt;/a&gt; &lt;p id="paragraph"&gt;&lt;/p&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>Both test1() and test2() are able to update the innerHTML of the 'paragraph' element. However the first one uses document.getElementById(paragraph) and the second one skips this and just uses the Id itself.</p> <p>Since both of these work is there a preferred method? Does it depend on the browser?</p>