一.下载功能
<html>
<head>
<meta charset="utf-8">
<title></title>
<link href="css/bootstrap.css" rel="stylesheet" />
<script src="js/bootstrap.js"></script>
</head>
<body>
<div class="progress" role="progressbar" aria-label="Example with label" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<div id="a" class="progress-bar" style="width: 0%">0%</div>
</div>
<script>
var i = 0;
var div = document.getElementById("a");
var aaa = setInterval(function(){
i++;
div.style.width = i + "%";
div.innerText = i +"%";
if (i==100) {
clearInterval(aaa);
}
},10000);
</script>
</body>
</html>
二.数组的排序算法
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var a = [1,432,6,234,65,76,876,987];
a.sort(function(a,b){
return b-a; //倒序
})
console.log(a);
a.sort(function(a,b){
return a-b; //正序
})
console.log(a);
a.sort(function(){
return Math.random() - 0.5; //随机排列
})
console.log(a);
</script>
</body>
</html>
三.去除事件
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<button>按钮</button>
<button>取消按钮</button>
<script>
document.getElementsByTagName("button")[0].onclick = function(){
alert(123);
}
document.getElementsByTagName("button")[1].onclick = function(){
document.getElementsByTagName("button")[0].onclick = null;
}
</script>
</body>
</html>
四.图片的移动
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
img{
/* margin-left: 300px; */
}
</style>
</head>
<body>
<img src="img/1.gif" />
<script>
var img = document.getElementsByTagName("img")[0];
var left_index = 0;
setInterval(function(){
left_index++;
img.style.marginLeft = left_index + "px";
},10);
</script>
</body>
</html>
扫一扫
3076
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
