前端JS笔记 | 青训营笔记

29 阅读4分钟

6、JS的函数重载

    面试:JS中是否存在重载?

        (1)JS中不存在重载。

        (2)但是可以通过其他方法来达到重载的目的。

        (3)在JS中如果方法名相同,会调用最后一个方法。

        (4)参数会保存在arguments数组中。

7、JS的BOM对象

    Browser Object Model,浏览器对象模型。

 

    有哪些对象:

        navigator:可以获取浏览器的相关信息。

            appName:浏览器名称

            document.write(navigator.appName);    //注意navigator要小写

 

        screen:获取浏览器屏幕的信息,例如宽度、高度、分辨率

            document.write(screen.width);    获取屏幕宽度

            document.write(screen.height);    获取屏幕高度

 

        location:表示请求URL地址

 

        history:请求URL的历史记录

            length:返回浏览器历史列表中的URL数量

            back():加载history列表中的前一个URL

            forward():加载history列表中的下一个URL

            go():加载history列表中的某个具体页面 

            创建三个页面:

                (1)创建第一个页面a.html,写一个链接到b.html

                (2)创建b.html,写一个超链接c.html

                (3)创建c.html

        window:

            window对象是JS层级中的顶层对象。(所有的BOM对象都在window中进行操作)

            window对象代表一个浏览器窗口或一个框架。

            window对象会在或出现时自动创建。

 

            属性:

                opener:返回创建此窗口的窗口的引用。

 

            方法:

                alert():在页面弹出一个提示窗口

 

                confirm():显示带有一段消息以及确认按钮和取消按钮的对话框

                    在弹出的对话框中选中确定,返回true,选中取消,返回false。

 

                prompt(text, defaultText):显示可提示用户输入的对话框

                    text:对话框中显示的内容。

                    default:对话框中输入框中默认显示的文本。

 

                open(url, name, features, replace):打开一个新的浏览器窗口或查找一个已命名的窗口,一般使用三个参数即可

                    url:打开的新窗口的URL地址

                    name:空字符串即可

                    features:窗口特征,比如窗口宽度和高度

                    创建一个按钮,当点击按钮时,打开一个新窗口  

                close():关闭当前窗口(浏览器兼容性较差)

 

                setInterval(code, millisec):按照指定的周期(以毫秒计)来调用函数或计算表达式 

                    参数:

                        code:要调用的函数或要执行的代码

                        millisec:周期性执行或者调用code之间的时间间隔,以毫秒计。1秒 = 1000毫秒

                    setInterval("alert(123)", 3000);    每三秒弹出一个对话框。

                    可以使用这个方法来制作系统时间、定时器等。

 

                setTimeout(code, millisec):在指定的毫秒数之后来调用

                    与setInterval的区别是,setTimeout只会执行一次,而setInterval会重复执行。

 

                clearInterval():清除setInterval()设置的定时器

                    clearInterval()方法的参数必须是由setInterval()返回的ID值。

                clearTimeout():清除setTimeout()设置的定时器

                    clearTimeout()方法的参数必须是由setTimeout返回的ID值。

8、JS的DOM对象

    Document Object Model,文档对象模型。

        文档:超文本文档(超文本标记文档),HTML、XML。

        对象:提供了属性和方法。

        模型:使用属性和方法来操作超文本标记型文档。

    可以使用JS中DOM里面提供的对象,使用这些对象的属性和方法,对标记型文档进行操作。

 

    想要对标记型文档进行操作:

        首先需要对标记型文档中的所有内容都封装成对象。

            需要把HTML中的标签、属性、文本内容都封装成对象。

        然后需要解析标记型文档。

 

    如何使用DOM解析HTML:

        首先会根据HTML的层级结构在内存中分配一个树形结构,然后再通过不同的对象来操作HMTL。

 

    对象:

        Document对象:

            整个HTML文档。

        Element对象:

            标签对象。

        Element -> 属性对象。

        Element -> 文本对象。

        Node节点对象:

            是Element对象的父对象。

            如果在Element对象中找不到想要的方法,可以去Node对象中寻找。

 

    DOM的三个级别:

        (1)将HTML文档封装成对象。

        (2)在以上基础上添加新的功能,例如:对事件和CSS样式的支持。

        (3)支持XML的一些新特性。

    DHTML:

        动态的HTML,它不是一门语言,是多项技术的综合体的简称。

        包括HTML、CSS、DOM、JavaScript

        这四种语言的职责:

            HTML:负责提供标签,封装数据,这样便于操作数据。

            CSS:负责提供样式,对标签中的数据进行样式定义。

            DOM:负责将标签及其内容解析,封装成对象,对象中具有属性和行为。

            JavaScript负责提供程序设计语言,对页面中的对象进行逻辑操作。