js中的对象

最新推荐文章于 2024-11-05 15:26:40 发布

mr_zhangs

最新推荐文章于 2024-11-05 15:26:40 发布

阅读量238

点赞数 1

分类专栏： javaweb 前端文章标签： javascript

本文链接：https://blog.csdn.net/mr_zhangs/article/details/75269166

版权

javaweb 前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

    **javaScript**

js中的对象注意点

<script>
    Array.prototype.test=function(){
        }

    //数组定义
    var person=new Array("zhnagsan","lisi","wangwu");

    // 添加元素
     person.push("aaa");
    //数组的访问
    for(var i=0;i<person.length;i++){
        alert(person[i]);
        //document.write(person[i]);
        }


    //方法二访问,一旦对数组出现扩展，就出现错误
    //for(var i in person){
        //alert(i);最后会打印test
        //alert("-------"+person[i]);
        //数组的连接操作
        //var steinfo=person.join("---------");
        //alert("；连接后的字符串为"+steinfo);

</script>

js可直接写，或者引入js文件

a : 直接写

<script>
 var str="2016-12-12";
 var val=Date.parse(str);
 var newDate=new Date(val);
 //输出换行
 document.write("<br>");
 document.write(newDate);
 document.write("<br>");
 var val2=newDate.toDateString();
 document.write(val2);
</script>

b : 引入外部文件

<script src="js/01.js"></script>

01.js

// JavaScript Document
document.write("hello world");

js字符串的操作

<script>
    var str="hello world";
    //检索字符串包含的内容,用于验证字符串是否存在
    var index=str.indexOf('wo');
    //alert(index);

    //分割字符串
    var path="E:/test/001.txt";
    var findIndex=path.lastIndexOf('/');
    var getname=path.substring(findIndex+1);

    //alert(getname);
    //将字符串分割成数组
    var StrDemo="zhangsan,li,wangwu,zhaoliu"
    var arrays=StrDemo.split(',');
    //for(var i=0;i<arrays.length;i++){
        //doucment.write("arrays[i]<br>");
        //alert(arrays[i]);
        //}

    //字符串同数学运算的结合
    var jisuan="2+4*2/4+5";
    var num=eval(jisuan);
    alert(num);
</script>

window中的定时器window.setInterval（）

<script>
    var num=10;
    function reducement(){
        if(num>0){
            num--;
        }
        document.getElementById("span1").innerHTML=num;

        }

        var myinterval="";


        //定时器
    function getResult(){
        //用来每隔一段时间执行某个方法，第一个参数为方法的名字，第二个参数为多少ms
        myinterval=window.setInterval("reducement()",2000);//每隔2秒执行
        }

        //停止定时器
        function stopIt(){
            window.clearInterval(myinterval);
            }
</script>

</head>


<body>

    <input type="button" value="单击" onclick="getResult()" />
    <input type="button" value="停止" onclick="stopIt()"  />
    <span id="span1"></span>

</body>

方法的定义

<script>
    function add(a,b){
        return a+b;
        }

    function out(str){
        //document.write("======="+str);
        alert("--------"+str);
        }

    function get(){
        alert("========"+add(5,6))
        }
</script>
</head>
    <input onclick="out('hello')" type="button" value="方法一"/>
    <input onclick="get()" type="button" value="方法二"/>
<body>
</body>

交互，例如：确定删除？？

<script>
    //window.alert(new Date());
    确认框
    var msg=window.confirm("sure?");
    //msg会返回true or false

    alert(msg);
    //用户输入框
    //var s=window.prompt("请输入。。。");
    //alert(s);
</script>

类型的转换（主要是日期）

<script>
 var str="2016-12-12";
 var val=Date.parse(str);
 var newDate=new Date(val);
 document.write("<br>");
 document.write(newDate);
 document.write("<br>");
 var val2=newDate.toDateString();
 document.write(val2);
</script>

流程的控制switch使用省略if
这里的window.prompt()方法用的少了，用户输入框

()<script>
  var s=window.prompt("请输入季节。");
  switch(s){
      case "一":
        document.write("春天");
        break;
        case "二":
        document.write("夏天");
        break;
        case "三":
        document.write("秋天");
        break;
        case "四":
        document.write("冬天");
        break;
        default:
        document.write("无效输入");
        break;
      };
</script>

1.循环

<script>
 for(var i=1;i<=10;i++){
     var num=i*10+"px";
     document.write("<hr width='"+num+"'/>");
     }

</script>

1.延迟打印，换色window.setTimeout（）

<script>

    function showTest(){
        //alert("消息在5秒之后发出");
        document.getElementById("myDiv").style.backgroundColor="blue";      
        }

    //5秒之后执行
    function myTimeout(){
        window.setTimeout("showTest()",5000);
        }
</script>


</head>

<body>

    <input type="button" value="5秒之后执行"  onclick="myTimeout()" />

   <div id="myDiv" style="border-radius:20px;height:40px; width:40px; background:#CCC">
   </div>
</body>