![](https://img.haomeiwen.com/i3317466/96d2f7ebd56476ba.png)
小球移动:
ody>
<div id="container">
<div id="boll">
</div>
</div>
<button onclick="start()">绣球寻夫记</button>
<script type="text/javascript">
var timer;
var _boll = document.getElementById("boll");
function start() {
timer = setInterval(function() {
var x = _boll.offsetLeft;
var y = _boll.offsetTop;
if (x >= 1180) {
clearInterval(timer)//停止
}
x += 5;
y += 2;
_boll.style.left = x + "px";
_boll.style.top = y + "px";
},50)
}
</script>
滚动抽奖
<style type="text/css">
#box {
height: 400px;
width: 400px;
border: 1px solid #98FB98;
margin: 200px;
margin-top: 20px;
text-align: center;
}
.msg,.active{
height: 150px;
width: 150px;
background: #A52A2A;
border-radius: 50%;
margin: auto;
text-align: center;
line-height: 150px;
color: white;
font-size: 20px;
margin-top: 50px;
}
#box>button {
width: 100px;
height: 40px;
background: greenyellow;
color: red;
margin-top: 20px;
}
.active {
background: gold;
border: 2px solid springgreen;
}
</style>
</head>
<body>
<div id="box">
<div id="prize" class="msg">
奖品
</div>
<button onclick="play()" id="play">开始抽奖</button>
</div>
<script type="text/javascript">
var goods = ["iPhoneX","报纸","抽纸","娃娃","杯子","气球","再来一次","谢谢惠顾","打火机"];
var _prize = document.getElementById("prize");
var _play = document.getElementById("play");
var flag = true;
var timer;
function play() {
if (flag) {
flag = false;
_play.textContent = "停止抽奖";
_prize.className = "active";
timer = setInterval(function() {
var index = Math.floor(Math.random()*goods.length);
_prize.textContent = goods[index];
},10);
} else {
flag = true;
clearInterval(timer);
_prize.className = "msg";
_play.textContent = "开始抽奖";
}
}
</script>
div 移动
<style type="text/css">
#box {
height: 100px;
width: 100px;
background: cyan;
position: absolute;
cursor: move;
}
</style>
<script type="text/javascript">
window.onload = init;
function init() {
var _box = document.getElementById("box");
_box.onmousedown = function(e) {
var _x = e.clientX - _box.offsetLeft;
var _y = e.clientY - _box.offsetTop;
document.onmousemove = function(ev) {
_box.style.left = ev.clientX - _x + "px";
_box.style.top = ev.clientY - _y + "px";
}
}
_box.onmouseup = function() {
document.onmousemove = null;
}
}
</script>
</head>
<body>
<div id="box">
</div>
</body>
This inspection detects names that should resolve but don't.
Due to dynamic dispatch and duck typing, this is possible in
a limited but useful number of cases.
Top-level and class-level items are supported better than instance items.
s[1:6:2]
s[::-1]
s[::2]
s[12:-5]
python中的可变类型有列表list和字典dict______,
不可变类型有:整型int、浮点型float、字符串型string和元组tuple
Python提供了两个对象比较操作符 ==____和is
来测试两个变量是否指向同一个对象,也可以通过内建函数_type(obj)来测试对象的类型.
boundary 边界
unpack 拆包
x, y, z = eval(input("请输入三个数字:"))
interval 间隔
client 客户
browser 浏览器
三种事件绑定方式
/**
* 在JavaScript中有三种事件绑定方式
*
* 在dom0模型下,有两种方式
*
* 1、在标签内通过属性的方式绑定,不推荐
*
* 2、先获取dom对象,在使用属性的方法绑定 点击推荐
*
*
* 在dom2模型下,有一种方式
* 3、事件监听
*
*/
// function test01(node) {
// console.info(node)
// alert("惊喜有木有!!");
// }
window.onload = init;
function init() {
/**
* 页面加载完成
*/
var _btn = document.getElementById("btn");
// _btn.onclick = function(e) {
// // 第一个形参是事件对象
// console.info(e);
// /**
// * 在事件中,this关键字执行事件源
// *
// */
// console.info(this);
// alert("successful");
// }
_btn.addEventListener("click",function(e) {
console.info(e);
alert("123456");
},true)
// document.addEventListener("click",function() {
// alert("document要点击事件")
// })
document.getElementById("usename").onfocus = function() {
document.getElementById("msg").innerText = "密码不能少于5位";
}
document.getElementById("usename").onblur = function() {
document.getElementById("msg").innerText = "";
if (this.value.length < 6) {
alert("密码长度不能小于6为")
}
}
}
一些事件
onabort 图像加载被中断 1 3 4
onblur 元素失去焦点 1 2 3
onfocus 元素获得焦点 1 2 3
onchange 用户改变域的内容 1 2 3
onclick 鼠标点击某个对象 1 2 3
ondblclick 鼠标双击某个对象 1 4 4
onerror 当加载文档或图像时发生某个错误 1 3 4
onkeydown 某个键盘的键被按下 1 4 3
onkeypress 某个键盘的键被按下或按住 1 4 3
onkeyup 某个键盘的键被松开 1 4 3
onload 某个页面或图像被完成加载 1 2 3
onmouseup 某个鼠标按键被松开 1 4 4
onmousedown 某个鼠标按键被按下 1 4 4
onmousemove 鼠标被移动 1 6 3
onmouseout 鼠标从某元素移开 1 4 4
onmouseover 鼠标被移到某元素之上 1 2 3
onmouseenter
onmouseleave
onreset 重置按钮被点击 1 3 4
onresize 窗口或框架被调整尺寸 1 4 4
onselect 文本被选定 1 2 3
onsubmit 提交按钮被点击 1 2 3
onunload 用户退出页面 1 2 3
网友评论