Skip to content

Instantly share code, notes, and snippets.

@celestial-labs

celestial-labs/Getting an element by its id

Last active June 8, 2022 06:32
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save celestial-labs/1d7e21149b348c8906a66803b60ee179 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save celestial-labs/1d7e21149b348c8906a66803b60ee179 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. celestial-labs revised this gist Jun 8, 2022. No changes.
  2. celestial-labs revised this gist Apr 15, 2022. 1 changed file with 10 additions and 0 deletions.
    10 changes: 10 additions & 0 deletions Parent node
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,10 @@
    <div id="div1">
    <div id="div2">
    <div id="div3"> Some text here </div>
    </div>
    </div>
    <script>
    const div3 = document.getElementById( 'div3' );
    const div2 = div3.parentNode;
    const div1 = div2.parentNode;
    </script>
  3. celestial-labs revised this gist Apr 15, 2022. 4 changed files with 4 additions and 1 deletion.
    0 By Id → Getting an element by its id
    View file
    File renamed without changes.
    4 changes: 4 additions & 0 deletions Getting elements by class name
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,4 @@
    const elems = document.getElementsByClassName( 'example')

    const elem = document.querySelector( 'img.class' );
    const elems = document.querySelectorAll( 'img.class, #id1' );
    0 by Tag → Getting elements by tag name
    View file
    File renamed without changes.
    1 change: 0 additions & 1 deletion by Class
    View file
    Original file line number Diff line number Diff line change
    @@ -1 +0,0 @@
    const elems = document.getElementsByClassName( 'example')
  4. celestial-labs revised this gist Apr 15, 2022. No changes.
  5. celestial-labs revised this gist Apr 15, 2022. 1 changed file with 1 addition and 4 deletions.
    5 changes: 1 addition & 4 deletions By Id
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1 @@
    <div id="exampleDiv">Some text here</div>
    <script>
    const elem = document.getElementById( 'exampleDiv' );
    </script>
    const elem = document.getElementById( 'exampleDiv' );
  6. celestial-labs renamed this gist Apr 15, 2022. 1 changed file with 0 additions and 0 deletions.
    0 by class → by Class
    View file
    File renamed without changes.
  7. celestial-labs revised this gist Apr 15, 2022. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions by class
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    const elems = document.getElementsByClassName( 'example')
  8. celestial-labs revised this gist Apr 15, 2022. 1 changed file with 1 addition and 6 deletions.
    7 changes: 1 addition & 6 deletions by Tag
    View file
    Original file line number Diff line number Diff line change
    @@ -1,6 +1 @@
    <div id="exampleDiv1">Some text here</div>
    <div id="exampleDiv2">Some text here</div>
    <div id="exampleDiv3">Some text here</div>
    <script>
    const elems = document.getElementsByTagName( 'div' );
    </script>
    const elems = document.getElementsByTagName( 'div' );
  9. celestial-labs revised this gist Apr 15, 2022. No changes.
  10. celestial-labs revised this gist Apr 15, 2022. 3 changed files with 10 additions and 1 deletion.
    4 changes: 4 additions & 0 deletions By Id
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,4 @@
    <div id="exampleDiv">Some text here</div>
    <script>
    const elem = document.getElementById( 'exampleDiv' );
    </script>
    6 changes: 6 additions & 0 deletions by Tag
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,6 @@
    <div id="exampleDiv1">Some text here</div>
    <div id="exampleDiv2">Some text here</div>
    <div id="exampleDiv3">Some text here</div>
    <script>
    const elems = document.getElementsByTagName( 'div' );
    </script>
    1 change: 0 additions & 1 deletion sassdferhds
    View file
    Original file line number Diff line number Diff line change
    @@ -1 +0,0 @@
    trjhsrtjsrd
  11. celestial-labs created this gist Apr 15, 2022.
    1 change: 1 addition & 0 deletions sassdferhds
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    trjhsrtjsrd