写一个方法getValue(),对任意参数x,返回y的值。
<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script type="text/javascript"> //写一个方法getValue(),对任意参数x,返回y的值。 function getValue(){ var x = document.getElementById("num").value, num = 0; //运算 if(+x < 1){ num = x; }else if(+x >= 1 && +x <10){ num = 2*(+x)-1; }else if(+x >=10){ num = 3*(+x)-11; } //给span标签赋值 document.getElementById("sp").innerHTML = num; } </script> </head> <body> <!--<button >开始</button> <br>--> 输入一个数字:<input type="text" onBlur="getValue()" id="num" value=""> <br> 经过计算y的值为:<span id="sp"></span> </body> </html>
实现简单计算器,分别输入两个数和一个运算符号,计算结果。计算过程使用一个带参数和带返回值得函数封装实现
<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script type="text/javascript"> //1、实现简单计算器,分别输入两个数和一个运算符号,计算结果。计算过程使用一个带参数和带返回值得函数封装实现 //alert(["+","-","*","/"].indexOf("%")); function method(n1,n2,fh){ //判断是不是数字 if( isNaN(n1) || isNaN(n2) ){ return "<span style='color:red'>请输入正确的数字</span>"; } //判断是不是符号 if(["+","-","*","/"].indexOf(fh) == -1 ){ return "请输入正确的符号(加减乘除)"; } //计算并返回结果 var num = eval(n1+fh+n2); return num; } function jisuan(){ //获取两个数字和一个符号 var n1 = document.getElementById("one").value, n2 = document.getElementById("two").value, fh = document.getElementById("fh").value; //调用方法 并接受返回值 var num = method(n1,n2,fh); //把返回值放到span标签里面 document.getElementById("jg").innerHTML = num; //简写 //document.getElementById("jg").innerHTML = method(n1,n2,fh); } </script> </head> <body> 数字1:<input type="text" id="one" ><br> 数字2:<input type="text" id="two"><br> 符号:<input type="text" id="fh"><br> <button onClick="jisuan()">计算</button> 结果为:<span id="jg"></span> </body> </html>
实现全选/全不选效果.如果下面的复选框有一个没有选中,全选复选框自动不勾选,如果全部选中则自动勾选
<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script type="text/javascript"> function check(obj){ // 1、找到全选框 // 2、获取全选框选中属性 // 3、获取所有的 CheckBox元素 var ckArr = document.getElementsByName("list"); // 4、把这些CheckBox元素的选中属性设为全选框的选中属性 for(var i = 0; i<ckArr.length;i++){ if(obj.checked){ ckArr[i].setAttribute("checked","checked"); }else{ ckArr[i].removeAttribute("checked"); } } } /* 1、获取所有CheckBox元素 2、每个都判断是否选中 3、如果有 没有选中的 全选框不选中 反之 选中 */ </script> </head> <body> <table width="100%" border="1" > <tr> <td><input id="qx" type="checkbox" onClick="check(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 type="text/javascript"> var ckarr = document.getElementsByName("list"); for(var i = 0; i<ckarr.length;i++){ ckarr[i].setAttribute("onclick","isxz()"); } function isxz(){ //1、获取所有CheckBox元素 var flag = true; // 2、每个都判断是否选中 for(var i = 0; i<ckarr.length;i++){ if(!ckarr[i].checked){ flag = false; } } // 3、如果有 没有选中的 全选框不选中 反之 选中 //flag = true ; 全部选中 //flag = false; 有 没有选中的 if(flag){ document.getElementById("qx").checked = true; }else{ document.getElementById("qx").checked = false; } } </script>