JS遍歷頁面所有對象屬性及實現(xiàn)方法
for...in循環(huán)的Javascript示例：
<html>
<head>
<title>一個使用到for...in循環(huán)的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
// 創(chuàng)建一個對象 myObject 以及三個屬性 sitename, siteurl, sitecontent。
var myObject = new Object();
myObject.sitename = "布啦布啦";
myObject.siteurl = "blabla.cn";
myObject.sitecontent = "網(wǎng)頁教程代碼圖庫的中文站點";
//遍歷對象的所有屬性
for (prop in myObject)
{
document.write("屬性 '" + prop + "' 為 " + myObject[prop]);
document.write("<br>");
}
</script>
</body>
</html>
今天網(wǎng)上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]為對應(yīng)屬性的值
props += p + " = " + obj [ p ] + " \t " ;
}
}
// 最后顯示所有的屬性
alert ( props ) ;
}
AJAX的JavaScript的反射機(jī)制,反射機(jī)制指的是程序在運行時能夠獲取自身的信息。例如一個對象能夠在運行時知道自己有哪些方法和屬性。 在JavaScript中利用for(…in…)語句實現(xiàn)反射，其語法如下：
for(var p in obj){
//語句
}
在Ajax編程中，經(jīng)常要能動態(tài)的改變界面元素的樣式，這可以通過對象的style屬性來改變，比如要改變背景色為紅色，可以這樣寫：
element.style.backgroundColor="#ff0000";
基本上CSS里擁有的屬性在JavaScript中都能夠使用：
function setStyle(_style){
//得到要改變樣式的界面對象
var element=getElement();
element.style=_style;
}
直接將整個style對象作為參數(shù)傳遞了進(jìn)來：
var style={
color:#ffffff,
backgroundColor:#ff0000,
borderWidth:2px
}
這時可以這樣調(diào)用函數(shù)：
setStyle(style);
或者直接寫為：
setStyle({ color:#ffffff,backgroundColor:#ff0000,borderWidth:2px});
這段代碼看上去沒有任何問題，但實際上，在setStyle函數(shù)內(nèi)部使用參數(shù)_style為element.style賦值時，如果element原先已經(jīng)有了一定的樣式，例如曾經(jīng)執(zhí)行過：
element.style.height="20px";
而_style中卻沒有包括對height的定義，因此element的height樣式就丟失了，不是最初所要的結(jié)果。要解決這個問題，可以用反射機(jī)制來重寫setStyle函數(shù)：
function setStyle(_style){
//得到要改變樣式的界面對象
var element=getElement();
for(var p in _style){
element.style[p]=_style[p];
}
}
程序中遍歷_style的每個屬性，得到屬性名稱，然后再使用方括號語法將element.style中的對應(yīng)的屬性賦值為_style中的相應(yīng)屬性的
以上這篇JS遍歷頁面所有對象屬性及實現(xiàn)方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript對JSON數(shù)組簡單排序操作示例
這篇文章主要介紹了JavaScript對JSON數(shù)組簡單排序操作,結(jié)合實例形式分析了javascript使用sort()方法針對json數(shù)組元素排序的相關(guān)操作技巧與注意事項,需要的朋友可以參考下2019-01-01
vuex是基于vuex.js的狀態(tài)管理工具,可以把它理解為一個倉庫,下面這篇文章主要給大家介紹了關(guān)于uniapp中如何使用vuex并持久化的相關(guān)資料,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-06-06
Javascript中void是一個操作符，該操作符指定要計算一個表達(dá)式但是不返回值，有不了解的朋友可以參考下本文2013-11-11
這篇文章主要介紹了JavaScript實現(xiàn)同一個頁面打開多張圖片，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12
JavaScript代碼實現(xiàn)微博批量取消關(guān)注功能
這篇文章主要介紹了JavaScript代碼實現(xiàn)微博批量取消關(guān)注功能,本文通過實例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2021-02-02
Javascript 鍵盤keyCode鍵碼值表，需要的朋友可以保存一份。2009-12-12
這篇文章主要介紹了Bootstrap Table中的多選框刪除功能，非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2018-07-07
這篇文章主要介紹了js創(chuàng)建對象的幾種方法及繼承，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04![分享一道筆試題[有n個直線最多可以把一個平面分成多少個部分]](http://img.jbzj.com/images/xgimg/bcimg8.png)
分享一道筆試題[有n個直線最多可以把一個平面分成多少個部分]
今天地鐵上和一個同事閑聊,給我說的一道題,回來想了想,寫出來的,說來慚愧,我用的是行測方面數(shù)字推理里面的知識歸納出來的,當(dāng)然這個可以用遞歸寫出來,說說我的代碼,以及遞歸的思路2012-10-10
本文主要給大家分享一下在編寫JavaScript代碼的時候存在的一些方法和技巧，雖然有時候條條大路都通向羅馬，但是也許總會有那么一條最短的路徑可走。希望通過以下幾點JavaScript技巧讓大家的代碼“化繁為簡，化簡為精”2017-05-05