JS new 2017-07-30

来源：互联网发布：淘宝店铺等级在哪儿看编辑：程序博客网时间：2024/06/06 04:24

1. 编写外部js文件有时候会出现乱码，这时我们可以在<script>中加上charset="gb2312".

2. JavaScript中的布尔值： true（真），false（假）

3. js中的字符串表达式： string=“hello”+“world”； string值为hello world；

4. js数组： var a=new Array();

a[0]=" 10";

a[1]=" 20";

a[1]=" 30";

[index]="属性/值"，每个index从0开始都对应一个值。

定义定长数组：var myarray= new Array(8);

5. 为数组赋值

① var a= new Array();
a[0]=" 10";
a[1]=" 20";
a[1]=" 30";

②var a= new Array(10,20,30,40,50....);

③var a = [66,80,90,77,59];

6. 获取或者更改数组长度

myarr.length;

7. 定义二维数组

1）使用for循环来定义二维数组

var myarr=new Array();           //先声明一维 数组for(var i=0;i<2;i++)                      //一维数组长度为2{               myarr[i]=new Array();        //再声明二维数组    for(var j=0;j<3;j++)              //二维数组长度为3{          myarr[i][j]=i+j;                  // 赋值，每个数组元素的值为i+j   } }

2）直接定义

var Myarr = [[0 , 1 , 2 ],[1 , 2 , 3]]；

8. 输出数组

for(var i;i<you_array.length;i++)

{

document.write(your_array[i]+"&nbsp");

}

也可以把循环变量设置为这种形式： for（var i in your_array）{ 输出； }

9. 根据数组中的内容对数组进行排序

your_array.sort(sortby());

注意sortby是自己编写的一个排序函数；默认将按字母顺序对数组中的元素进行排序，说得更精确点，是按照字符编码的顺序进行排序。

10. var i in Array 与（i=0；i<Array.length;i++）的区别

前者可以遍历对象，而后者只是对数字的循环，只能遍历数组。

11. exercise

<!DOCTYPE  HTML><html ><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>流程控制语句</title><script type="text/javascript">  var pro=[['小A','女',21,'大一'],['小B','男',23,'大三'],['小C','男',24,'大四'],['小D','女',21,'大一'],['小E','女',22,'大四'],['小F','男',21,'大一'],['小G','女',22,'大二'],['小H','女',20,'大三'],['小I','女',20,'大一'],['小J','男',20,'大三']] //直接定义二维数组  for(var i in pro)  {  document.write(pro[i]+"<br>");            //测试数组输出  }  document.write("<br>"+"<br/>"+"<br/>");      //   /n var grade_one=new Array();                               //定义存放大一学生的数组for(var i in pro){if(pro[i][3]=="大一")grade_one[i]=pro[i];                             //向数组存入大一学生信息}for(var i in grade_one ) document.write(grade_one[i]+"<br>");                      //大一学生信息数组测试输出 document.write("<br>"+"<br/>"+"<br/>");              //     /nvar girl=new Array();                                       //定义大一女生数组for(var i in grade_one){if(grade_one[i][1]=="女")girl[i]=grade_one[i];                     //存放大一女生信息}for(var i in girl)document.write(girl[i]+"<br>");                            //输出 document.write("<br>"+"<br/>"+"<br/>");              //    /n  </script></head><body></body></html>

12. JavaScript中的函数

格式：

function myfunc（）{functuon_body;return value；            //返回值alter("return_values");           //弹窗          }

调用JS函数：刚开始可以使用鼠标按钮事件来触发函数。

13. JavaScript 事件

JavaScript 创建动态页面。事件是可以被 JavaScript 侦测到的行为。网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。

事件表：

1）onClick事件（onclick="func()"）

这就很简单了，不再赘述了。

2）onmouseout事件（onmouseover="func()"）

当鼠标经过一个对象时，就会触发相应的函数/事件。

例如：

3）onmouseout 事件

一开始进入网页时不会触发，但当鼠标移到对象再离开的时候就会触发相应的事件

4)光标聚焦事件（onfocus）

当网页中的对象获得聚点时，执行onfocus调用的程序就会被执行。

5)失焦事件（onblur）
onblur事件与onfocus是相对事件，当光标离开当前获得聚焦对象的时候，触发onblur事件，同时执行被调用的程序。

6) 内容选中事件（onselect）

选中事件，当文本框或者文本域中的文字被选中时，触发onselect事件，同时调用的程序就会被执行。

7)文本框内容改变事件（onchange）

通过改变文本框的内容来触发onchange事件，同时执行被调用的程序。

修改text之后，要在其他地方点一下才会出现警告框！！！

8) 加载事件（onload）加载新页面

事件会在页面加载完成后，立即发生，同时执行被调用的程序。

注意：1. 加载页面时，触发onload事件，事件写在<body>标签内。
2. 此节的加载页面，可理解为打开一个新页面时。

9) 卸载事件（onunload）格式： window.onunload=onunload_func;

当用户退出页面时（页面关闭、页面刷新等），触发onUnload事件，同时执行被调用的程序。

另：离开当前网页有两种方式，

1.像平常我们关闭网页，也就是离开网页了；

2.在当前网页点击加载其他网页，跳转到其他网页，也是离开当前网页的一种；

onunload属于第2种，只有当你要跳转到另一个页面时，也就是要离开当前网页了，要跳转到另一个网页了，onunload才会被触发；

那平常时关闭网页就直接跳出一个对话框是怎么办到的？原来还有一个onbeforeunload,顾名思义，就是在onunload被执行之前，就被调用，无论是以上2种跳转方法中的哪种，onbeforeunload都会被触发。

注意：这个事件好像只对IE有效，而且是当刷新页面或者点击超链接时才会触发，而关闭页面是不会被触发的；如果想要关闭网页时触发弹窗，我们可以使用onbeforeunload事件；window.onbeforeunload=onbeforeunload_func;

14. Programing Exercise

<!DOCTYPE html><html> <head>  <title> 事件</title>    <script type="text/javascript">   function count(){       var sum=0;       var num1=document.getElementById("txt1").value;             //获取第一个输入框的值var num2=document.getElementById("txt2").value;           //获取第二个输入框的值var sig=document.getElementById("select").value;           //获取选择框的值     switch(sig) {   case "+" : sum=parseInt(num1)+parseInt(num2); break;   case "-" : sum=num1-num2; break;   case "*" : sum=num1*num2; break;    case "/" : sum=num1/num2; break;   }                                                 //获取通过下拉框来选择的值来改变加减乘除的运算法则     document.getElementById("fruit").value=sum;                 //设置结果输入框的值        }  </script>  </head>  <body>   <input type="text" id="txt1" >    <select id="select"><option value="+">+</option><option value="-">-</option><option value="*">*</option><option value="/">/</option>   </select>   <input type="text" id="txt2" >    <input type="button" value=" = " onClick="count()"> <!--通过 = 按钮来调用创建的函数，得到结果-->    <input type="text" id="fruit" >    </body></html>

注意：楼主经过研究发现javascrip加法总是把两个数字拼接了起来；这是因为JavaScript默认总是按照字符串来处理变量；为了解决这个问题，我们可以把“+”号换成“- （-）”；也可以在数字前面加上parseInt（number）或者parseFloat(number)，把它强制解析成整形/浮点型变量来进行数学运算。

阅读全文

1 0