考点整理代码块系列
Posted 凯迪威
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了考点整理代码块系列相关的知识,希望对你有一定的参考价值。
1、 编写一个方法method(),判断一个数能否同时被3和5整除。
<!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> <script type="text/javascript">//第一:先创建function()函数 function method(){ var num=prompt("请输入数字"); //第二,验证变量num是不是数字 if(isNaN(num)){ alert("您输入的不是数字"); //第三,不是数字返回,中断循环 return; } //第四,判断变量num能否被3和5整除 if(+num%3==0 && +num%5==0){ document.write(+num+"能被3和5整除");//是输出的内容 }else{ document.write(+num+"不能被3和5整除");//不是输出的内容 } } method(); //最后,调用变量 </script> </head> <body> </body> </html>
2、有一个函数y=x (x<1) || y=zx-1(1<=x<10) || y=3x-1(x>=10) 写一个方法getvalue(),对任意参数x,返回y的值。
<!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> <script type="text/javascript">//第一,创建function函数 function getvalue(){ var x=document.getElementById("sr").value,//input文本框的值定义为变量x y=0; //判断y的值 if(+x<1){ y=x; }else if(+x>=1 && +x<10){ y=2*(+x)-1; }else if(+x>=10){ y=3*(+x)-11; } //把y的值用span标签的形式输出 document.getElementById("sp").innerHTML=y; } </script> </head> <body> 输入数字:<input type="text" id="sr" onblur="getvalue()" value=""/><br /> <!--用onblur标签把结果显示在span标签中--> 最后y的值:<span id="sp"></span> </body> </html>
3、实现简单计算器,分别输入两个数和一个运算符,计算结果。 计算过程使用一个带参数和带返回值得函数封装实现。
<!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> <script type="text/javascript">//建立function函数 function fanh(n1,n2,fh){ //判断是不是数字 if(isNaN(n1)||isNaN(n2)){ return"请输入数字";//return"<span style=‘color:red‘>请输入正确数字</span>";字体变红 } //判断是不是符号 if(["+","-","*","/"].indexOf(fh) == -1){ return"请输入正确的符号(加减乘除)"; } //计算并返回值 var num=eval(n1+fh+n2); return num; } function jis(){ //获取俩个数和一个符号 var n1=document.getElementById("one").value, n2=document.getElementById("two").value, fh=document.getElementById("three").value; //调用方法并且接受返回的值 var num=fanh(n1,n2,fh); //把返回值赋值给span标签 document.getElementById("sp").innerHTML=num; } </script> </head> <body> <!--输入数字:<input type="text" id="sr" onblur="getvalue()" value=""/><br /> <!--用onblur标签把结果显示在span标签中--> <!--最后y的值:<span id="sp"></span>--> 输入第一个数字<input type="text" id="one"/><br /> 输入第二个数字<input type="text" id="two"/><br /> 输入符号<input type="text" id="three"/><br /> <button onclick="jis()"> 等 于 </button> 值为:<span id="sp"></span> </body> </html>
4、实现全选和全不选效果.
如果下面的复选框有一个没有选中,全选复选框自动不勾选,如果全部选中则自动勾选
// 1.找到全选表格 // 2.获取全选表格的选中属性 // 3.获取所有的CheckBox属性 // 4.把所有的CheckBox属性设为全选表格的属性 function one(obj){ var arr=document.getElementsByName("list"); //alert(arr); for(var i=0;i<arr.length;i++){ if(obj.checked){ //arr[i].setAttribute("checked","checked"); //第一种方法与下面的问题冲突 arr[i].checked=true;//第二种方法,与下面的问题相互应 }else{ //arr[i].removeAttribute("checked"); //第一种方法,与下面问题冲突 arr[i].checked=false; //第二种方法,与下面的题相呼应 } } } </script> <body> <table width="100%" border="1" > <tr> <td><input id="qx" type="checkbox" onClick="one(this)">全选</td> <td>表头</td> <td>表头</td> <td>表头</td> </tr> <tr> <td><input name="list" type="checkbox"></td> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> <tr> <td><input name="list" type="checkbox"></td> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> <tr> <td><input name="list" type="checkbox"></td> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> </table> </body> </html>
//没有点击事件,因页面是从上开始加载,必须放在下面,记住还有<script></script> <script> var arr2=document.getElementsByName("list"); for(var i=0;i<arr2.length;i++){ arr2[i].setAttribute("onclick","xuanz()"); } function xuanz(){
//获取CheckBox元素 flag=true;
//判断是否每个都选中 for(var i=0;i<arr2.length;i++){ if(!arr2[i].checked){ flag=false; } }
//全选框单元格是否选中 if(flag){ document.getElementById("qx").checked=true; //全选框选中,所有CheckBox也都选中 }else{ document.getElementById("qx").checked=false; //CheckBox有没选中的,全选不勾选 } } </script>
以上是关于考点整理代码块系列的主要内容,如果未能解决你的问题,请参考以下文章