Maison > interface Web > js tutoriel > le corps du texte

JS parcourt toutes les propriétés d'objet et méthodes d'implémentation de la page

高洛峰
Libérer: 2017-01-14 11:11:56
original
1649 Les gens l'ont consulté

Exemple Javascript de for...in loop :

<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>
Copier après la connexion

Aujourd'hui, le blog Java Tang sur Internet a trouvé une méthode pour parcourir tous les noms et valeurs d'attributs d'une méthode objet JavaScript, elle est très intuitive et pratique lorsque vous souhaitez utiliser la méthode. Le code est le suivant :

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


Le mécanisme de réflexion JavaScript d'AJAX Le mécanisme de réflexion signifie que le programme peut obtenir ses propres informations lorsqu'il l'est. en cours d'exécution. Par exemple, un objet peut savoir au moment de l’exécution de quelles méthodes et propriétés il dispose. Utilisez l'instruction for(…in…) en JavaScript pour implémenter la réflexion. La syntaxe est la suivante :

for(var p in obj){
//语句
}
Copier après la connexion

En programmation Ajax, il est souvent nécessaire de changer dynamiquement le style de éléments d'interface. Ceci peut être modifié via l'attribut de style de l'objet. Par exemple, si vous souhaitez changer la couleur d'arrière-plan en rouge, vous pouvez écrire comme ceci :

element.style.backgroundColor="# ff0000";

En gros, ce que vous avez dans les attributs CSS peut être utilisé en JavaScript :

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


Transmettez directement l'intégralité objet de style en paramètre :

var style={
color:#ffffff,
backgroundColor:#ff0000,
borderWidth:2px
}
Copier après la connexion

Vous pouvez appeler la fonction comme ceci :
setStyle(style);

ou l'écrire directement comme :
setStyle({ color:#ffffff,backgroundColor:#ff0000, borderWidth:2px});

Ce code ne semble poser aucun problème, mais en fait, lorsque le paramètre _style est utilisé pour attribuer une valeur à element.style à l'intérieur de la fonction setStyle, si l'élément a déjà un certain style, par exemple, j'ai exécuté :
element.style.height="20px";

mais _style n'inclut pas la définition de hauteur, donc le style de hauteur de l'élément est perdu, ce qui n'est pas le résultat souhaité d'origine. Pour résoudre ce problème, vous pouvez utiliser le mécanisme de réflexion pour réécrire la fonction setStyle :

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

Parcourez chaque attribut de _style dans le programme, obtenez le nom de l'attribut, puis utilisez square syntaxe des crochets Attribuez l'attribut correspondant dans element.style à l'attribut correspondant dans _style

Le parcours JS ci-dessus de tous les attributs d'objet et méthodes d'implémentation sur la page est tout le contenu partagé par l'éditeur, j'espère que cela pourra aider. C'est une référence pour tout le monde, et j'espère que tout le monde soutiendra le site Web PHP chinois.

Pour plus de parcours JS de toutes les propriétés d'objet et méthodes d'implémentation sur la page, veuillez faire attention au site Web PHP chinois !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal