学习笔记-JavaWeb-浅学JS对象、事件-CSDN博客

本文链接：https://blog.csdn.net/fixxxxxxx/article/details/132034589

对象

Array

JS中Array相当于java中的集合，长度可变，类型可变。

演示：

<script>
        var arr = new Array(3, 4, 5, 'n');
       
        arr.push('m',5,4,34,'po');
        arr.splice(1,4);
        arr.forEach((e)=>{
            console.log(e);
        })
    </script>

String

演示：

    <script>
        var str=new String("124afsagg");
        document.write(str);
        console.log(str.length);
        console.log(str.charAt(4));
        console.log(str.indexOf('ag'));
        console.log(str.substring(2,5));
    </script>

JSON

自定义对象

演示：

<script>
        var tom={
            name :"tom",
            age: 20,
            gender:"male",
            eat: function(){
                alert("吃饭");
            }
        };
        alert(tom.name);
        tom.eat();
    </script>

先后弹出 “tom"和“吃饭”。

JSON

演示：

    <script>
        var tom = {
            name: "tom",
            age: 20,
            gender: "male",
            eat() {
                alert("吃饭");
            }
        };
        // alert(tom.name);
        // tom.eat();

        var JSONstr='{"name":"tom","age":20,"hobby":["basketball","swim","running"]}'
        var obj=JSON.parse(JSONstr);
        console.log(obj.name+",年龄："+obj.age);

        var JSONstr2=JSON.stringify(tom);
        console.log(JSONstr2);
    </script>

BOM

概念：Browser Object Model 浏览器对象模型，允许 JavaScript与浏览器对话，JavaScript将浏览器的哥哥组成部分封装成对象。

组成：

window:浏览器窗口对象
Navigator:浏览器对象
Screen:屏幕对象
History:历史记录对象
Location:地址栏对象

window

Location

演示：

<script>
    alert(location.href);
    location.href="https://www.4399.com";
</script>

网页先弹出当前的地址，然后切换到4399小游戏官网。

DOM

不演示了，有些困难。

事件

事件监听

事件绑定

演示：

<body>

    <div><input type="button" id="bt1" value="按钮1" onclick="on()">
        <input type="button" id="bt2" value="按钮2">
    </div>


    <script>
        function on() {
            alert("按钮1被点击了...");
        }
        document.getElementById('bt2').onclick=function(){
            alert("按钮2被点击了...");
        }
    </script>
</body>