Inside Technique : W3C DOM Table of Contents : The Code

Recursive getHeaders() Approach

function getTextForElement(obj) {
 var str=""
 for (var i=0;i < obj.childNodes.length;i++) {
  if (obj.childNodes[i].nodeType==1)
   str+=getTextForElement(obj.childNodes[i])
  else if (obj.childNodes[i].nodeType==3)
   str = obj.childNodes[i].data
 }
 return str
}

function getHeaders(el,obj) {
 var tagList = "H1;H2;H3;H4;H5;H6;"
 if (tagList.indexOf(obj.tagName+";")>=0) {
  var eLI = document.createElement("LI")
  var eLIText = document.createTextNode(getTextForElement(obj))
  eLI.className="toc" + obj.tagName
  eLI.appendChild(eLIText)
  el.appendChild(eLI)
 }
 for (var i=0;i < obj.childNodes.length;i++)
  if (obj.childNodes[i].nodeType==1)
   getHeaders(el,obj.childNodes[i])
}


function doLoad() {
 var el = document.createElement("UL")
 var startEl = document.getElementsByTagName("BODY")[0]
 getHeaders(el,startEl)
 startEl.insertBefore(el,startEl.childNodes[0])
}

window.onload =doLoad

getElementsByTagName() Approach

function getTextForElement(obj) {
 var str=""
 for (var i=0;i < obj.childNodes.length;i++) {
  if (obj.childNodes[i].nodeType==1)
   str+=getTextForElement(obj.childNodes[i])
  else if (obj.childNodes[i].nodeType==3)
   str = obj.childNodes[i].data
 }
 return str
}

function getHeaders() {
 var obj = document.getElementsByTagName("*")
 var el = document.createElement("UL")
 var tagList = "H1;H2;H3;H4;H5;H6;"
 for (var i=0;i < obj.length;i++)
  if (tagList.indexOf(obj[i].tagName+";")>=0) {
   var eLI = document.createElement("LI")
   var eLIText = document.createTextNode(getTextForElement(obj[i]))
   eLI.className="toc" + obj[i].tagName
   eLI.appendChild(eLIText)
   el.appendChild(eLI)
  }
 return el
}

function ie_getElementsByTagName(str) {
 if (str=="*")
  return document.all
 else
  return document.all.tags(str)
}

if (document.all)
 document.getElementsByTagName = ie_getElementsByTagName

function doLoad() {
 var el = getHeaders()
 var startEl = document.getElementsByTagName("BODY")[0]
 startEl.insertBefore(el,startEl.childNodes[0])
}

window.onload =doLoad

© 1997-2000 InsideDHTML.com, LLC. All rights reserved.