JS当前属性查询实现代码

单页面下载

<!doctype html> <html> <head> <meta charset="utf-8" /> <title>网站标题</title> <style type="text/css"> #div1 .bObject { cursor:pointer; color:Blue; } #div1 .bError { color:Red; } #div1 div { margin-left:20px; border:solid 1px gray; padding:5px; } #div1 th { text-align:left; background-color:#fef; } #div1 td { vertical-align:top; } </style> <script type="text/javascript"> function getObject() { var chkNull = document.getElementById('chkNull'); eval('var obj=' + document.getElementById('txt').value + ';'); var str = '<table border="1" cellpadding="3" style="border-collapse:collapse;">'; str += '<tr><th>类型</th><th>名称</th><th>值</th></tr>'; for (var i in obj) { var strItem = '<tr>'; try { if(chkNull.checked && (obj[i] == null || obj[i] == undefined)){ continue; } strItem += '<td>' + typeof (obj[i]) + '</td>'; if (obj[i] != null && typeof (obj[i]) == 'object') { strItem += '<td><b class="bObject">' + i + '</b></td>'; } else { strItem += '<td><b>' + i + '</b></td>'; } if (obj[i] != null && (typeof (obj[i]) == 'string' || typeof (obj[i]) == 'function')) { strItem += '<td>' + formatHTML(obj[i]) + '</td>'; } else { strItem += '<td>' + obj[i] + '</td>'; } strItem += '</tr>'; } catch (e) { strItem = '<tr><td class="bError" colspan="3">' + i + ' error:' + e + '</td></tr>'; } str += strItem; } str += '</table>'; var div1 = document.getElementById('div1'); div1.innerHTML = str; var bs = div1.getElementsByTagName('b'); for (var i = 0; i < bs.length; i++) { if (bs[i].className == 'bObject') { bs[i].onclick = show; } } } function formatHTML(obj) { var strHTML = obj.toString(); if (strHTML.length > 10000) { return '字符长度：' + strHTML.length + '字节'; } strHTML = strHTML.replace(/&/g, '&amp;'); strHTML = strHTML.replace(/</g, '&lt;'); strHTML = strHTML.replace(/>/g, '&gt;'); strHTML = strHTML.replace(/\n/g, '<br>'); strHTML = strHTML.replace(/\t/g, '&emsp; &emsp; '); strHTML = strHTML.replace(/ /g, '&nbsp;'); return strHTML; } function goUp() { var txt = document.getElementById('txt'); if (txt.value.lastIndexOf(']') == txt.value.length - 1) { txt.value = txt.value.substr(0, txt.value.lastIndexOf('[')); getObject(); return; } if (txt.value.indexOf('.') != -1) { txt.value = txt.value.substr(0, txt.value.lastIndexOf('.')); getObject(); return; } } function show() { var txt = document.getElementById('txt'); var r = /^\+?[0-9][0-9]*$/; //正整数 if (r.test(this.innerHTML)) { txt.value += '[' + this.innerHTML + ']'; } else { txt.value += '.' + this.innerHTML; } getObject(); } </script> </head> <body> <div> <input id="txt" type="text" value="window" style="width:300px;" /> <div style="margin:10px 0px;"> <input onclick="getObject();" type="button" value="检 测" /> <input onclick="goUp();" type="button" value="向 上" /> <input id="chkNull" type="checkbox" checked /><label for="chkNull">屏蔽空值</label> </div> </div> <div id="div1" style="line-height:1.5; font-family:Consolas; font-size:14px;"> </div> <script type="text/javascript"> getObject(); </script> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

打包下载

频道导航

JS当前属性查询实现代码

您可能感兴趣的文章: