zoukankan      html  css  js  c++  java
  • js(javascript)的总结 d2

    一.javascript

    1.java是编译解释型语言基于类的语言,而javascript是直译的脚本语言(运行一行读一行),是一种动态类型,弱类型的语言,内置支持类型,他的解释其是浏览器的一部分,最早用来给html增加动态功能,可以作为前端的验证和交互。他只有一个变量类型var类型,可以指定成字符串,对象,布尔。

    2.js的三种使用方式以及比较。

         首先,第一种直接写在<button id="btn" onclick="alert('你点我干嘛')">haa</button>,onclick就是js。这种方式将html和js写在一起了,骨架和行为分离。

      其次,第二种写在html的底部或者<head>里,还是在html里不过已经将两者分开了,由于html是从上一行一行向下编译读取的,如果将html放在head里面的话,前面需要增加一些操作,即widnows onload 等操作,当页面加载完成后才执行这段代码可以很简单,这种方式用于教学。

      最后一种是写在一个css文件里,在html中body里写一个脚本,再调css里,用了src,这种方式常用于工程,需要注意的是一个页面只能被加载执行一次,因此如果用到了外联css同时内部css也用到了加载,那么他只会默认选择前面的进行操作,而不会出现相同名字的替代。

    第一个·为用html,第二个为第一个调的scc.js需要注意的是他们在相同文件夹下。

      

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    <script type="text/javascript"  src="scc.js"></script>
    <script type="text/javascript">
        window.onload=function(){
            var btnf=document.getElementById("btn1");
            btnf.onclick=function(){
                alert("你点我");
            }
        };    
    </script>
    </head>
    <body>
        <button id="btn" onclick="alert('你点我干嘛')">haa</button>
        <button id="btn1" >a</button>
        <button id="btn2" >ff1</button>
        <button id="btn3" >b</button>
        <script type="text/javascript">
        var    btn1=document.getElementById("btn2");
            btn1.onclick=function(){
                alert("你点我啊");
            }
            </script>
    </body>
    </html>
    window.onload=function(){
        var btn=document.getElementById("btn3");
        btn.onclick=function(){
            alert("哈哈");
        }
    };

    用于两边都用了加载,所以在运行的时候会运行前面的也就是调用css。js而不会用到btn1相关的按钮了,因此执行会出现不兼容,要想改变必须放在一起加载或去掉一个。

    3.js函数

      首先明确js里的变量的命名都用var,无论是方法还是布尔,还是字符串都是一样的,这就是他与java的区别之一,这就会出现一个问题输入一个东西他到底是什么类型的,该如何判断,js里定义了一个函数也就相当于java里的类的概念,但是他不会存在函数的加载,如果存在两个函数同名,他会顺着浏览器执行,由下面的函数替换上面的函数,相当于完成了一次覆盖,如果出现了函数里的形参和实参数量不一致,也是可以运行的,但是在java里是不允许的。具体的操作如下。

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
        <script type="text/javascript">
            function sum(a,b){
                alert(a+b);
            }
            sum(2,3);
            var a1=function(a,b){
                return a+b;
            }
            alert(a1(4,6));
            function sum2(a,b,c){
                sum=a+b+c;
                //return有两个作用,1终止函数的执行。2将函数的结果返回给调用者。
                return sum;
            }
            // 不存在重载。
            alert(sum2(123,552,true));
            alert(sum2(123,"aa",true));
            alert(sum2(2,5,5,6));
        </script>
    </head>
    <body>
    </body>
    </html>

    输出的框依次是5,10,676,123aatrue,12。这个并没有提供覆盖,名字不相同。值得注意的是当 true前面接的是数字时它就会变成真也就是01中的1,而前面连接的是字符串时就会出现字符串true,这个地方只等注意。而最后一个也就忽略了6这个参数只进行前面三个参数的相加,这个在java里不允许的,是区别于java的特点,不存在重载。重载指的是,方法名相同,里面形参的数量类型或者顺序不同,或者是返回的值不同。

    4.js对象

    与java的类相似,定义一个对象,对象具有一些属性,通过调用一些属性来达到一些效果,是以键值对的形式保存的,键值对之间用“,”这却别与css和html“;”需要注意,他同时也可以调用函数,需要注意的是function函数需要在调用的地方的前面否则会出现没定义,然后报错。

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
        <script type="text/javascript">
        /*
            js中创建对象的两种方式:
                1.var obj =new Object();
                2.var  obj={};
        */
            var obj={};
            alert(obj);
        /*
            给对象动态的添加属性或者方法。
        */
            obj.name="张三";
            obj.age=12;
            alert(obj.name);
            alert(obj.age);
            function sum(a,b){
                var sum=a+b;
                alert(sum);
            }
            obj.fun=sum(2,3);
            var obj1={
                    name:"aa",
                    job:"bb",
                    school:function(){
                        alert("helleo");
                    }
            }
            alert(obj1.name);
            alert(obj1.job);
            obj1.school();
            var b=function(){
                alert("helleo");
            }
            var obj2={
                    name:"as",
                    job:"ss",
                    school:b
            }
            alert(obj2.name);
            alert(obj2.job);
            obj2.school();
            
        </script>
    </head>
    <body>
    
    </body>
    </html>
  • 相关阅读:
    OSG嵌入QT(QT界面使用Qt Designer编辑)
    C++ Makefile文件编写
    cbp2make使用
    for循环之后的return
    C++引用形参,函数返回多个值
    个人感悟之代理模式
    个人感悟之单例模式
    个人感悟之简单工厂模式-工厂方法模式-抽象工厂模式
    Java设计模式
    (转)java之Spring(IOC)注解装配Bean详解
  • 原文地址:https://www.cnblogs.com/guomingyt/p/7800906.html
Copyright © 2011-2022 走看看