DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Snippets Manager

Snippets has posted 5883 posts at DZone. View Full User Profile

JavaScript Object Viewer

02.25.2006

| 7288 views |

        /*
  appName: JSOV 0.1
  Author: Billy Chow
  Webpage: http://www.dreammx.com
  E-mail: billychow#tom.com
*/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JSOV - JavaScript Object Viewer</title>
<meta name="robots" content="follow,index" />
</head>
<style type="text/css">
body  {font-family: Verdana, Tahoma, Arial;
     font-size: 12px;
    }
div    {display: inline;}
a,a:link,a:hover  {text-decoration: none;
           color:blue;
}
.o_prop_name  {font-weight: bold;
         color: blue;
         font-size: 14px;
}
.o_prop_value  {font-weight: bold;
         color: green;
}
</style>

<script language="javascript" type="text/javascript">
/*
  appName: JSOV 0.1
  Author: Billy Chow
  Webpage: http://www.dreammx.com
  E-mail: billychow#tom.com
*/
function showObj(obj) {
  var obj= eval(obj);
  var str='<div class="formated">';
  for (prop in obj) {
    str +='<div class="o_prop_name"><a href="#" title="next" onClick="changeObj(this.innerText)">' +prop+ '</a></div>=<div class="o_prop_value">' +obj[prop]+ '</div><br />';
  }
  str += '</div>';
  document.all.txt3.innerHTML=str;
}
function changeObj(txt) {
  var prefix = document.all.txtObj.value;
  document.all.txtObj.value = prefix+'.'+txt;
  showObj(document.all.txtObj.value);
}
function eraser() {
  var tmpstr = document.all.txtObj.value;
  tmpstr=tmpstr.replace(/\.\w*$/ig,"");
  document.all.txtObj.value=tmpstr;
  showObj(tmpstr);
}
</script>

<body>
<h1>JavaScript Object Viewer 0.1</h1>
<div id="txt1">
Input your object name here: <input type="text" name="txtObj" value="window" />  <input type="button" name="btnSubmit" value="View" onClick="showObj(document.all.txtObj.value);" />  <input type="button" name="btnBack" value="Back" onClick="eraser();" />  <input type="button" name="btnDisp" value="DispVal" onClick="alert(eval(document.all.txtObj.value));" />
</form>
</div>
<br />
<div id="txt2">The Object has these attributes:</div>
<hr noshade="noshade" />
<div id="txt3">
</div>
</body>
</html>

Tags: