Accessing elements Using ALL

HTML

 <!DOCTYPE html>

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Spider-Man</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <h1>Spider Man</h1>
    <img src="assets/spiderman_img.png" id="mainImg" />
    <h2>About</h2>
    <p>
      <b>Spider-Man</b> is a superhero appearing in American comic books
      published by
      <a href="https://www.google.com/search?q=Marvel+Comics">Marvel Comics</a>.
      Created by writer-editor <b>Stan Lee</b> and artist <b>Steve Ditko</b>, he
      first appeared in the anthology comic book
      <a href="https://www.google.com/search?q=Amazing+Fantasy"
        >Amazing Fantasy</a
      >
      #15 (August 1962) in the <a href="#">Silver Age of Comic Books</a>. He has
      been featured in comic books, television shows, films, video games,
      novels, and plays
    </p>

    <div class="box">
      <h4>Publication Info</h4>
      <ul>
        <li><a href="#" class="boxLink">Publisher</a></li>
        <li><a href="#" class="boxLink">First Appearance</a></li>
        <li>
          Created by
          <ul>
            <li><a href="#" class="boxLink">Stan Lee</a></li>
            <li><a href="#" class="boxLink">Steve Ditko</a></li>
          </ul>
        </li>
      </ul>
    </div>

    <h2>Creation & Development</h2>
    <p id="description">
      In 1962, with the success of the Fantastic Four, Marvel Comics editor and
      head writer Stan Lee was casting for a new superhero idea. He said the
      idea for Spider-Man arose from a surge in teenage demand for comic books
      and the desire to create a character with whom teens could identify. As
      with Fantastic Four, Lee saw Spider-Man as an opportunity to "get out of
      his system" what he felt was missing in comic books. In his autobiography,
      Lee cites the non-superhuman pulp magazine crime fighter the Spider as a
      great influence, and in a multitude of print and video interviews, Lee
      stated he was further inspired by seeing a spider climb up a wall—adding
      in his autobiography that he has told that story so often he has become
      unsure of whether or not this is true.
    </p>
    <div class="images">
      <img src="assets/creation_1.png" class="oldImg" />
      <img src="assets/creation_2.jpeg" class="oldImg" />
      <img src="assets/creation_3.jpeg" class="oldImg" />
    </div>

    <script src="app.js"></script>
  </body>
</html>

CSS

console.log(document.all[8].innerText);
document.all[8].innerText="Peter Parker";





Comments

Post a Comment

Popular posts from this blog

Callback Hell

Image
      < h1 > call Hell Demo </ h1 > let h1 = document . querySelector ( "h1" ); function changeColor ( color , delay , NextchangeColor ) {   setTimeout (() => {     h1 . style . color = color ;     if ( NextchangeColor ) NextchangeColor ();   }, delay ); } changeColor ( "red" , 1000 ,() => {     changeColor ( "blue" , 1000 ,() => {         changeColor ( "orange" , 1000 ,() => {             changeColor ( "green" , 1000 ,() => {                 changeColor ( "yellow" , 1000 );             })         })     }) });
Read more

TODO list with DOM

Image
 HTML <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > TODO List with DOM </ title > </ head > < body >     < h1 > TODO List </ h1 >     < input placeholder = "Enter Task" >     < button > Add Task </ button >     < ul >         < li > Eat < button class = "delbtn" > delete </ button ></ li >         < li > Sleep < button class = "delbtn" > delete </ button ></ li >     </ ul >     < script src = "TODOwithDOM.js" ></ script > </ body > </ html > JS let btn = document . querySelector ( "button" ); let inp = document . querySelector ( "input" ); let ul = do...
Read more

Refactoring callback hell code

Image
  let h1 = document . querySelector ( "h1" ); function changeColor ( color , delay ) {   return new Promise (( resolve , reject ) => {     setTimeout (() => {       h1 . style . color = color ;       resolve ( "color changed" );     }, delay );   }); } changeColor ( "red" , 1000 )   . then (() => {     console . log ( "Color changed to Red" );     return changeColor ( "orange" , 1000 );   })   . then (() => {     console . log ( "color changed to orange" );     return changeColor ( "green" , 1000 );   })   . then (() => {     console . log ( "color changed to green" );     return changeColor ( "blue" , 1000 );   })   . then (() => {     console . log ( "color changed to blue" );   });
Read more