exercise
goer ... 2022-01-05 大约 8 分钟
[toc]
# 练习题：
其他编程语言也可以实现的
# 1. 输出今天的星期
页面输出 '今天星期三' ,这个'三'会根据每天改变'一二三四五六天'
date对象
1
2
2
# 2. 超市购物
打折处理 满2000元打五折 满1000元打七折 满500元打九折 满100元减10元 少于100元不打折不优惠 输出最终优惠后价格
// 变量=总价
1
2
3
4
5
2
3
4
5
# 3. 把表情做成每行显示五个
01.gif 02.gif ... 90.gif 不能修改文件名
1
2
3
4
2
3
4
# 4. 打印出九九乘法表
1
2
2
# 5. 打印下面表格
# 6. 花光每一分钱
使用100元买三种水果，葡萄（15元一斤），橘子（2元一斤），
哈密瓜（5元一斤）。要把100元刚好花完，列出所有的购买方式
1
2
2
# 7. 卖鸡
通过for循环实现百钱买百🐔的题:公鸡5元每只，母鸡3元每只，
小鸡3只1元，100元买一百只鸡多少种办法
1
2
2
# 8. 九九乘法表
99乘法表倒着写（table）
1
2
2
# 9. 奇偶和
1~100奇数和
循环输出1~100之间数字的和
1
2
2
# 10. 打印出所有的“水仙花”数
所谓 "水仙花数 "是指一个三位数，其各位数字立方和等于该数本身。
例如：153是一个 "水仙花数 "，因为153=1的三次方＋5的三次方＋3的三次方。
# 11.兔子
有一对幼兔，幼兔1个月后长成小兔，小兔1个月后长成成兔并生下一对幼兔，问几年后有多少对兔子，幼兔、小兔、成兔对数分别是多少。
1
2
2
# 12.凑钱
凑钱1,2，5凑20元钱有多少种可能
# 13. 五个小朋友排成一队。
问第一个多大了，第一个说比第二个大两岁， 问第二个，第二个说比第三个大两岁，以此类推。 问第五个小朋友几岁了，第五个小朋友说3岁了。 问第一个小朋友几岁？
1
2
2
# 14.打印图形
□□□□● □□□●● □□●●● □●●●● ●●●●●
// 1.
1
●●●●● ●●●● ●●● ●● ●
//2.
1
● ●● ●●● ●●●● ●●●●●
1
●●●●●●●● ●●●●●●●● ●●●●●●●● ●●●●●●●● ●●●●●●●● ●●●●●●●● ●●●●●●●●
# 15.挑人
某侦察队接到一项紧急任务，要求在A、B、C、D、E、F六个队员中尽可能多地挑若干人，但有以下限制条件：
●A和B两人中至少去一人；
●A和D不能一起去；
●A、E和F三人中要派两人去；
●B和C都去或都不去；
●C和D两人中去一个；
●若D不去，则E也不去。
问应当让哪几个人去？
# 16. 猴子和桃子
公园里有一只猴子和一堆桃子，猴子每天吃掉桃子总数的一半，把剩下一半中扔掉一个坏的。到第七天的时候，猴子睁开眼发现只剩下一个桃子。问公园里刚开始有多少个桃子？
# 17. 驼梁
大马驮2石粮食，中马驮1石粮食，两头小马驮一石粮食，要用100匹马，驮100石粮食，该如何调配？
1
2
2
# 18.棋盘芝麻
有一个棋盘，有64个方格，在第一个方格里面放1粒芝麻重量是0.00001kg，第二个里面放2粒，第三个里面放4， 棋盘上放的所有芝麻的重量
# 19.数组求和(尽量不用内置函数)
将数组中数字内容求和
1
2
2
# 20. 数组去重复
var arr = [4, 0, 7, 9, 0, 0, 2, 6, 0, 3, 1, 0]; //随便 要求将数组中的0项去掉，将不为0的值存入一个新的数组，生成新的数组
# 21.数组
写出一个javascript的函数，实现对一个数组去重的功能。 构建一个新的数组存放结果。 for循环中每次从原数组中取出一个元素，用这个元素循环与结果数组对比。
若结果数组中没有该元素，则存到结果数组中。
1
2
2
# 22.数组最大值
求数组最大值
# 23.数组排序(冒泡排序)
给定数组进行排序
arr = [12,3,324,546,243,656,56,56,89]
function short(arr){
for(var i=0; i<arr.length; i++){
for(var j=i+1; j<arr.length; j++){
if(arr[j] > arr[i]){
var tmp = arr[j]; //交换两个值，用公共变量
arr[j] = arr[i];
arr[i] = tmp
}
}
}
return arr;
}
//console.log(short(arr2));
// 数组方法
aa2.shor(function(a,b){
return a-b;
})
console.log(aa2);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
# 24. 打印图行
1
2
2
# 25.打印图形
1
2
2
# 26. 替换字符串
使用replace可以替换字符串中所有位置的符合条件的字符,默认只能替换第一个 var s='hello world'; 替换所有字符'l'为aa 替换所有字符'o'为qq
# 27.大写变小写，小写变大写
var str='AAAbbbCCCdddEEEfff';将大写变成小写,小写变成大写 var str='aaaBBBcccDDDeeeFFF';
1
2
2
# 28.数组去重
自定义一个函数用来去除数组重复的值并输出 删除掉的重复值以及该值的索引 var arr=['aaa','ccc','aaa','sss','ccc','eee'];
function arrayRemove(arr){
for(var i=0; i<arr.length; i++){
for(var j=i+1; j<arr.length; j++){
if(arr[i] == arr[j]){
console.log('重复的值是'+arr[j]+',索引为'+j+'。已被删除。');
//删除
arr.splice(j,1)
j--;
}
}
}
}
var arr1 = ['aaa', 'bbb','ccc','aaa','eee']
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
# 29. 彩票购买
自定义一个函数完成30选5的彩票(5个值不能有重复)
function rand(num0=1, num1=30,num2=5){
//定义num0-num1的数组
var arr=new Array();
for(var i=num0;i<=num1;i++){
//i加到arr数组中
arr.push(i)
}
//console.log(arr);
//随机获取值
var str=''; //保存值的容器
for(var j=1; j<=num2; j++){
var rand_index = Math.floor(Math.random()*arr.length); //生成多个随机数
str+=arr[rand_index]+' ';
arr.splice(rand_index,1)； //删除拿出来的值
}
return str;
}
console.log(rand(40,100,10));
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
康康我自己写的
// 1.我的
// var arr = []
// for(var i=1; i<=30; i++){ // 1 2 3
// for(var j=i+1; j<=30; j++){ // 2 3 4
// for(var h=j+1; h<=30; h++){ // 3 4 5
// for(var k=h+1; k<=30; k++){ // 4 5 6
// for(var l=k+1; l<=30; l++){ // 5 6 7
// if(i != j != h != k !=l){
// //console.log(i,j,h,k,l);
// arr.push(''+i+','+j+','+h+','+k+','+l+'')
// }
// }
// }
// }
// }
// }
// //console.log(arr); // 142506
// var ranNum = Math.floor(Math.random()*142506)
// console.log(arr[ranNum])
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
# 30 时间
1、写一个动态的时间
(年-月-日 时:分:秒)(月日时分秒如果是个位数需要在前面加一个0)
2021-07-07 12:25:03
//<div id='box'></div>
function zearo(a){
if(a <10){
return '0'+a;
}else{
return a;
}
}
function getTime(){
var t = new Date();
var y = t.getFullYear();
var m = t.getMonth()+1;
var d = t.getDate();
var h = t.getHours();
var min = t.getMinutes();
var s = t.getSeconds();
box.innerHTML = y +'-'+zearo(m)+'-'+zearo(d)+'-'+zearo(h)+':'+zearo(min)+':'+zearo(s);
}
setInterval(getTime,1000);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
# 31 加边框
2、每隔一秒，对下面的div，的边框，加粗 不停的加粗 1px 2px 3px
<div id="ceshi" style="border:1px solid black">
测试测试
// <div id="ceshi" style="border:1px solid black">
// 测试测试
// </div>
var i =1;
function addWidth(){
i++;
ceshi.style.borderWidth=i+'px';
}
setInterval(addWidth,1000);
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
# 32 选择功能
全选、反选、取消功能
<button class='all'>全选<button>
<button class='none'>取消<button>
<button class='fan'>反选<button>
var check = document.querySelectorAll('[type="checkbox"]');
checkboxs[i].checked =! checkboxs[i].checked;
1
2
3
4
5
6
7
2
3
4
5
6
7
# 33 定时器
每隔五秒钟时间在网页上显示一个温馨提醒，放置到 #box里面,显示一秒后消失
<div id="box">温馨提示</div>
1
2
3
2
3
# 34.列表隔行换色
<ul>
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
<li>555</li>
</ul>
var li = document.querySelectorAll('ul li');
console.log(li)
//隔行换色
function color2(){
for(var i=0; i< li.length; i++){
if(i%2==0){
li[i].style.backgroundColor = 'blue';
}else{
li[i].style.backgroundColor = 'skyblue';
}
}
}
color2();
//鼠标移入
for(var j=0; j<li.length; j++){
li[j].onmouseover =function(){
//移入，改变所有li背景
for(k=0;k<li.length; k++){
li[k].style.backgroundColor = 'black'
}
this.style.backgroundColor = 'red'
this.style.color='white';
}
li[j].onmouseout = function(){
color2();
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
# 35.正则
// 练习 1.匹配电话号码 2.匹配邮箱 3.匹配50-98 4.匹配年月日 5.匹配时分秒
6.匹配121-928
// 121 -- 928
/*
121 - 129 12[1-9]
130 - 199 1[3-9]\d
200 - 899 [2-8]\d{2}
900 - 919 9[01]\d
920 - 929 92[0-8]
*/
var reg = /^(12[1-9]|1[3-9]\d)|[2-8]\d{2}|9[01]\d|92[0-8]$/
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
则匹配字符串必须同时并且仅仅包含大写字母、小写字母和数字
1
2
2
# 36.全选和取消
敲代码
看技术书籍
切图布局
做js作业
<button id="btn">全选
var cheks = document.getElementsByName('aaa');
var a =true;
btn.onclick = function(){
if(a){
for(var=0;i<cheks.length;i++){
cheks.checked = true;
}
a=false;
}else{
for(var=0;i<cheks.length;i++){
cheks.checked = false;
}
a=true;
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
# 37.选项卡
选项卡功能
<style type="text/css">
*{padding:0;margin:0;}
ul,li{list-style:none;}
.list{height:30px;width:400px;border:1px solid #000;}
.list li{float:left;width:100px;height:30px;line-height:30px;text-align:center;cursor:pointer;}
.active{background-color:blue;color:#fff;}
.content{height:350px;width:400px;border:1px solid #000;}
.content .show{display:block;}
.content ul{display:none;}
</style>
<!-- 使用js完成xuanxiangka.html的选项卡效果 -->
<ul class="list" id="list">
<li class="active">新闻</li>
<li>体育</li>
<li>产品</li>
<li>广告</li>
</ul>
<div class="content" id="content">
<ul class="show">
<li>新闻列表1</li>
<li>新闻列表2</li>
<li>新闻列表3</li>
<li>新闻列表4</li>
</ul>
<ul>
<li>体育列表1</li>
<li>体育列表2</li>
<li>体育列表3</li>
<li>体育列表4</li>
</ul>
<ul>
<li>产品列表1</li>
<li>产品列表2</li>
<li>产品列表3</li>
<li>产品列表4</li>
</ul>
<ul>
<li>广告列表1</li>
<li>广告列表2</li>
<li>广告列表3</li>
<li>广告列表4</li>
</ul>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
var titles = document.querySelectorAll('#list li');
var conetnts = document.querySelectorAll('#content ul');
for(var i=0;i<titles.length; i++){
titles[i].setAttribute('aaa',i) // 给li加上aaa属性，而且有循序
titles[i].onclick =function(){
var ind=this.getAttribute('aaa')//获取当前点击aaa属性值
//console.log(ind);
for(var k=0;k<titles.length;k++){
// 先去掉所有li和ul的className
titles[j].className = '';
conetnts[j].className = '';
}
//给当前点击titles加classname
this.className = 'active';
// 对应的内容ul加
content[ind].className = 'show';
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23