借用别人的代码,写一些注释,加深理解
实现功能:当鼠标悬停在a元素上时,显示a元素附带注释信息。
编程思路:创建a 元素,注释信息用div显示,当鼠标悬停至a元素时以鼠标悬停位置作为div的原点显示信息。
具体代码:
<a href="http://www.baidu.com" title="百度公司">百度</a> //a标签中的title属性可以让鼠标悬停在超链接上的时候,显示该超链接的文字注释,title内容为显示的内容
<br />
<a href="http://www.baidu.com" title="新浪公司" >新浪</a>
<br />
</body>
<script type="text/javascript">
var a = document.getElementsByTagName("a"); //获取所有的a标签元素
function Event(){
for(i=0;i<a.length;i++){ //遍历a元素
var link = a[i];
link.onmouseover = onmouse(); //鼠标经过、悬停时调用onmouse()
}
function onmouse(){
var div = document.createElement("div"); //创建一个新的div元素
div.style.position = "absolute"; //定义div对齐方式为absolute
div.style.top=window.event.clientY; //div所处位置的上边对齐Y轴
div.style.left=window.event.clientX; //div所处位置的左边对齐X轴
document.body.appendChild(div); //将div元素挂到已有的body元素之后
}
}
</script>