function _javascript techniques for displaying all properties and methods of JS objects

To see the actual effect, you can first declare some properties and methods, otherwise it is not visible, look down the example.

Copy Code code as follows:

function Showobjproperty (OBJ)
{
var propertylist= ';
var propertycount=0;
For (i in OBJ) {
if (obj.i!=null)
propertylist=propertylist+i+ ' attribute: ' +obj.i+ ' \ r \ n ';
Else
propertylist=propertylist+i+ ' method \ r \ n ';
}
alert (propertylist);
}

Copy Code code as follows:

<script type= "Text/javascript" >
Create an object MyObject and three properties SiteName, SiteURL, sitecontent.
var myObject = new Object ();
Myobject.sitename = "cloth and cloth";
Myobject.siteurl = "blabla.cn";
myobject.sitecontent = "Web Tutorial Code Gallery's Chinese site";
Traverse all properties of an object
For (prop in MyObject)
{
document.write ("property" + Prop + "' for" + Myobject[prop]);
document.write ("
");
}
</script>

Today, the Java Tang blog on the web found a way to traverse the names and values of all the properties of a JavaScript object, so it is intuitive and convenient to use the method. The code is as follows:

Copy Code code as follows:

/*
* Used to traverse all property names and values of the specified object
* obj needs to traverse the object
* Author:jet Mah
*/
function Allprpos (obj) {
Used to hold all the property names and values
var props = "";
Start traversal
For (var p in obj) {
Method
if (typeof (obj [p]) = = "function") {
obj [P] ();
} else {
P is the property name, Obj[p] is the value of the corresponding property
Props + = p + "=" + obj [P] + "T";
}
}
All properties are displayed at the end
alert (props);
}

The reflection mechanism of Ajax JavaScript, reflection mechanism refers to the program at runtime to obtain its own information. For example, an object can know at runtime what methods and attributes they have. Use for (... in ...) in JavaScript Statement to implement reflection with the following syntax:

For (var p in obj) {
Statement
}

In AJAX programming, it is often possible to dynamically change the style of an interface element, which can be changed by the object's style attribute, such as to change the background color to red, which can be written like this:
Element.style.backgroundcolor= "#ff0000";

Basically, the attributes in CSS are available in javascript:

Copy Code code as follows:

function SetStyle (_style) {
Get the interface object to change the style
var element=getelement ();
Element.style=_style;
}

The entire style object is passed directly as a parameter in:

Copy Code code as follows:

var style={
Color: #ffffff,
BackgroundColor: #ff0000,
borderwidth:2px
}

You can call the function this way:
SetStyle (style);

or write directly as:
SetStyle ({color: #ffffff, BackgroundColor: #ff0000, borderwidth:2px});

This code does not seem to have any problems, but in fact, when you use the parameter _style for Element.style assignment inside the SetStyle function, if the element already has a certain style, such as once executed:
Element.style.height= "20px";

The _style does not include the definition of height, so the height style of the element is lost, not the original result. To solve this problem, you can override the SetStyle function with a reflection mechanism:

Copy Code code as follows:

function SetStyle (_style) {
Get the interface object to change the style
var element=getelement ();
For (var p in _style) {
ELEMENT.STYLE[P]=_STYLE[P];
}
}

The program iterates through each property of the _style, gets the property name, and then uses the bracket syntax to assign the corresponding property in the Element.style to the value of the corresponding property in _style. Thus, only the specified style is changed in the element, and the other styles do not change, and the desired result is obtained. ^-^