js入门

一、写法

1. js写在head或body标签里

2. 两种引入方式
   内部：

     <script type="text/javascript">
       document.write("<h1>哈哈</h1>");
     </script>
   

   外部：

     <script type="text/javascript" src="index2.js"></script>
   
   

二、常用

1. alert("")弹窗
2. document可以动态的在网页上改变内容,或者写html(除了变量都要用引号包起来，包括页面元素)
   例子：

    document.write("哈哈");
    document.write("<input type=\"text\">");

3. 变量为弱类型（自动识别类型），都用var定义，若没赋值就为undefined,置空就是将变量赋值为null.

4. 两个等号只判断值，不比类型，三个等号会判断类型

5. 数组

   //数组声明，可以声明长度（不声明长度可以动态加长，且可为字符串和数字）
   var a = new Array();
   a[0]="哈哈";
   a[1]=12;
   a[2] = "呵呵";
   //第二种
   var a2 = ["第二中", 2, "完成"];
   //两种数组遍历
   	//第一种
       for (var o in a) {
           alert(a[o]);
       }
   	//第二种
       for (var i = 0; i < a2.length; i++) {
           alert(a2[i]);
       }
   //常用方法
   	//排序
   	a2.sort(); 
   	//拼接
   	var b=a.join(".");//用点号分开 ，默认用逗号分开 
   	//合并数组
       alert(a.concat(a2));
       //逆序数组
       alert(a2.reverse())
   

三、函数

1. 函数：两个不同于java的地方：1. 无返回类型，2. 参数无类型。
   注意：调用时如果只写方法名(不加括号)，代表执行方法，若写方法名带括号就代表得到方法执行后的结果。

     <script type="text/javascript">
       function f(a,b) {
         return a+b;
       }
       var c=f(1,3);
       alert(c);
     </script>
   

四、操作Dom

1. 处理dom事件：

   <script type="text/javascript">
      function f() {
          alert("点我干嘛");
      }
   </script>
   <input type="button" id="button" value="按钮" onclick="f()">
   
   

2. 操作dom节点（增删改dom节点）

       function f2() {
           //新增dom节点
           var inputDom=document.createElement("input");
           //改变dom样式
           inputDom.type = "text";
           inputDom.value = "哈哈";
           var parent = document.getElementById("parent");
           //添加dom节点
           parent.appendChild(inputDom);
           //定点插入dom
           var son = document.getElementById("son");
           parent.insertBefore(inputDom, son);
       }
       function f3() {
           var parent = document.getElementById("parent");
           var son = document.getElementById("son");
           //删除dom
           parent.removeChild(son);
       }
       //对于容器(就是那些里面能放标签的的标签)，可以插入innerHtml,
       document.createElement("input").innerHTML="插入的值"；
       //对于非容器，可以.value
       document.createElement("input").value="哈哈"；
   

五、JS类

1. js为动态语言，可以动态的增删一些变量和方法，例子在下面

       <script type="text/javascript">
           //定义对象
           var person = new Object();
           //动态增加属性
           person.name = "袁欢";
           //动态增加方法
           function f(str){
               alert(str)
           }
           person.func = f;
           //有参构造方法
   
           function Student(name,age) {
               this.name=name;
               this.age=age;
               //定义类方法
               function f1() {
                   alert(name+age);
               }
               this.f=f1;
           }
           //使用
           var student=new Student("袁欢",22);
           alert(student.name);
           student.f();
           //动态删除对象的方法属性
           //方法一
           delete student.name;
           delete student.f();
           //方法二
           student.name=undefined;
           student.f=undefined;
   </script>
       </script>
   

六、常用的内置方法

1. 字符串操作

   //字符串查找（查找第一个abc子串）
   s2.indexOf("abc", 0)；
   //替换abc串为空
   s2.replace("abc", "");
   

2. 日期获取

   1. 日期对象实例化 : var date = new Date();

   2. getTime()方法，返回 1970 年 1 月 1 日至今的毫秒数。

   3. getFullYear() 从 Date 对象以四位数字返回年份。

   4. getMonth() 从 Date 对象返回月份 (0~11)。

   5. getDate() 从 Date 对象返回一个月中的某一天 (1~31)。

   6. getHours() 返回 Date 对象的小时 (0~23)。

   7. getMinutes() 返回 Date 对象的分钟 (0~59)。

   8. getSeconds() 返回 Date 对象的秒数 (0~59)。

   9. getDay() 从 Date 对象返回一周中的某一天 (0~6)。

3. 全局函数
   JS 包含以下 7 个全局函数，
   用于一些常用的功能：escape(),eval(),isNan(),isFinite(),parseFloat(),parseInt(),unescape();

   1. eval()用于计算字符串中的值

       var str="1*2*3";
       alert(eval(str));//弹出结果为6
   

4. 内置对象及其方法
   window对象常用方法及事件

	//两秒后执行f函数
	window.setTimeout(f, 2000);
	//间隔五秒执行f函数
	setInterval(f, 5000);
	//再窗口名为1 的窗口，打开url网址，（无名为1的窗口则新建一个名为1的窗口）
	window.open(url,"1");
	//在当前窗口打开url网址
	window.open(url,“_self");
	//在新建窗口打开url网址
	window.open(urls[i],"_blank");
	//还有一些功能：文档加载完毕执行函数，页面大小改变执行函数等等

5. js Window对象常用方法和事件

   //间隔五秒执行f函数
   setInterval(f, 5000);
   //再窗口名为1 的窗口，打开url网址，（无名为1的窗口则新建一个名为1的窗口）
   window.open(url,"1");
   //在当前窗口打开url网址
   window.open(url,“_self");
   //在新建窗口打开url网址
   window.open(urls[i],"_blank");
   

6. js获取html值和插入html
   

7. 网页动态的加入值
   前台可以用上面js中的插入html

   <script type="text/javascript">
       function f() {
           document.getElementById("test").innerHTML="测试";
       }
   </script>
   <input type="button" value="按钮" onclick="f()" />
   

   后端可传值，前台用EL表达式，有值就显示