Posts

Showing posts from September, 2024

Table Navigation in JavaScript

Image
  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > Table Navigation </ title >     < link href = "https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel = "stylesheet"         integrity = "sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin = "anonymous" > </ head > < body >     < div class = "container my-4" >         < table class = "table" >             < caption > Table of legends </ caption >             < thead >                 < ...

Element only Navigation in JavaScript

Image
  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < link rel = "stylesheet" href = "../CSS/Element_only_Navigation.css" >     < title > Element only Navigation </ title > </ head > < body > <!--This is me-->     < nav >         < ul >             < li > Home </ li >             < li > About Me </ li >             < li > Hire me </ li >         </ ul >     </ nav >     < div class = "container" >         < p > Hey I am a good boy...

Parents and Siblings of an Element

Image
  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > Parents and Siblings of an Element </ title > </ head > <!-- First child of body --> < body >< div >< div class = "first" > first </ div >< div class = "second" > second </ div ></ div >     < script src = "../Parents_Siblings_of_an_Element.js" ></ script > </ body > </ html > Below File is Parents_Siblings_of_an_Element.js File. console . log ( document . body . firstChild ); a = document . body . firstChild ; console . log ( a . parentNode ); console . log ( a . parentElement ); console . log ( a . firstChild . nextSibling )...

Accessing Children of an Element

Image
  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > Accessing Children of an Element </ title > </ head > < body >     < div >         < p > This is me and I am great </ p >         < span > Siblings </ span >     </ div >     < h1 > Accessing Children of an Element </ h1 >     < script src = "../Accessing_Children_of_an_Element.js" ></ script > </ body > </ html > Below File is Accessing_Children_of_an_Element.js File. console . log ( document . body . firstChild );   //Here, firstChild is textNode console . log ( document . body . last...