root [2]        
├0 doctype <1:0-1:0>
└1 element<html> [2] <2:0-34:0>
   │  properties: {
   │    "lang": "en"
   │  }
   ├0 element<head> [4] <3:4-8:4>
   │  ├0 element<meta> <4:8-4:32>
   │  │  │  properties: {
   │  │  │    "charset": "UTF-8"
   │  │  │  }
   │  ├1 element<meta> <5:8-5:63>
   │  │  │  properties: {
   │  │  │    "http-equiv": "X-UA-Compatible",
   │  │  │    "content": "IE=edge"
   │  │  │  }
   │  ├2 element<meta> <6:8-6:80>
   │  │  │  properties: {
   │  │  │    "name": "viewport",
   │  │  │    "content": "width=device-width, initial-scale=1.0"
   │  │  │  }
   │  └3 element<title> [1] <7:8-7:27>
   │     └0 text <7:15-7:27>
   │        │  "sample title"
   └1 element<body> [6] <9:4-33:4>
      ├0 comment <10:8-10:29>
      │  │  " Text Comment "
      ├1 element<h1> [1] <11:8-11:24>
      │  └0 text <11:12-11:24>
      │     │  "Hello World!"
      ├2 element<input> <12:8-12:41>
      │  │  properties: {
      │  │    "type": "checkbox",
      │  │    "checked": true
      │  │  }
      ├3 element<p> [1] <13:8-13:21>
      │  └0 text <13:11-13:21>
      │     │  "11/15/2022"
      ├4 element<ul> [4] <14:8-31:8>
      │  │  properties: {
      │  │    "id": "python-loop"
      │  │  }
      │  ├0 element<li> [2] <15:12-18:12>
      │  │  ├0 element<span> [1] <16:16-16:28>
      │  │  │  └0 text <16:22-16:28>
      │  │  │     │  "name: "
      │  │  └1 element<span> [1] <17:16-17:29>
      │  │     └0 text <17:22-17:29>
      │  │        │  "Zachary"
      │  ├1 element<li> [2] <19:12-22:12>
      │  │  ├0 element<span> [1] <20:16-20:27>
      │  │  │  └0 text <20:22-20:27>
      │  │  │     │  "age: "
      │  │  └1 element<span> [1] <21:16-21:24>
      │  │     └0 text <21:22-21:24>
      │  │        │  "22"
      │  ├2 element<li> [2] <23:12-26:12>
      │  │  ├0 element<span> [1] <24:16-24:28>
      │  │  │  └0 text <24:22-24:28>
      │  │  │     │  "type: "
      │  │  └1 element<span> [1] <25:16-25:30>
      │  │     └0 text <25:22-25:30>
      │  │        │  "checkbox"
      │  └3 element<li> [2] <27:12-30:12>
      │     ├0 element<span> [1] <28:16-28:27>
      │     │  └0 text <28:22-28:27>
      │     │     │  "age: "
      │     └1 element<span> [1] <29:16-29:24>
      │        └0 text <29:22-29:24>
      │           │  "22"
      └5 element<h4> [1] <32:8-32:19>
         └0 text <32:12-32:19>
            │  "The end"