zoukankan      html  css  js  c++  java
  • JS_01_入门学习

    01:编写js文件:JavaScript_01.js

    // JavaScript Document
        //1、利用JavaScript来输出文字
        <script type="text/javascript">
        <!--
            document.write("02:External text output text!");
        //-->
        </script>

    02:编写html代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Tentative JavaScript</title>
    </head>
    
    <body>
        1、Use JavaScript to output text !
        <script type="text/javascript">
        <!--
            document.write("out put text");
        //-->
        </script>
        <br />
        
        2、Import external js to use !
        <script src="JavaScript_01.js"></script>
        <br />
        
        3if / else / alert
        <script type="text/javascript">
            var hob="football";
            var hob02="js";
            if(hob02=="js"){
                alert("Good for you !");    
            }else if(hob=="football"){
                alert("Bad for you !");    
            }
        </script>
        <br />
        
        4、Use js in form !
        <script type="text/javascript">
            
        </script>
        <form>
            <p><input type="radio" name="input" onclick="hobs(this.value)" value="js" id="js"/><label for="js">JavaScript</label></p>
            <p><input type="radio"  nam="input" onclick="hobs(this.value)" value="football" id="js"/><label>Football</label></p>
        </form>
        
        5、Use js switcth() method in html ! Use parseInt transform other to int !
        <script type="text/javascript">
            var score=65;
            switch(parseInt(score/10)){
                case 0:    
                case 1:    
                case 2:    
                case 3:    
                case 4:
                case 5:        
                    alert("bad digree");
                    break;
                case 6:    
                case 7:    
                    alert("just so so !");
                    break;
                case 8:
                case 9:
                    alert("good for you");
                    break;
                
            }
        </script> 
        <br />
        
        6、Get value by id
        <script type="test/javascript">
            function judge(){
                var score_01;
                var degree_01;
                score_01=document.getElementsById("score_01").value;
                if(score_01>100){
                    degree_01="do not need me !";
                }else{
                    degree_01="good for you";
                }
            }
            document.write(degree_01);
        </script>
        <form action="#" method="post">
            <label for="score_01">
                Degree[0-100]
            </label>
            <input name="score_01" id="score_01" type="text"/>
            <button onclick="judge()">ClickToSubmit</button>
        </form>
        <br />
        
        7、Prompt
        <script type="text/javascript">
            var score_07;
            var degree_07;
            score_07=prompt("Input your degree !");
            if(score_07>100){
                degree_07="Are you kiding";
            }else{
                switch(parseInt(score_07/10)){
                    case 0:
                    case 1:
                    case 2:
                    case 3:
                    case 4:
                    case 5:
                    case 6:
                        degree_07="bad degree";
                        judge_07();
                        break;
                    case 7:    
                        degree_07="7 degree";
                        judge_07();
                    case 8:
                    case 9:
                        degree_07="8-9 degree";
                        judge_07();
                }    
            }
            function judge_07(){
                document.write("<br/>"+degree_07);
                alert(degree_07);
            }
        </script>
        <br />
        
        8、confirm
        <script type="text/javascript">
            function isCainiao(){
                var isC=confirm("are you cainiao?");
                if(isC==true){
                    alert("CaiNiao");
                }else{
                    alert("DaShen");    
                }
            }
            isCainiao();
        </script>
        <form action="#" method="post">
            <button value="confirm" onclick="isCainiao()">Submit</button>
        </form>
        
        9for in loop / Array
        <br />
        <script type="text/javascript">
            var x;
            var hobbies_09=new Array();
            hobbies_09[0]="java";
            hobbies_09[1]="script";
            hobbies_09[2]="javascript";
            for(x in hobbies_09){
                document.write(hobbies_09[x]+"<br/>");    
            }
        </script>
        
        10、incident
        <br />
        <script type="text/javascript">
            function incident_09(){
                document.write("mouseOn");    
            }
        </script>
        <button onmouseout="incident_09()">incidentOn</button>
        <br />
        
        11try catch finally
        <script type="text/javascript">
            var i_11=0;
            var j_11=0;
            try{
                i/i;
            }catch(e){
                alert("error");
            }finally{
                alert("finally");
            }
        </script>
        <br />
        
    </body>
    </html>
  • 相关阅读:
    docker 应用-1(安装以及基础命令)
    网桥原理及使用
    【年终总结】个人的2019年年终总结
    【bat批处理】批量执行某个文件夹下的所有sql文件bat批处理
    【实用工具】.fbr格式免费播放器 FBR格式 Free FlashBack Player
    【SQL骚操作】SqlServer数据库表生成C# Model实体类SQL语句
    【算法基础】面试过程中遇到的一些算法题输出杨辉三角
    【sql基础】按照名字分组查询时间最早的一条记录
    【面试题】java面试题整理(有空再贴答案)
    【海驾资料】海淀驾校科目三考试资料
  • 原文地址:https://www.cnblogs.com/zjsy/p/4378286.html
Copyright © 2011-2022 走看看