做一个事件On_Attr_Change，监听元素属性的变化，以便属性变化的时候作出处理
<html>
<head>
<script>
function AddListeners() {
var elemToCheck = document.getElementById("myDiv");
if (elemToCheck.addEventListener) { // Firefox, Opera and Safari
elemToCheck.addEventListener('DOMAttrModified', OnAttrModified, false);
}
else if (elemToCheck.attachEvent) { // Internet Explorer
elemToCheck.attachEvent('onpropertychange', OnAttrModified);
}
}
function OnAttrModified(event) {
var txt = "";
if (event.attrChange) {
// Firefox, Safari, Opera
txt += "The element: " + event.target;
txt += "\nproperty: " + event.attrName;
txt += "\noriginal value: " + event.prevValue;
txt += "\n changed to: " + event.newValue;
}
else {
// Internet Explorer
txt += "The element: " + event.srcElement.tagName;
txt += "\nproperty: " + event.propertyName;
var elem = event.srcElement;
txt += "\nchanged value: " + elem.attributes[event.propertyName].value;
}
alert(txt);
}
function ChangeDDD() {
var div = document.getElementById("myDiv");
div.setAttribute("ddd", "New Attribute");
}
</script>
</head>
<body onload="AddListeners ();">
<button onclick="ChangeDDD ();">Change ddd Attribute!</button>
<div id="myDiv" ddd="Old Attribute">divdivdivdivdivdivdivdiv</div>
</body>
</html>