js基础

布局：HTML+CSS

属性：确定修改哪些属性

事件：确定用户进行哪些操作

编写js：在事件中，用js来修改页面的样式

 

 

 例子：

1、鼠标提示框：

属性：样式的display，obj.style.[.......]

事件：onmouseover、onmouseout

具体：鼠标移入到input时，div1显示，鼠标离开时，div1隐藏

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>鼠标移入显示，移出隐藏</title>
<style>
#div1 {width:100px; height:200px; background:#CCC; display:none;}
</style>

</head>

<body>
<input type="checkbox" onmouseover="document.getElementById('div1').style.diaplay='block';" 
onmouseout="document.getElementById('div1').style.diaplay='none';"/> <div id="div1"> 。。。。。。 </div> </body> </html>

 

document.getElementById是为了解决兼容性问题才引入的

 

posted on 2017-03-03 13:58  想要逆袭的学渣  阅读(62)  评论(0)  编辑  收藏  举报

导航