ホームページ > ウェブフロントエンド > jsチュートリアル > JS はページのすべてのオブジェクト プロパティと実装メソッドをスキャンします

JS はページのすべてのオブジェクト プロパティと実装メソッドをスキャンします

高洛峰
リリース: 2017-01-14 11:11:56
オリジナル
1682 人が閲覧しました

For...in ループ Javascript の例:

<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>
ログイン後にコピー

今日、オンライン 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 プログラミングでは、インターフェイス要素のスタイルを動的に変更する必要があることがよくあります。背景色を赤に変更するには、次のように記述できます:

element.style.backgroundColor="#ff0000";

基本的に、CSS のすべてのプロパティは次のように使用できます。 JavaScript:

function setStyle(_style){
//得到要改变样式的界面对象
var element=getElement();
element.style=_style;
}
ログイン後にコピー


直接変更 スタイル オブジェクト全体がパラメータとして渡されます:

var style={
color:#ffffff,
backgroundColor:#ff0000,
borderWidth:2px
}
ログイン後にコピー

この時点で、関数は次のように呼び出すことができます:
setStyle(style);

または記述することもできます直接次のように指定します:
setStyle({ color: #ffffff,backgroundColor: #ff0000, borderWidth: 2px});

このコードには問題がないように見えますが、実際には、パラメータ _style を使用して要素に値を割り当てる場合に問題があります。 setStyle 関数内の style、要素がすでに特定のスタイルを持っている場合、たとえばそれが実行されている場合:
element.style.height="20px";

ただし、 _style には高さの定義が含まれていないため、高さは要素のスタイルが失われますが、これは本来望ましい結果ではありません。この問題を解決するには、リフレクション メカニズムを使用して setStyle 関数を書き換えます。

function setStyle(_style){
//得到要改变样式的界面对象
var element=getElement();
for(var p in _style){
element.style[p]=_style[p];
}
}
ログイン後にコピー

このプログラムは、_style の各属性を走査して属性名を取得し、角かっこ構文を使用して element.style の対応する属性を割り当てます。 _style の対応する属性については

ページ上のすべてのオブジェクト属性と実装メソッドの上記の JS トラバースは、エディターによって共有されるすべての内容です。これが参考になれば幸いです。また、皆さんが PHP 中国語をサポートしてくれることを願っています。 Webサイト。

ページ上のすべてのオブジェクト プロパティと実装メソッドを横断する JS に関連するその他の記事については、PHP 中国語 Web サイトに注目してください。


関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート