JavaScript（第十周）

最新推荐文章于 2024-09-24 11:55:49 发布

ObscureMoon

最新推荐文章于 2024-09-24 11:55:49 发布

阅读量33

点赞数

分类专栏： JavaScript笔记文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/ObscureMoon/article/details/134365002

版权

JavaScript笔记专栏收录该内容

9 篇文章 0 订阅

订阅专栏

本文介绍了BOM（浏览器对象模型）、DOM（文档对象模型）在Web开发中的应用，详细讲解了window对象和location对象的功能，包括定时器（延时和重复定时器）的使用以及编码解码的相关知识。还提到如何关闭定时器以控制程序流程。

摘要由CSDN通过智能技术生成

1_BOM简介

//DOM:document object model

           //DOM: 文档对象模型,通过document.getElementByXxx()获取HTML文档内部的元素

           //BOM: Brower object model
           //浏览器器对象模型.可以获取一些浏览器自带的功能

           // 由于没有统一的BOM标准，每个浏览器都有自己的BOM实现方法，
           // BOM的浏览器兼容性较差。常见的BOM对象有：
               // window
               // document
               // location

2_window对象讲解

//window对象是全局对象又称顶级对象.可以省略不写
           //常见的方法:console.log() alert
           // console可以写成window.console。

           // alert()可以写成window.alert()。

           // prompt()可以写成window.prompt()。

           // open()可以写成window. open()。

           // close()可以写成window.close()。

//open表示开启一个新窗口重新开启一个窗口而a标签是在当前窗口完成覆盖.

3_location对象

           //location对象常用于路径相关的用法

           //常见用法1: 跳转到指定页面等同于A标签的功能
           document.getElementById("btn").onclick = function(){
               location.href = "1_BOM简介.html";
           }

           //常见用法2: 获取当前页面的URL地址
           document.getElementById("btn1").onclick = function(){
               console.log(location.href);
           }




           //客串知识点: 编码和乱码的区别:
           //乱码值得是两个字符串采用的编码不一致,导致数据乱套.
           //数据呈现出无法阅读的字样 .



           //编码:将占据空间较大的汉字转成占据空间较小的字母的编码形式
           //解码:将字母又转回汉字.

           //如何对字符串进行编码解码的操作
           var str = "%E5%AF%B9%E8%B1%A1";
           str = decodeURI(str);//进行解码
           console.log(str);

           var str = "对象";
           str = encodeURI(str);//进行编码
           console.log(str);

           //常见用法3: 刷新当前网页
           document.getElementById("btn2").onclick = function(){
               location.reload();
           }

4_定时器的基本用法

//定时器: 每间隔多少时间毫秒自动执行函数的一种机制.

           //例如5秒后退出系统例如轮播图每隔1秒进行图片的转变

           //定时器的种类: 分为延时定时器和重复定时器

           //延时定时器: 等待多少时间执行一次函数就GG

           //重复定时器: 每隔多少时间都执行一次函数无限循环除非代码写了关闭的条件

5_延迟定时器的用法

// 等待多少时间执行一次函数就GG
           //延时定时器的语法如下:
           /*
               1. setTimeout(function(){ 代码块 }, xx); xx毫秒

               2. setTimeout(aa, xx);    注意aa表示函数名不要加括号

                   function aa(){

                   }

           */



       // setTimeout(function(){
           // console.log("你好~~~");
       // },2000)


       // function aa(){
           // console.log("你好~~");
       // }


       // setTimeout(aa,3000);

6_重复定时器

//重复定时器: 每隔多少时间都执行一次函数
           //无限循环除非代码写了关闭的条件
           //重复定时器的语法如下:
           /*
               1. setInterval(function(){ 代码块 }, xx); xx毫秒

               2. setInterval(aa, xx);    注意aa表示函数名不要加括号

                   function aa(){

                   }

           */

       // setInterval(function(){
           // console.log("~~");
       // },1000);

       // setInterval(aa,1000);

       // function aa(){
           // console.log("~~~");
       // }



       //如何关闭定时器
       //1.需要先定义定时器的名字
       //2.加上关闭的条件
       //3.通过clearInterval(xxx); xxx表示定时器的名字