1:编码实现图片的功能
![微信截图_20190922144924.png](https://upload-images.jianshu.io/upload_images/10622766-1cf341c9068d3a80.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
代码块
def func(arg1):
def inner(arg2):
print(arg1*arg2)
return 'hello,world'
return inner
foo=func(8)
print(foo(8))
print(foo(-1))
结果如下:
64
hello,world
-8
hello,world
2 浮层弹出框
代码块
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta http-equiv="content-Type" charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<title>Title</title>
<style>
.cover {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0,0,0,0.4);
z-index: 99;
}
.modal {
700px;
height: 400px;
position: absolute;
top: 50%;
left: 50%;
margin-left: -350px;
margin-top: -200px;
background-color: white;
z-index: 100;
}
.close {
float: right;
margin-right: 15px;
margin-top: 10px;
font-size: 16px;
}
<!----> .hide {
display: none;
}
</style>
</head>
<body>
<button id="b1">点我弹出</button>
<div class="cover hide"></div>
<div class="modal hide">
<span class="close" id="s1">x</span>
</div>
<script>
var b1Ele = document.getElementById("b1");
b1Ele.onclick=function (ev) {
document.getElementsByClassName("cover")[0].classList.remove("hide");
document.getElementsByClassName("modal")[0].classList.remove("hide");
};
var s1Ele = document.getElementById("s1");
s1Ele.onclick=function (ev) {
document.getElementsByClassName("cover")[0].classList.add("hide");
document.getElementsByClassName("modal")[0].classList.add("hide");
}
</script>
</body>
</html>
3 window.onload标签加载完才执行js
![image.png](https://upload-images.jianshu.io/upload_images/10622766-76e7a8c6499ed139.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
代码块
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta http-equiv="content-Type" charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<title>Title</title>
<script>
// 当页面的标签都加载完之后触发onload事件
window.onload = function (ev) {
// 1. 找到那个标签
var d1Ele = document.getElementById("d1");
console.log(d1Ele);
// 2. 获取标签的文本内容
var s = d1Ele.innerText;
// 3. alert弹出
alert(s)
}
</script>
</head>
<body>
<div id="d1">我是div</div>
</body>
</html>
4 计时器练习
代码块
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<input type="text" id="t1">
<button id="b1">开始</button>
<button id="b2">暂停</button>
<script>
var t;
var res1=document.getElementById('t1');
function f(){
var time1=new Date();
res1.value=time1.toLocaleString();
}
f();
//开始
var b1ele=document.getElementById('b1');
b1ele.onclick=function(ev){
if(!t){
t=setInterval(f,1000);
}
}
//暂停
var b2ele=document.getElementById('b2');
b2ele.onclick=function(ev){
clearInterval(t);
t=null;
}
</script>
</body>
</html>