title = this.innerHTML; 这句代码什么意思啊？？？ 为什么删掉之后整个页面都没了呢？？ 求指教
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>ToolTip效果</title>
<style>
body {
font-size: 18px;
line-height: 1.8;
font-family: "Microsoft YaHei", "微软雅黑";
}
#demo {
width: 500px;
margin: 30px auto;
padding: 20px 30px;
position: relative;
background-color: #fff;
}
#demo h2 {
color: #03F;
}
#demo .tooltip {
color: #03F;
cursor: help;
}
/*add box style */
.box{
position:absolute;
background-color:#eee;
color:#fff;
padding:10px;
border:#999 solid 1px;
border-radius: 5px;
box-shadow:2px 2px 4px #ccc;
width:300px;
height: 200px;
}
.box iframe{
margin:0px;
padding:0px;
border:none;
background-color: #FFF;
width:inherit;
height:inherit;
}
</style>
</head>
<body>
<div id="demo">
<p><a class="tooltip" id="tooltip1">慕课网</a>的使命是传播互联网最前沿技术，帮助更多的人实现梦想！在慕课网前端开发、
<a class="tooltip" id="tooltip2">Android</a>开发、<a class="tooltip" id="tooltip3">iOS</a>开发等课程统统有，你还在等什么，赶紧来学习吧。
</p>
</div>
<script type="text/javascript">
window.onload=function(){
//在demo中添加tipbox
//给tipbox添加over leave event
var demo = document.getElementById("demo"),
tips = demo.getElementsByTagName("a");
for(var i=0; i<tips.length; i++){
tips[i].onmouseenter=function(){
var top = this.offsetTop,
left = this.offsetLeft,
title = this.innerHTML;
box = document.createElement("div");
box.className = "box";
box.id = "box";
box.style.left = left+"px";
box.style.top = top+20+"px";
box.innerHTML = "<iframe src='http://baike.baidu.com/search?word="+title+"&enc=utf8'></iframe>";
demo.appendChild(box);
//console.log(top+':'+left);
}
tips[i].onmouseleave=function(){
demo.removeChild(demo.lastChild);
}
}
}
</script>
</body>
</html>
