js基本语法

Swift语法有很多跟其类似

function myClick() {

    var iNum1 = 10;
    var sString = "dda";
    var bFlag = true;
    var aNum = [1,2,3,4];
    var oObject = {name:"a",age:12};
    var fNumber = 10.12;

    var iNum2 = 10, sString2 = "kk",bFlag1 = false;
    var sString2;
    alert(sString2);

    //1.变量的第一个内容必须是字母、下划线、$
    //2.其余的内容必须是_、$、字母、数字
    //3.变量不能是js的关键字

    var sString3 = "hello world";
    //获取字符串长度
    console.log(sString3.length);
    //获取指定索引下的字符
    console.log(sString3.charAt(2));
    //截取字符串
    console.log(sString3.substring(1,3));
    //截取多少个长度
    console.log(sString3.substr(1,4));
    //第一次出现的位置是什么,如果后面加个参数表示从第四个位置之后开始出现的位置是什么
    console.log(sString3.indexOf("l",4));
    //从后往前出现的位置
    console.log(sString3.lastIndexOf("l"));
    alert(sString3.length);


    //数组
    var aItem = new Array();//不写后面的数值的可以随意添加数组的个数，如果括号写入数值就只能添加相应个数的数组元素
    aItem[0] = "a";
    aItem[1] = "b";
    aItem[2] = "c";
    aItem[3] = "d";

    var bItem = ["a","b","c","d"];
    for(var i = 0; i < bItem.length; i++){
        console.log(bItem[i]);
    }

    //将数组变成字符串
    console.log(bItem.toString());
    //将数组以_为链接符
    console.log(bItem.join("_").toString());//结果为a_b_c_d
    //将数组反序输出
    console.log(bItem.reverse().toString());

    var sString5 = "ds_ga_fg_hff";
    //将字符串以什么分割，分割为一个数组
    var aArray = sString5.split("_");
    console.log(aArray[2]);//结果为fg


    //= == ===
    var iNumber = 10;
    var sString = "10";
    var iNumber2 = 0;
    //两个等于的时候只判断数值是否相等，三个的时候会判断类型和数值是否都相等；
    if(iNumber == sString){
        iNumber2 = iNumber;
    }
    console.log(iNumber);//两个等于的时候结果是10，三个等于的时候结果是0；

    var i = 1;
    var iSum = 0;
    while (i < 101){
        iSum += i;
        i++;
    }
    console.log(iSum);


    var sHtml = "";
    sHtml = "";
    for(var i=1; i<=9;i++){
        sHtml += "";
        for(var j=1;j<=i;j++){
            sHtml += "";
        }
        sHtml += "";
    }
    sHtml += "
" + i + "*" + j + "=" + i*j + "
";
    document.write(sHtml);


    //冒泡排序
    var aNumber = [10,2,34,56,12,45.67,65,89.21,1];
    var iNumber3 = 0;
    for(var i = 0; i <= aNumber.length-2;i++){
        for(var j = i+1; j <= aNumber.length - 1; j++){
            if (aNumber[i] > aNumber[j]){
                iNumber3 = aNumber[i];
                aNumber[i] = aNumber[j];
                aNumber[j] = iNumber3;
            }
        }
    }
    console.log(aNumber.toString());



    var sInput = prompt("请输入1~7之间的一个整数");
    try {
        //parseInt将字符串的数字转为整数，只限于数字的字符串
        if (sInput == parseInt(sInput)){
            if (parseInt(sInput) > 7 || parseInt(sInput) < 1){
                alert("输入的整数不在1~7之间");
            }else {
                switch (parseInt(sInput)){
                    case 1:
                        alert("星期一");
                        break;
                    case 2:
                        alert("星期二");
                        break;
                    case 3:
                        alert("星期三");
                        break;
                    case 4:
                        alert("星期四");
                        break;
                    case 5:
                        alert("星期五");
                        break;
                    case 6:
                        alert("星期六");
                        break;
                    case 7:
                        alert("星期天");
                        break;
                    default:
                        break;
                }

            }
        }else {
            alert("输入的不是一个整数");
        }
    }
    catch (e){
        alert("输入的不是一个整数");
    }



    //获取π
    alert(Math.PI);
    //获取最大数
    alert(Math.max(20,10,90));
    //最小数
    alert(Math.min(10,230,1));
    //四舍五入
    alert(Math.round(12.56));
    //向上舍入
    alert(Math.ceil(12.1));
    向下舍入
    alert(Math.floor(12.1));
    //随机数
    alert(Math.random());//Math.random()获取0~1之间的数，不包括0和1
    //获取1到100的随机数
    alert(Math.floor(Math.random()*100 + 1));


    //日期
    var mDate = new Date();
    //获取年
    alert(mDate.getFullYear());
    //获取月（从0开始）
    alert(mDate.getMonth()+1);
    //获取日
    alert(mDate.getDate());
    //获取时
    alert(mDate.getHours());
    //获取分
    alert(mDate.getMinutes());
    //获取秒
    alert(mDate.getSeconds());
    // 获取星期几
    alert(mDate.getDay());
}

 //时间计时器
    var i = 0;
    //间隔一秒，反复执行
    setInterval(function () {
        i++;
        document.getElementById("d1").innerText = i;
    },1000);

    //间隔一秒执行后，不在执行
    setTimeout(function () {
        i++;
        document.getElementById("d1").innerText = i;
    },1000);

   var timer = setInterval(function () {
        i++;
        if (i == 6){
            //清除定时器
            clearInterval(timer);
        }
        document.getElementById("d1").innerText = i;
    },1000);

 $(function () {
       //jQuery对象
       $("#btn").click(function () {
          alert("hello");
       });

       //js实现
       document.getElementById("btn").onclick = function () {
           alert("hello");
       }

       //js对象调用jQuery方法
       $(document.getElementById("btn")).click(function () {
          alert("hello");
       });


       //jQuery对象调用js方法
        $("#btn")[0].onclick = function () {
            alert("aaa");
        }

    });

 //标签选择器
    $("input").click(function () {
        alert("aa");
    });
    //class选择器
    $(".b").click(function () {
        alert("aa");
    });
    //id选择器
    $("#btn").click(function () {
        alert("aa");
    });


    //偶数行
    $("p:odd").css("color","red");
    //奇数行
    $("p:even").css("color","green");
    //页面中的第一个p标签
    $("p:first").css("color","blue");
    //页面中的最后一个p标签
    $("p:last").css("color","blue");
    //父标签的第一个p标签
    $("p:first-child").css("color","blue");
    //父标签的最后一个p标签
    $("p:last-child").css("color","blue");
    //父标签的第一个标签并且是p标签
    $("p:nth-child(1)").css("color","blue");
    //父元素的第一个p标签
    $("p:nth-of-type(1)").css("color","blue");


    //里面包含a标签的div
    $("div:has(a)").css("color","red");
    //设置title属性的a标签
    $("a[title]").css("color","blue");
    //设置href已www开头的a标签
    $("a[href^=www]").css("color","green");
    //设置href已pdf结尾的a标签
    $("a[href$=pdf]").css("color","green");
    //设置href等于www.bai的a标签
    $("a[href='www.bai']").css("color","green");
    //设置href里面包含w的a标签
    $("a[href*=w]").css("color","green");

    //禁用button
    $("input[type=button]").attr("disabled","disabled");
    $(":button").attr("disabled","disabled");


    //获取第3个div，两种写法
    $("div").eq(2).css("color","red");
    $("div:eq(2)").css("color","red");
    //获取第3个div后面的div
    $("div:gt(2)").css("color","red");
    //获取除第3个span之外的兄弟标签
    $("span").eq(2).siblings().css("color","green");
    //过滤掉不符合条件的
    $("span").not(":eq(2)").css("color","red");
    $("input").not(":button");
    //筛选出第三个
    $("span").filter(":eq(2)").css("color","red");

    //查找父元素
    $(".d1").parent().css("color","red");
    //查找子元素
    $(".d1").children().css("color","green");
    //查找上一个元素
    $(".d1").prev().css("color","green");
    //查找同级下的所有元素
    $(".d1").prevAll().css("color","green");
    //查找下一个元素
    $(".d1").next().css("color","green");
    //查找同级下所有元素
    $(".d1").nextAll().css("color","green");

