顯示js對象所有屬性和方法的函數_javascript技巧

來源:互聯網
上載者:User
要想看到實際效果,可以先聲明一些屬性跟方法,否則是看不到,仔細往下看有例子的。
複製代碼 代碼如下:

function ShowObjProperty(Obj)
{
var PropertyList='';
var PropertyCount=0;
for(i in Obj){
if(Obj.i !=null)
PropertyList=PropertyList+i+'屬性:'+Obj.i+'\r\n';
else
PropertyList=PropertyList+i+'方法\r\n';
}
alert(PropertyList);
}


複製代碼 代碼如下:

<script type="text/javascript">
// 建立一個對象 myObject 以及三個屬性 sitename, siteurl, sitecontent。
var myObject = new Object();
myObject.sitename = "布啦布啦";
myObject.siteurl = "blabla.cn";
myObject.sitecontent = "網頁教程代碼圖庫的中文網站";
//遍曆對象的所有屬性
for (prop in myObject)
{
document.write("屬性 '" + prop + "' 為 " + myObject[prop]);
document.write("
");
}
</script>



今天網上Java Tang部落格找到了一個用來遍曆JavaScript某個對象所有的屬性名稱和值的方法,這樣想使用方法的時候非常的直觀和方便。代碼如下:
複製代碼 代碼如下:

/*
* 用來遍曆指定對象所有的屬性名稱和值
* obj 需要遍曆的對象
* author: Jet Mah
*/
function allPrpos ( obj ) {
// 用來儲存所有的屬性名稱和值
var props = "" ;
// 開始遍曆
for ( var p in obj ){
// 方法
if ( typeof ( obj [ p ]) == " function " ){
obj [ p ]() ;
} else {
// p 為屬性名稱,obj[p]為對應屬性的值
props += p + " = " + obj [ p ] + " \t " ;
}
}
// 最後顯示所有的屬性
alert ( props ) ;
}

AJAX的JavaScript的反射機制,反射機制指的是程式在運行時能夠擷取自身的資訊。例如一個對象能夠在運行時知道自己有哪些方法和屬性。 在JavaScript中利用for(…in…)語句實現反射,其文法如下:

for(var p in obj){
//語句
}

在Ajax編程中,經常要能動態改變介面元素的樣式,這可以通過對象的style屬性來改變,比如要改變背景色為紅色,可以這樣寫:
element.style.backgroundColor="#ff0000";

基本上CSS裡擁有的屬性在JavaScript中都能夠使用:
複製代碼 代碼如下:

function setStyle(_style){
//得到要改變樣式的介面對象
var element=getElement();
element.style=_style;
}

直接將整個style對象作為參數傳遞了進來:
複製代碼 代碼如下:

var style={
color:#ffffff,
backgroundColor:#ff0000,
borderWidth:2px
}

這時可以這樣調用函數:
setStyle(style);

或者直接寫為:
setStyle({ color:#ffffff,backgroundColor:#ff0000,borderWidth:2px});

這段代碼看上去沒有任何問題,但實際上,在setStyle函數內部使用參數_style為element.style賦值時,如果element原先已經有了一定的樣式,例如曾經執行過:
element.style.height="20px";

而_style中卻沒有包括對height的定義,因此element的height樣式就丟失了,不是最初所要的結果。要解決這個問題,可以用反射機制來重寫setStyle函數:
複製代碼 代碼如下:

function setStyle(_style){
//得到要改變樣式的介面對象
var element=getElement();
for(var p in _style){
element.style[p]=_style[p];
}
}

程式中遍曆_style的每個屬性,得到屬性名稱,然後再使用方括弧文法將element.style中的對應的屬性賦值為_style中的相應屬性的值。從而,element中僅改變指定的樣式,而其他樣式不會改變,得到了所要的結果。^-^

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.