Heim > Artikel > Web-Frontend > JS durchläuft alle Objekteigenschaften und Implementierungsmethoden der Seite

JS durchläuft alle Objekteigenschaften und Implementierungsmethoden der Seite

高洛峰Original: 2017-01-14 11:11:561631Durchsuche

Javascript-Beispiel für eine for...in-Schleife:

<html>
<head>
<title>一个使用到for...in循环的Javascript示例</title>
</head>
<body>
<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("属性 &#39;" + prop + "&#39; 为 " + myObject[prop]);
document.write("<br>");
}
</script>
</body>
</html>

Heute hat der Java Tang-Blog im Internet eine Methode zum Durchlaufen aller Attributnamen und -werte gefunden Eine JavaScript-Objektmethode ist sehr intuitiv und praktisch, wenn Sie die Methode verwenden möchten. Der Code lautet wie folgt:

/*
* 用来遍历指定对象所有的属性名称和值
* 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 ) ;
}

Der JavaScript-Reflexionsmechanismus von AJAX bedeutet, dass das Programm seine eigenen Informationen erhalten kann, wenn es vorhanden ist läuft. Beispielsweise kann ein Objekt zur Laufzeit wissen, welche Methoden und Eigenschaften es hat. Verwenden Sie die for(…in…)-Anweisung in JavaScript, um die Reflektion zu implementieren. Die Syntax lautet wie folgt:

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

Bei der Ajax-Programmierung ist es oft notwendig, den Stil von zu ändern Schnittstellenelemente. Dies kann über das Stilattribut des Objekts geändert werden. Wenn Sie beispielsweise die Hintergrundfarbe in Rot ändern möchten, können Sie Folgendes schreiben:

element.style.backgroundColor="# ff0000";

Grundsätzlich kann das, was Sie in CSS-Attributen haben, in JavaScript verwendet werden:

function setStyle(_style){
//得到要改变样式的界面对象
var element=getElement();
element.style=_style;
}

Übergeben Sie das Ganze direkt style-Objekt als Parameter:

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

Zu diesem Zeitpunkt können Sie die Funktion wie folgt aufrufen:
setStyle(style);

oder schreiben direkt als:
setStyle({ color: #ffffff, backgroundColor: #ff0000, borderWidth:2px});

Dieser Code scheint kein Problem zu haben, aber tatsächlich, wenn der Parameter _style verwendet wird Weisen Sie element.style innerhalb der setStyle-Funktion einen Wert zu, wenn das Element bereits einen bestimmten Stil hat. Ich habe beispielsweise Folgendes ausgeführt:
element.style.height="20px";

, _style jedoch schon Die Definition der Höhe ist nicht enthalten, sodass der Höhenstil des Elements verloren geht, was nicht das ursprünglich gewünschte Ergebnis ist. Um dieses Problem zu lösen, können Sie den Reflexionsmechanismus verwenden, um die Funktion setStyle neu zu schreiben:

function setStyle(_style){
//得到要改变样式的界面对象
var element=getElement();
for(var p in _style){
element.style[p]=_style[p];
}
}

Durchlaufen Sie jedes Attribut von _style im Programm, rufen Sie den Attributnamen ab und verwenden Sie dann Quadrat Klammersyntax Weisen Sie das entsprechende Attribut in element.style dem entsprechenden Attribut in _style zu

Die obige JS-Durchquerung aller Objektattribute und Implementierungsmethoden auf der Seite ist der gesamte vom Editor freigegebene Inhalt. Ich hoffe, er kann helfen Es ist eine Referenz für alle und ich hoffe, dass jeder die chinesische PHP-Website unterstützt.

Weitere JS-Durchquerungen aller Objekteigenschaften und Implementierungsmethoden auf der Seite finden Sie auf der chinesischen PHP-Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Detaillierte Erläuterung des Unterschieds zwischen der JS-Durchquerung von Arrays und Objekten und den Methoden zur rekursiven Durchquerung von Objekten, Arrays und EigenschaftenNächster Artikel：Detaillierte Erläuterung des Unterschieds zwischen der JS-Durchquerung von Arrays und Objekten und den Methoden zur rekursiven Durchquerung von Objekten, Arrays und Eigenschaften

In Verbindung stehende Artikel

Mehr sehen