原生javascript
原生js基础知识和各类页面效果案例以及相关知识点
拾一·
个人学习笔记
展开
-
javaScript:获取n->m的随机整数,点击切换背景色,结合定时器实现自动切换背景色
核心方法:获取n->m的随机整数functiongetNum(n,m){returnMath.floor(Math.random()*(m-n+1))+n}整体思路分析:通过js给页面背景一个颜色 document.body可以获取到页面中body document.body.style.backgroundColor="rgb(0,0,0)" n~m的随机整数代码如下:<button id="btn">点击切换背景颜...原创 2021-07-08 08:40:13 · 173 阅读 · 0 评论 -
javaScript格式化显示日期时间
效果:<script> var date = new Date(); var month = date.getMonth() month += 1 function zeroDeal(n){ if(n>=0 && n<=9){ n = '0' + n } return...原创 2021-07-07 19:31:31 · 292 阅读 · 0 评论 -
javaScript利用递归求斐波那契数列(代码)
题目:利用递归求斐波那契数列代码如下:varn=prompt('请输入n:')functionFibonacci(n){if(n==1||n==2){return1;}else{returnFibonacci(n-1)+Fibonacci(n-2);}}var n = prompt('请输入n:')function Fibonacci(n){ ...原创 2021-07-05 12:17:11 · 1608 阅读 · 0 评论 -
javaScript打印出1000-2000年中所有的闰年,并以每行四个数的形式输出(分析+代码)
题目:打印出1000-2000年中所有的闰年,并以每行四个数的形式输出思路分析:(1)打印出该区间所有的闰年(2) 设置一个记录闰年个数的值,实现每四个换行代码如下:<script type="text/javascript">// 打印出1000-2000年中所有的闰年,并以每行四个数的形式输出 var temp = 0//记录闰年的个数,为换行做准备 for(var a = 1000 ; a <= 2000 ; a++){ i..原创 2021-07-03 00:07:16 · 4626 阅读 · 3 评论 -
判断一个整数是奇数还是偶数
题目:用户任意输入一个整数,程序判断出结果后,并向用户输出结果<scripttype="text/javascript">varnum=prompt("输入一个整数,判断它的奇偶性");if(Number(num)%2==0){alert('这是一个偶数喔~')}else{alert('唉~这是一个孤单的奇数\n我还是喜欢偶数')}</script>看截图可以更一目了然喔~...原创 2021-06-30 23:52:28 · 1043 阅读 · 0 评论 -
输入月份,显示当月的天数 要求:利用case穿透简化代码(分析+代码)
题目:输入月份,显示当月的天数要求:利用case穿透简化代码分析:第一步:确定月份天数情况,1、3、5、7、8、10、12 月均为31天;4、6、9、11均为30天;2月份闰年有29天,平年有28天。第二步:判断平年闰年的条件是能被4整除且不能被100整除或能被400整除的数第三步:理解case穿透技术并会使用注:28天和29天的判断中运用到了三元表达式 表达式 ? 事件1 : 事件2如果表达式为真,则结果为事件1的结果;如果表达式为假,则结果为事件2的结果。具体...原创 2021-07-01 00:10:41 · 1195 阅读 · 0 评论 -
AJAX+php实现模糊查询(代码),一般用于搜索功能
功能描述:用户在输入框中输入关键字; 点击“查询”按钮,查询出含有该关键字的数据;(此案例关键字限制规则是:%keyword%,即数据中含有关键字就符合) 数据在ul中渲染在页面小知识点:json_encode() 是php的一个内置函数(php>5.2)可以使用,把数组转换成json字符串 eval()是全局对象的一个函数属性 eval()函数会将传入的字符串当做JavaScript代码进行执行。 网站链接:php:https://www.php...原创 2021-07-28 10:08:19 · 595 阅读 · 0 评论 -
javaScript用函数的方法判断素数:判断一个数是否是素数(代码)
题目题目:判断一个数是否是素数代码如下:functionsu(n){for(vari=2;i<n;i++){if(n%i==0){//代码走到这里面证明不是素数returnfalse//如果不是素数就直接返回false}}//如果整个循环执行完毕,没有经过终止,说明这是一个素数,返回truereturntrue}//varres=su(135)...原创 2021-07-02 23:35:33 · 3942 阅读 · 0 评论 -
javaScript用递归求阶乘:利用递归求100的阶乘(代码)
题目:利用递归求100的阶乘代码如下:functionjiecheng(n){if(n==1){return1}returnn*jiecheng(n-1)}console.log(jiecheng(100));function jiecheng(n){ if(n == 1){ return 1 } return n*jiecheng(n-1)}console.log(jiechen...原创 2021-07-05 12:09:33 · 1625 阅读 · 0 评论 -
javaScript求分数的和:1 - 1/2 + 1/3 - 1/4 …..1/100的和(代码)
题目:求出1-1/2+1/3-1/4…..1/100的和代码如下:varsum=0for(vari=1;i<=100;i++){if(i%2==0){sum-=1/i}else{sum+=1/i}}console.log(sum);//0.688172179310195代码截图如下:...原创 2021-07-02 23:45:08 · 824 阅读 · 0 评论 -
数组中的every、filter、map、some和forEach
一、共同点:从参数:都接受一个函数作为参数,该函数带有三个参数,item,index,array,即数组某项,数组索引,数组本身。从返回值:every和some都返回一个布尔值true或false,filter和map返回一个数组,forEach没有返回值二、实例分析(1)every:都真才真,即对函数以数组中的每个元素进行调用,对return语句中的表达式进行求值,都返回true时every函数才返回true。var arr = [1, 2, 3, 3, 4, 5 ,6],v...转载 2021-07-09 16:32:00 · 320 阅读 · 0 评论 -
javaScript用函数的方法求偶数的个数:求1~n(n>=1)之间的所有偶数的个数(分析+代码)
题目:求1~n(n>=1)之间的所有偶数的个数思路分析: (1)先把核心代码写出来,然后把核心代码放到一个函数中, (2)代码中每次调用需要变化的数字,就作为变量并作为函数的形参 (3)将最后输出的变量,作为返回值代码如下:functionsum(n){varsum=0//个数初始值for(vari=1;i<=n;i++){if(i%2==0){sum++}...原创 2021-07-02 23:32:47 · 1795 阅读 · 0 评论 -
弹篮球计算:篮球从5米高的地方掉下来,每次弹起的高度是原来的30%,经过几次弹起,篮球的高度小于0.1米。(代码)
题目:篮球从5米高的地方掉下来,每次弹起的高度是原来的30%,经过几次弹起,篮球的高度小于0.1米。原创 2021-07-01 10:08:50 · 1194 阅读 · 2 评论 -
php:通过冒泡算法给数组排序
//给数组中的元素排序$ar1=[23,45,12,78,9,56];//使用冒泡排序的方式for($i=0;$i<count($ar1)-1;$i++){ for($j=0;$j<count($ar1)-1-$i;$j++){ if($ar1[$j]<$ar1[$j+1]){ $temp=$ar1[$j]; $ar1[$j]=$ar1[$j+1]; $ar1[$j+1]=$temp;.原创 2021-07-26 19:08:23 · 315 阅读 · 0 评论 -
javaScript点击事件求阶乘:使用函数完成任意数字阶乘的计算 要求:页面输入任意数字,点击按钮后计算阶乘(代码)
题目:使用函数完成任意数字阶乘的计算要求:页面输入任意数字,点击按钮后计算阶乘代码如下:functionjiecheng(n){if(n==1){return1}returnn*jiecheng(n-1)}//按钮的点击事件jisuan.onclick=function(){//通过value属性获取输入框的值varn=num.valuevarres=jiecheng(n)...原创 2021-07-05 12:14:05 · 1570 阅读 · 0 评论 -
javaScript石头、剪刀、布游戏:用户输入石头、剪刀或布,电脑也会出一个招,要求得出最终结果,显示胜利玩家。(提示+代码)
题目:用户输入石头、剪刀或布,电脑也会出一个招,要求得出最终结果,显示胜利玩家。提示:(1)用数字代表猜拳(2)使用条件判断语句(3)取随机数的方法Math.random()代码如下://用户出的varx1=prompt("请输入剪刀、石头、布:")//电脑随机出varnum1=parseInt(Math.random()*3)//把电脑出的数字替换为剪刀、石头、布if(num1==0){...原创 2021-07-03 14:55:02 · 2001 阅读 · 2 评论 -
javaScript计算游戏分数:一个游戏,前20关是每一关自身的分数,21-30关每一关是10分;31-40关每一关是20分;41-49关每一关是30分,50关是100分。(代码)
题目:一个游戏,前20关是每一关自身的分数,21-30关每一关是10分;31-40关每一关是20分;41-49关每一关是30分,50关是100分。输入你现在闯到的关卡数,求你现在拥有的分数代码如下:(代码太长,不好截图,可以直接复制代码运行去查看效果)functionjisuan(n){varsum=0//设置分数变量,初始值为0if(n>0&&n<=50){//将关数循环,依次去获取各关的分数并累加到sum中...原创 2021-07-02 23:41:37 · 1659 阅读 · 0 评论 -
计算两个文本框的和(用户随意输入2个值a 、b)
题目:用户随意输入两个整数,请计算它们的和是多少?<scripttype="text/javascript">varnum1=prompt("请输入第一个数字:");varnum2=prompt("请输入第二个数字:");varnumSum=Number(num1)+Number(num2)alert('第一个数字和第二个数字之和为'+numSum)</script>注:因为数据类型的转换...原创 2021-06-30 23:47:59 · 522 阅读 · 0 评论 -
javaScript用函数的方式实现闰年的判断:输入一个年份,判断是否是闰年(分析+代码)
题目:输入一个年份,判断是否是闰年分析:(1)闰年的判断条件是能被4整除却不能被100整除的年份。世纪年份能被400整除的是闰年(2)用一般形式写出判断闰年的程序(3)将程序改写为函数的方式(4)代码验证代码如下:functionrun(year){//判断year是不是数字if(isNaN(year)){alert('你的输入有误')return}if(year%4==0&&year%100!=...原创 2021-07-02 23:54:43 · 8889 阅读 · 0 评论 -
判断该年是闰年还是平年?(分析+代码)
题目:用户输入任意的一年,如2021,判断概念是闰年还是平年?分析:第一步:需要给用户用户提供一个输入框输入年份第二步:会使用if...else结构第三步:解析判断条件,闰年的判断条件:能被4除余且不能被100除余是普通闰年,能被400除余是世纪闰年。第四步:向用户输出结果代码如下:...原创 2021-06-30 23:59:28 · 380 阅读 · 0 评论 -
javaScript:根据输入的行数来打印菱形
题目需求: 代码如下:<style>span{display:inline-block;border:1pxsolidred;width:60px;line-height:30px;text-align:center;}div{te...原创 2021-07-03 15:22:47 · 3192 阅读 · 0 评论 -
javaScript:求1-100以内跟7相关的数字
<script>/*求1-100以内跟7相关的数字*/for(vari=1;i<=100;i++){//7的倍数个位为7十位为7if(i%7==0||i%10==7||parseInt(i/10)==7){document.write(i+'')}...原创 2021-07-03 15:11:00 · 1123 阅读 · 0 评论 -
判断该整数是奇数还是偶数?(代码)
题目:用户输入一个整数,判断是奇数还是偶数?原创 2021-07-01 00:02:24 · 678 阅读 · 0 评论 -
javaScript求5*5数组的左下半三角(分析+代码)
题目:求一个5×5的二维数组的左下半三角,如图所示思路分析:(1)通过循环按行顺序为一个5×5的二维数组arr赋1到25的自然数,这一步的结果如图(2)和输出9*9口诀一样的思路代码如下:<script>vararr=[]for(vari=1;i<=25;){//i1~25//定义一个小数组vartmp=[]//每五个数字放进数组tmp中...原创 2021-07-05 20:51:22 · 422 阅读 · 0 评论 -
javaScript计算每5个数组元素的平均值(分析+代码)
题目:定义一个含有30个整型元素的数组,按顺序分别赋予从2开始的偶数;然后按顺序每五个数求出一个平均值,放在另一个数组中并输出。分析:(1)先产生一个数组长度为30的数组,且数组元素均为偶数(2)每5个计算一次平均值,用push()放入新数组代码如下:<script>//1.准备一个数组长度30,均为偶数vararr=[]vari=1//只要数组长度不到30就是继续循环将偶数加到数组arr中...原创 2021-07-05 20:44:37 · 2514 阅读 · 0 评论 -
分数的计算:求出1 - 1/2 + 1/3 - 1/4 …..1/100的和
题目:求出1-1/2+1/3-1/4…..1/100的和代码如下:<scripttype="text/javascript">//求出1-1/2+1/3-1/4…..1/100的和varsum=0for(vari=1;i<=100;i++){if(i%2==0){sum-=1/i}else{sum+=1/i}}console.log(sum);//0....原创 2021-07-01 14:10:38 · 1091 阅读 · 0 评论 -
弹皮球:有个皮球,每次落地弹起都是高度的一半,如果从10米高的地方丢下,第十次弹起时,皮球总过经历了多少距离。(代码)
题目:有个皮球,每次落地弹起都是高度的一半,如果从10米高的地方丢下,第十次弹起时,皮球总过经历了多少距离?(分析+代码)题目:有个皮球,每次落地弹起都是高度的一半,如果从10米高的地方丢下,第十次弹起时,皮球总过经历了多少距离?分析://第一次弹起h=10距离1=h+h/2//第二次弹起h=h/2距离2=h+h/2//第三次弹起h=h/2距离3=h+h/2//...//第十次弹起计算所有距离的和!!!注意距离是包括了落下的距离和弹起的距...原创 2021-07-01 10:37:05 · 1023 阅读 · 0 评论 -
javaScript:一些特殊标签的获取,如body、title、html、head、doctype
+特殊的标签==>body标签:document.body==>title标签:document.title获取的是title里面的内容,但是可以获取也可以赋值==>document.title:获取的是title里面的内容==>document.title="新的titl...原创 2021-07-19 20:58:39 · 595 阅读 · 1 评论 -
javaScript:打印99乘法表
for(vari=1;i<=9;i++){for(varj=i;j<=9;j++){document.write("<span>"+i+"*"+j+'='+(i*j)+'</span>')}document.write("<br/>")for(var i=1;i<=9;i++){ for(var j=i...原创 2021-07-03 15:14:26 · 592 阅读 · 0 评论 -
猴子摘桃:猴子摘了x个桃,每天吃一半,最多吃一个,第7天吃的时候剩下一个了,猴子摘了多少桃子?(代码+分析)
题目:猴子摘了x个桃,每天吃一半,最多吃一个,第7天吃的时候剩下一个了,猴子摘了多少桃子?一、分析:重点是理解“每天吃一半,最多吃一个,”得出以下规律:// 第7天1//第6天(1+1)*2//第5天((1+1)*2+1)*2//...二、代码如下:...原创 2021-07-01 13:59:09 · 1026 阅读 · 0 评论 -
javaScript用函数的方法实现三个数大小排列:编写一个函数,计算三个数字的大小,按从小到大顺序输出(代码)
题目:编写一个函数,计算三个数字的大小,按从小到大顺序输出代码如下:varnum1=parseInt(prompt("输入第一个数:"));varnum2=parseInt(prompt("输入第二个数:"));varnum3=parseInt(prompt("输入第三个数:"));functionpai(n1,n2,n3){if(isNaN(n1)){alert('第一个数不是数字')return}if(isNa...原创 2021-07-02 23:58:35 · 2829 阅读 · 0 评论 -
javaScript函数:编写一个函数,输入n为偶数时,调用函数求1/2+1/4+...+1/n,// 当输入n为奇数时,调用函数求1/1+1/3+...+1/n(代码)
题目:编写一个函数,输入n为偶数时,调用函数求1/2+1/4+...+1/n,当输入n为奇数时,调用函数求1/1+1/3+...+1/n代码如下:functionfn(){varn=prompt("请输入一个数")varsum=0;//和的初始值if(n%2==0){//对2求余,判断数值的奇偶vara=2//循环分数的初始值2}else{vara=1//循环分数的初始值1}//循...原创 2021-07-05 12:11:47 · 1145 阅读 · 0 评论 -
javaScript求每一位数上的数:给定一个数字1534,分别求出每一位数上的数字,并计算它们的和
题目:给定一个数字1534,分别求出每一位数上的数字,并计算它们的和代码如下:<script>//给定一个数字1534,分别求出每一位数上的数字,并计算它们的和//varnum=1534;varnum=prompt('请输入任意的4位数:')varsum;//总数varnum1=parseInt(num/1000);//千位varnum2=p...原创 2021-07-03 13:48:49 · 222 阅读 · 0 评论 -
棋盘放芝麻:有一个棋盘,有64个方格,在第一个方格里面放1粒芝麻重量是0.00001kg,第二个里面放2粒,第三个里面放4,棋盘上放的所有芝麻的重量(代码)
题目:有一个棋盘,有64个方格,在第一个方格里面放1粒芝麻重量是0.00001kg,第二个里面放2粒,第三个里面放4,棋盘上放的所有芝麻的重量代码如下:<scripttype="text/javascript">//有一个棋盘,有64个方格,在第一个方格里面放1粒芝麻重量是0.00001kg,第二个里面放2粒,第三个里面放4,棋盘上放的所有芝麻的重量varsumNum=0;//棋盘中所有芝麻的重量varweight=0.00001;vara=1;...原创 2021-07-01 10:15:49 · 4157 阅读 · 0 评论 -
javaScript用函数的方式计算体重是否是标准体重(代码)
题目:用函数的方式计算体重。 输入:身高、体重、性别 输出:偏重、正常标准体重:男士体重=身高-100±3女士体重=身高-110±3代码如下:varsex=prompt('请输入性别(男/女):');varheight=prompt("请输入身高(厘米):");varweight=prompt("请输入体重(公斤):")functionfn(sex,height,weight){varb...原创 2021-07-02 23:49:56 · 2077 阅读 · 0 评论 -
javaScript数组:点歌台、抽奖功能(分析+代码)
题目:点击开始按钮,进行随机抽取,点击停止按钮,确定抽到的人是谁(该思想可用于点歌、点名、抽奖系统)效果图:思路分析:(1)创建一个数组arr,用来存放姓名名单(2)创建一个点击事件,点击开始/停止按钮(3)用 .innerText 的方法,更改开始和停止按钮显示的内容(4)用setInterval(函数,间隔时间)去设置一个定时器timer,用来控制DIV中的名单多久遍历一次(5)用clearInterval(定时器名称)的方法去清除定时器(定时器创建后是需要清除的)代原创 2021-07-05 15:38:48 · 250 阅读 · 0 评论 -
for循环实现三角形的打印(代码)
题目:题目题目:for循环实现三角形的打印(代码)输出要求:代码如下:原创 2021-07-01 14:07:57 · 632 阅读 · 0 评论 -
javaScript:打印等腰三角形
题目需求:准备用到的布局:<style> span{ display:inline-block; border:1px solid red; width: 60px; line-height: 30px; text-align: center; } div{ text-align: cente原创 2021-07-03 15:27:41 · 1786 阅读 · 2 评论 -
银行存钱:某人在银行有50000元存款。银行每月都要收取服务费,存款大于5000元时每个月收取总额的5%,总额不大于5000元的时候不收服务费;用循环计算银行要扣这个人的...(代码)
某人在银行有50000元存款。银行每月都要收取服务费,存款大于5000元时每个月收取总额的5%,总额不大于5000元的时候不收服务费;假设这个人存了以后从来都不用,用循环计算银行要扣这个人的手续费能扣多少次?每次扣取后剩余多少钱?代码下:variniMoney=50000;varn=0;//扣除次数while(true){iniMoney=iniMoney-iniMoney*0.05;//每回扣除的服务费n++;document...原创 2021-07-01 10:18:11 · 645 阅读 · 0 评论 -
求素数:输出100-200之间所有的素数 (素数,就是除了1和自己本身,不能被别的数整除)
题目:输出100-200之间所有的素数(素数,就是除了1和自己本身,不能被别的数整除)代码如下:原创 2021-07-02 23:26:58 · 1279 阅读 · 0 评论