JS遍歷頁(yè)面所有對(duì)象屬性及實(shí)現(xiàn)方法
for...in循環(huán)的Javascript示例：
<html>
<head>
<title>一個(gè)使用到for...in循環(huán)的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
// 創(chuàng)建一個(gè)對(duì)象 myObject 以及三個(gè)屬性 sitename, siteurl, sitecontent。
var myObject = new Object();
myObject.sitename = "布啦布啦";
myObject.siteurl = "blabla.cn";
myObject.sitecontent = "網(wǎng)頁(yè)教程代碼圖庫(kù)的中文站點(diǎn)";
//遍歷對(duì)象的所有屬性
for (prop in myObject)
{
document.write("屬性 '" + prop + "' 為 " + myObject[prop]);
document.write("<br>");
}
</script>
</body>
</html>
今天網(wǎng)上Java Tang博客找到了一個(gè)用來(lái)遍歷JavaScript某個(gè)對(duì)象所有的屬性名稱和值的方法，這樣想使用方法的時(shí)候非常的直觀和方便。代碼如下：
/*
* 用來(lái)遍歷指定對(duì)象所有的屬性名稱和值
* obj 需要遍歷的對(duì)象
* author: Jet Mah
*/
function allPrpos ( obj ) {
// 用來(lái)保存所有的屬性名稱和值
var props = "" ;
// 開(kāi)始遍歷
for ( var p in obj ){
// 方法
if ( typeof ( obj [ p ]) == " function " ){
obj [ p ]() ;
} else {
// p 為屬性名稱，obj[p]為對(duì)應(yīng)屬性的值
props += p + " = " + obj [ p ] + " \t " ;
}
}
// 最后顯示所有的屬性
alert ( props ) ;
}
AJAX的JavaScript的反射機(jī)制,反射機(jī)制指的是程序在運(yùn)行時(shí)能夠獲取自身的信息。例如一個(gè)對(duì)象能夠在運(yùn)行時(shí)知道自己有哪些方法和屬性。 在JavaScript中利用for(…in…)語(yǔ)句實(shí)現(xiàn)反射，其語(yǔ)法如下：
for(var p in obj){
//語(yǔ)句
}
在Ajax編程中，經(jīng)常要能動(dòng)態(tài)的改變界面元素的樣式，這可以通過(guò)對(duì)象的style屬性來(lái)改變，比如要改變背景色為紅色，可以這樣寫：
element.style.backgroundColor="#ff0000";
基本上CSS里擁有的屬性在JavaScript中都能夠使用：
function setStyle(_style){
//得到要改變樣式的界面對(duì)象
var element=getElement();
element.style=_style;
}
直接將整個(gè)style對(duì)象作為參數(shù)傳遞了進(jìn)來(lái)：
var style={
color:#ffffff,
backgroundColor:#ff0000,
borderWidth:2px
}
這時(shí)可以這樣調(diào)用函數(shù)：
setStyle(style);
或者直接寫為：
setStyle({ color:#ffffff,backgroundColor:#ff0000,borderWidth:2px});
這段代碼看上去沒(méi)有任何問(wèn)題，但實(shí)際上，在setStyle函數(shù)內(nèi)部使用參數(shù)_style為element.style賦值時(shí)，如果element原先已經(jīng)有了一定的樣式，例如曾經(jīng)執(zhí)行過(guò)：
element.style.height="20px";
而_style中卻沒(méi)有包括對(duì)height的定義，因此element的height樣式就丟失了，不是最初所要的結(jié)果。要解決這個(gè)問(wèn)題，可以用反射機(jī)制來(lái)重寫setStyle函數(shù)：
function setStyle(_style){
//得到要改變樣式的界面對(duì)象
var element=getElement();
for(var p in _style){
element.style[p]=_style[p];
}
}
程序中遍歷_style的每個(gè)屬性，得到屬性名稱，然后再使用方括號(hào)語(yǔ)法將element.style中的對(duì)應(yīng)的屬性賦值為_(kāi)style中的相應(yīng)屬性的
以上這篇JS遍歷頁(yè)面所有對(duì)象屬性及實(shí)現(xiàn)方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
javascript使用eval或者new Function進(jìn)行語(yǔ)法檢查
使用代碼來(lái)實(shí)現(xiàn)分析代碼的語(yǔ)法，這是一件極其痛苦的事情。簡(jiǎn)單的解決辦法是：使用腳本引擎自己的語(yǔ)法檢查，比方說(shuō)eval( ) 或者new Function( )。2010-10-10
javascript 導(dǎo)出數(shù)據(jù)到Excel(處理table中的元素)
最近做的項(xiàng)目中有個(gè)要求，需要將數(shù)據(jù)導(dǎo)出到Excel中，關(guān)于這個(gè)就不是什么問(wèn)題，網(wǎng)上的資料很多?？僧?dāng)Table中有Input(text)之類的元素是怎么辦？2009-12-12
Bootstrap Table服務(wù)器分頁(yè)與在線編輯應(yīng)用總結(jié)
這篇文章主要介紹了Bootstrap Table服務(wù)器分頁(yè)與在線編輯應(yīng)用總結(jié) 的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08
javascript的繼承在很多框架中都有運(yùn)用，尤其是原型式繼承。首先要理解一個(gè)概念，什么是原型式繼承？所謂的原型式繼承，就是在函數(shù)內(nèi)部先創(chuàng)建一個(gè)臨時(shí)性的構(gòu)造函數(shù)，然后將傳入的對(duì)象做這個(gè)構(gòu)造函數(shù)的原型，最后返回這個(gè)臨時(shí)類型的新實(shí)例2012-07-07
這篇文章主要介紹了JS顯示日歷和天氣的方法,涉及JavaScript日期與時(shí)間的操作技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2016-03-03
Layui數(shù)據(jù)表格之獲取表格中所有的數(shù)據(jù)方法
今天小編就為大家分享一篇Layui數(shù)據(jù)表格之獲取表格中所有的數(shù)據(jù)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-08-08
Bootstrap每天必學(xué)之導(dǎo)航條，本文向大家講解了多種多樣的導(dǎo)航條，以及導(dǎo)航條中元素的實(shí)現(xiàn)方法，感興趣的小伙伴們可以參考一下2015-11-11
今天希望實(shí)現(xiàn)一個(gè)，直接在網(wǎng)頁(yè)上選中文本，點(diǎn)擊收藏夾的鏈接（javascript）即可彈出新窗口（類似“百度搜藏”和“QQ書簽”），新窗口中的文本框即顯示了選中的文本。2008-12-12
單例模式的定義是：保證一個(gè)類僅有一個(gè)實(shí)例，并提供一個(gè)訪問(wèn)它的全局訪問(wèn)點(diǎn)。文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-08-08
這篇文章主要為大家詳細(xì)介紹了Bootstarp基本模版學(xué)習(xí)教程，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-02-02