给图像热区加边框的通用方法

 function inArea(img){ var id = '_$area$_', pos = this.coords.split(','), area = document.getElementById(id); if (area) outArea(area); area = document.createElement('a'); area.id = id, area.href = this.href, area.target = this.target, area._area = this; pos[0] -= 0, pos[1] -= 0, pos[2] -= pos[0], pos[3] -= pos[1]; with (area.style) { position = 'absolute'; left = img.offsetLeft + pos[0] - 1; top = img.offsetTop + pos[1] - 1; width = pos[2]; height = pos[3]; border = '1px solid #ff0000'; } area.onmouseout = function(){ outArea(area); } document.attachEvent ? this.parentNode.appendChild(area) : this.parentNode.replaceChild(area, this); } function outArea(elem){ document.attachEvent ? elem.parentNode.removeChild(elem) : elem.parentNode.replaceChild(elem._area, elem); } window.onload = function(){ var map, areas, j, i = 0, imgs = document.images; for (; i < imgs.length; i++) { map = imgs[i].useMap; if (map) if (map = document.getElementById(map.slice(1))) { areas = map.getElementsByTagName('area'); for (j = 0; j < areas.length; j++) areas[j].onmouseover = (function(img){ return function(){ inArea.call(this, img); } })(imgs[i]); } }; }

 

可能还有些小bug