zoukankan      html  css  js  c++  java
  • 4、JavaScript

    一、JavaScript的概念:是基于对象和事件的脚本语言

      1、特点:

        a)、安全性。

        b)、跨平台性(只要可以解释JS的浏览器就可以执行,和平台无关)  

      2、JavaScript与Java的区别:

        a)、JS是NetScape公司产品,Java是Oracle公司
        b)、JS是基于对象,Java是面向对象
        c)、JS只需解释就可以执行,Java需要先编译成字节码文件再执行
        d)、JS是弱类型,Java是强类型

      3、JavaScript与HTML的结合:

        a)、JS代码存放在标签<script>...</script>
        b)、使用script标签的src属性引入一个js文件(<script type="text/javascript" src="JS文件"></script>)

      4、<script>的存放位置:

        a)、HTML文件的<head>标签中

        b)、HTML文件中<body>标签中

    二、JavaScript语法:

      1、变量通过关键字var来定义,弱类型不需要指定具体的数据类型(注意:JS中特殊常量值undefined,当变量没有初始化就被使用,该变量的的值就是undefined)
            var v;
            v = v + 5;
            alert(v);// 结果是NaN
      2、语句(与Java语句格式相同):逻辑运算符:&& ||
        if语句:
              注意:var x = 3;
                if(x==4)//可以进行比较运算
                if(x=4)//可以进行赋值运算,而且同样可以进行判断
                原因:在JS中0可以表示false,非0可以表示true(通常用1表示),因此if(x=4)结果为true   。非null为true,null为false
        switch语句:switch(x),其中x可以接收字符串
        循环语句(whiledo...whilefor)
        for(变量 in 对象){...}
      3、函数:
        一般函数:格式:function 函数名(形式参数...){...}
          注意:调用有参数的函数时,但没有给其传值,函数一样可以运行,或者调用没有参数的函数并给其传值,该函数一样可以运行。
             在函数中有一个参数数组对象(arguments),该对象将传递的参数都封装在一个数组中
             在函数中定义变量时没有使用var关键字,那么执行该函数后,此变量就成为一个全局变量
             函数在调用时的写法:
             var s = method();// s变量接收method函数的返回值
             var s = method;// s和method代表同一个函数,那么该函数也可以通过s()的方式调用
        匿名函数:格式:function(){...}  (或者说是直接将函数作为参数直接传递,不进行封装)
               例:var demo = function(){...}
               调用:demo();
      4、数组
        特点:长度是可变的,可以存任意元素(数组里存放的元素类型可以不同)
        定义格式:var arr = new Array();
             arr[0] = "hello";
             arr[1] = 1;
             arr[2] = true;

             输出:var arr = ["123", 23, true];

     三、JavaScript语句示例:

      1、在<head>标签中编写:

     1 <!-- 鼠标单击显示按钮后弹出提示对话框,提示内容为:JavaScript示例 -->
     2 <html>
     3   <head>
     4     <title>JavaScript示例</title>
     5     <script type="text/javascript">
     6        function test(){
     7           alert("JavaScript示例");
     8        }  
     9     </script>
    10   </head>
    11   
    12   <body>
    13     <input type="button" value="显示" onclick="test()">
    14   </body>
    15 </html>

      2、外部 .js 文件中编写

        a)、创建一个  .js 文件:如文件名为  testJavaScript.js 类容为:

    function test(){
       alert("JavaScript示例");
    }

        b)、在<head>标签中利用<script>标签引入 testJavaScript.js文件,便可以达到与上例相同的结果。

     1 Transitional//EN">
     2 <!-- 鼠标单击显示按钮后弹出提示对话框,提示内容为:JavaScript示例 -->
     3 <html>
     4   <head>
     5     <title>JavaScript示例</title>
     6     <script type="text/javascript"  src="testJavaScript.js"></script> 
     7   </head>
     8   
     9   <body>
    10     <input type="button" value="显示" onclick="test()">
    11   </body>
    12 </html>

    四、DOM(document object model):文档对象模型

      1、DHTML:是多个技术的综合体,称为动态HTML
        HTML:将数据进行封装
        CSS:负责标签中数据的样式
        DOM:将标签封装成对象
        JS:将以上三者进行融合,通过程序来操作这些对象,完成动态效果

      2、节点:根据 DOM,HTML 文档中的每个成分都是一个节点。

             DOM 是这样规定的:

        • 整个文档是一个文档节点 
        • 每个 HTML 标签是一个元素节点 
        • 包含在 HTML 元素中的文本是文本节点 
        • 每一个 HTML 属性是一个属性节点 
        • 注释属于注释节点 

        父级节点:parentNode
        子节点:childNodes
        兄弟节点:
          上一个兄弟节点:previousSibling
          下一个兄弟节点:nextSibling

    五、JavaScript中的常见对象中

      1、Document对象:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>Document节点</title>
        <script type="text/javascript">
           function test(){        
               /* 将String类型的数据强转为number型 
                  document.getElementsById返回的是一个具体的对象
               */
               var sum= Number(document.getElementById("data1").value); 
                   sum+= Number(document.getElementById("data2").value);
              alert(sum);
           }
           function test1(){        
               /* 将String类型的数据强转为number型 
                 document.getElementsByName返回的是一个数组对象  
               */
               var sum = document.getElementsByName("data1")[0].value; 
                    sum -= document.getElementsByName("data2")[0].value; 
              alert(sum);
           }
        </script>
      </head>
      
      <body>
         数值一:<input type="text"  id="data1" name ="data1" value="1"/>
         数值二:<input type="text"  id="data2" name ="data2" value="1"/>
         <input type="button" onclick="test()" value="计算加" />
         <input type="button" onclick="test1()" value="计算减" />
      </body>
    </html>
    close() 关闭用 document.open() 方法打开的输出流,并显示选定的数据。
    getElementById() 返回对拥有指定 id 的第一个对象的引用。
    getElementsByName() 返回带有指定名称的对象集合。
    getElementsByTagName() 返回带有指定标签名的对象集合。
    open() 打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出。

      2、Date对象:

    Date() 返回当日的日期和时间。
    getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。
    getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。
    getMonth() 从 Date 对象返回月份 (0 ~ 11)。
    getFullYear() 从 Date 对象以四位数字返回年份。
    getYear() 请使用 getFullYear() 方法代替。
    getHours() 返回 Date 对象的小时 (0 ~ 23)。
    getMinutes() 返回 Date 对象的分钟 (0 ~ 59)。
    getSeconds() 返回 Date 对象的秒数 (0 ~ 59)。
    getMilliseconds() 返回 Date 对象的毫秒(0 ~ 999)。
    1 function test(){
    2     var da = new Date();  /*返回当前日期和时间*/
    3     alert(da.getDate());   /*返回一个月中的某天*/
    4     alert(da.getDay());    /*返回一周中的某天*/
    5     alert(da.getHours());  /*返回对象的小时数*/
    6 };
  • 相关阅读:
    初识java反射机制
    基本数据类型-保装类型-string三种数据类型的转换
    java 正则表达式
    java 异常
    java 初识String
    java 接口
    java抽象
    初识多态 简单理解
    初来驾到学JAVA继承初识
    转载:Gearman php
  • 原文地址:https://www.cnblogs.com/czj-zhm/p/5839998.html
Copyright © 2011-2022 走看看