//获取div个数
    alert($("div")).size();
    //加个内敛样式
    $(".c1").css({"color":"red","font-size":"30px"});
    //加个class
    $(".c1").addClass("c2 c3");
    //移除样式
    $(".c1").removeClass("c2");

    $("c1").find("span").css("color","red");

    $("div").addClass("c1").filter(function (index) {return index == 1 || $(this).attr("id") == "d3"}).addClass("c2");
    //找到p标签添加class c2
    $("div").find("p").addClass("c1").addClass("c2");
    //找到p标签添加class c1，end()表示找到p所在的父元素，然后添加class c2；
    $("div").find("p").addClass("c1").end().addClass("c2");

    //获取属性
    alert($("#d1").attr("title"));
    //设置title
    $("#d1").attr("title","aaa");
    $("#d1").attr({"title":"aaa","id":"d2"});
    //获取内容
    alert($("#d1").html());
    //获取文字内容
    alert($("#d1").text());
    //设置文本内容
    $("#d1").text("a");

    //判断是否包含某个样式
    alert($("#d1").hasClass("c1"));

    //判断结果元素是否是什么
    alert($("#d1").is("div"));

    $("#d1").append("
a
");

    $("
a
").appendTo($("#d1"));

    $("
a
").insertBefore($("#d1"));

    $("
a
").insertAfter($("#d1"));

    //鼠标放上去之后
    $("#d1").onmouseover(function () {
       alert("111");
    });
    //鼠标离开之后
    $("#d1").onmouseout(function () {
       alert("222");
    });

    $("#d1").hover(function () {
        alert("111");
    },function () {
        alert("222");
    });

数组的操作

   a = new Array(1,65,26,9);
   b = new Array(12,2);
    // alert(a.concat(b));//1,5,12,2;拼接两个数组
    // alert(a.join("-"));// 1-5;返回一个字符串，通过制定的分隔符进行分割
    // alert(a.pop());//5;删除并返回数组的最后一个元素
    // alert(a.push(90,89));//4;向数组末尾添加一个或更多元素，返回最后新数组的长度
    // alert(a.reverse());//5,1;倒序输出数组元素
    // alert(a.shift());//1;删除并返回数组的第一个元素
    // alert(a.slice(2));//6,9;从数组返回选定的元素
    /*
    function sortNumber(a,b) {
        return a - b
    }
    alert(a.sort(sortNumber));//1,9,26,65;默认是按照字母顺序排序，如果要按照大小，就需要写个函数
    */
    /*
    a.splice(1,1,88);
    alert(a);//1,88,26,9;//第一个参数必填，表示添加或删除在数组中所在的位置，第二个参数必填，表示要删除的数量，0表示不删除，第三个可选，要添加的元素
    */

    // function employee(name,job,born) {
    //     this.name = name;
    //     this.job = job;
    //     this.born = born;
    // }
    // var bill = new Array(employee("bill","Engineer",1994));
    // document.write(bill.toSource());

    // alert(a.toString());//把数组转换为字符串

    // alert(a.unshift(20,4));//6;向数组开头添加一个或多个元素，并返回新的长度