临近期末,各科作业接踵而至,实验报告一大堆,本周学习JS任务自行减少。
给使用sublime编译器的小伙伴儿们推荐一个博客,其中文章较多关于JS的学习文章,并且还有sublime的一些使用技巧
下面为一些简单的知识点学习~
JS内存管理注意事项:
1、避免不必要的全局变量
2、及时解除不再使用的变量引用,即将其赋值为null
3、合理使用函数,函数中的局部变量函数执行结束后就会自动释放内存学会简单的动态添加元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>动态创建元素</title>
</head>
<body>
<input id="Button1" type="button" value ="Button1" >
<input id="Button2" type="button" value = "动态添加事件" onclick="addClick(Button1)">
<script type = "text/javascript">
//添加事件的参数,参数为元素的标识
function addClick(obj){
obj.onclick=function(){
alert('动态添加事件成功');
}
}
</script>
</body>
</html>
- 防止页面操作冲击代码
<!DOCTYPE html>
<htmml>
<head>
<meta charset= "utf-8">
<title>防止按钮重击</title>
</head>
<body>
<input id="button" type="button" value="提交按钮" onclick=check()>
<script>
function check(){
if (window.document.readyState == 'complete'){
alert("加载完毕可以继续");
return true;
}else{
alert("正在处理请等待");
return false;
}
}
</script>
</body>
</htnl>
- 根据视频教学制作了简单的注册页面,重新温习了一下对html5,css的简单操作。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>注册页面</title>
<style type="text/css">
table{
margin: 20px auto; //值被设置为相对边的值
border: 2px solid orange;
}
td{
height: 20px;
line-height: 40px;
padding: 10px;
width: 200px;
background: rgba(100,50,10,0.3);
text-align: right; //文字右对齐
font-size: 24px;
}
select,input{
width: 200px;
height: 40px;
font-size: 18px;
}
[type=radio]{
width: 30px;
height: 30px;
}
[type=submit],[type=reset]{
width: 100px;
border-radius: 25px;
font-size: 20px;
outline: none;
}
td:first-child{
width: 150px;
}
</style>
</head>
<body>
<table>
<tr>
<td>用户名:</td>
<td><input type="text" id="st1"></td>
</tr>
<tr>
<td>联系电话:</td>
<td><input type ="text" id="st2"></td>
</tr>
<tr>
<td>性别:</td>
<td style="text-align":left;>
<!-- 这里的name必须相同-->
<input type="radio" name="sex" id = "sex1">男
<input type="radio" name="sex" id = "sex2">女
</td>
</tr>
<tr>
<td>学历:</td>
<td>
<select id ="select">
<option value="高中">高中</option>
<option value="大专">大专</option>
<option value="本科">本科</option>
<option value="研究生">研究生</option>
<select>
</td>
</tr>
<tr>
<td>密码:</td>
<td><input type="text" id ="st3"</td>
</tr>
<tr>
<td>确认密码:</td>
<td><input type="text" id ="st4"</td>
</tr>
<tr>
<td colspan="2"><!--横向合并单元格-->
<input type="submit" id="btn1">
<input type="reset" id="btn2" value ="重置">
</td>
</tr>
</table>
</body>
</html>
以上就是对本周学习的总结。
最后给大家推荐一首魔性的音乐 ——》
很合本人的口味呢(斜眼笑~)