JS當前屬性查詢實現(xiàn)代碼

更新時間：2010年12月06日 21:22:42 作者：

JS中的for in 可遍歷變量的所有屬性！利用此特性制作了一個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 + '字節(jié)'; } 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]*$/; //正整數(shù) 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   class="o2dsipk"   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需再刷新一下頁面才能執(zhí)行]

打包下載

屬性

深入解析ES6中的promise
ES6中的promise對象很早就聽說過，據(jù)說是為了解決我們使用回調產生回調地獄的問題。今天小編就帶領大家通過本文學習下es6中的promise，感興趣的朋友跟隨小編一起看看吧
2018-11-11
Javascript Memoizer淺析
這篇文章主要介紹了Javascript Memoizer淺析,Memoizer貌似是一種緩存方法調用結果的功能,小編也沒有太懂,需要的朋友參考下吧
2014-10-10
微信小程序使用Vant Weapp組件庫的方法步驟
這篇文章主要給大家介紹了關于微信小程序使用Vant Weapp組件庫的相關資料，文中通過示例代碼介紹的非常詳細，對大家學習或者使用微信小程序具有一定的參考學習價值，需要的朋友們下面來一起學習學習吧
2019-08-08
每天一篇javascript學習小結（Boolean對象）
這篇文章主要介紹了javascript中的Boolean對象知識點，對Boolean對象的基本使用方法進行解釋，一段很詳細的代碼介紹，感興趣的小伙伴們可以參考一下
2015-11-11
Ajax提交與傳統(tǒng)表單提交的區(qū)別說明
本篇文章主要是對Ajax提交與傳統(tǒng)表單提交的區(qū)別進行了詳細的介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2014-02-02
html代碼調試腳本
html代碼調試腳本...
2006-07-07
javascript String 的擴展方法集合
String 的擴展方法集合，可以是javascript對string的功能更多
2008-06-06
微信小程序單選框自定義賦值
這篇文章主要介紹了微信小程序單選框如何自定義賦值，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2020-05-05
JavaScript深入淺出__proto__和prototype
這篇文章主要介紹了JavaScript深入淺出__proto__和prototype，文章基于JavaScript的相關資料展開詳細的內容介紹。具有一定的參考價值，需要的小伙伴可以參考一下
2022-05-05
前臺js對象在后臺轉化java對象的問題探討
在開發(fā)項目中多次遇到前臺js對象在后臺轉化java對象的問題，下面就為大家介紹下前臺js對象轉后臺java對象，感興趣的朋友可以了解下
2013-12-12