當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
javascript的内置对象以及BOM(定时器,location)
生活随笔
收集整理的這篇文章主要介紹了
javascript的内置对象以及BOM(定时器,location)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
javascript的內置對象以及BOM
內置對象
Number
代碼演示
Math
代碼演示
<script>//1. ceil(x) 向上取整document.write(Math.ceil(4.4) + "<br>"); // 5//2. floor(x) 向下取整document.write(Math.floor(4.4) + "<br>"); // 4//3. round(x) 把數四舍五入為最接近的整數document.write(Math.round(4.1) + "<br>"); // 4document.write(Math.round(4.6) + "<br>"); // 5//4. random() 隨機數,返回的是0.0-1.0之間范圍(含頭不含尾)document.write(Math.random() + "<br>"); // 隨機數//5. pow(x,y) 冪運算 x的y次方document.write(Math.pow(2,3) + "<br>"); // 8 </script>Date
Date的成員方法
代碼演示
String
String的成員方法
代碼演示
RegExp正則表達式
正則表達式:是一種對字符串進行匹配的規則。
代碼演示
<script>//1.驗證手機號//規則:第一位1,第二位358,第三到十一位必須是數字。總長度11let reg1 = /^[1][358][0-9]{9}$/;document.write(reg1.test("18688888888") + "<br>");//2.驗證用戶名//規則:字母、數字、下劃線組成??傞L度4~16let reg2 = /^[a-zA-Z_0-9]{4,16}$/;document.write(reg2.test("zhang_san123")); </script>Array
代碼演示
<script>let arr = [1,2,3,4,5];//1. push(元素) 添加元素到數組的末尾arr.push(6);document.write(arr + "<br>")//2. pop() 刪除數組末尾的元素arr.pop();document.write(arr + "<br>")//3. shift() 刪除數組最前面的元素arr.shift();document.write(arr + "<br>")//4. includes(元素) 判斷數組中是否包含指定的元素document.write(arr.includes(2)+"<br>")//5. reverse() 反轉數組元素arr.reverse();document.write(arr + "<br>")//6. sort() 對數組元素排序arr.sort();document.write(arr + "<br>")</script>JSON字符串
JSON 介紹
JSON(JavaScript Object Notation):是一種輕量級的數據交換格式。
它是基于 ECMAScript 規范的一個子集,采用完全獨立于編程語言的文本格式來存儲和表示數據。
簡潔和清晰的層次結構使得 JSON 成為理想的數據交換語言。易于人閱讀和編寫,同時也易于計算機解析和
生成,并有效的提升網絡傳輸效率。
JSON的常用方法
代碼演示
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JSON</title> </head> <body><!-- 1.JSON字符串是一種規范,在不同語言中都有對應的實現{"name": "zhangsan","age": 14}2JSON對象stringfy():可以將一個JSON對象轉成json字符串parse():將一個字符串轉為js對象josn|js對象|java map|java對象 他們之間的關系1.json字符串,kv的形式{"name": "zhangsan","age": 14,"hobby":["sprints","run","xijiao"]}2.json對象,多了方法部分{id: 22,name: "xiaofu",run:function(){console.log("run")}}3,java中的HashMap,也是Key-value形式{"key":"value"}4,java對象class person{Sring name = "xiaofu";Integer age = 18;}--></body> <script>//定義Json對象let run = {rundouble: "多人運動",runmanman: "慢慢運動",run: "運動"}//1.將json對象轉換為JSON格式的字符串let str = JSON.stringify(run);document.write(str+"<br>")//2.將JSON格式字符串解析成JS對象let run2 = JSON.parse(str);document.write("1:" + run2.rundouble + "<br>");document.write("2:" + run2.runmanman + "<br>");document.write("3:" + run2.run + "<br>"); </script> </html>BOM
BOM 介紹
BOM(Browser Object Model):瀏覽器對象模型。
將瀏覽器的各個組成部分封裝成不同的對象,方便我們進行操作。
Window窗口對象
定時器
唯一標識 setTimeout(功能,毫秒值):設置一次性定時器。
clearTimeout(標識):取消一次性定時器。
唯一標識 setInterval(功能,毫秒值):設置循環定時器。
clearInterval(標識):取消循環定時器。
加載事件
window.onload:在頁面加載完畢后觸發此事件的功能。
代碼演示
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>window窗口對象</title><script>//一、定時器function fun(){alert("該起床了!");}//設置一次性定時器//第一個參數是函數,第二個參數是多久后執行,毫秒單位// let d1 = setTimeout("fun()",3000);//取消一次性定時器// clearTimeout(d1);//設置循環定時器//可以做定時發送用戶行為數據到后端let d2 = setInterval(function(){alert("性感荷官在線發牌")},3000);//取消循環定時器// clearInterval(d2);// 加載事件,由于頁面是從上往下加載的,所以script標簽在body下面//就可以用window.onload就可以在頁面加載完成后執行某個方法window.onload = function(){let div = document.getElementById("div");//這樣就可以拿到下面的divalert(div);}</script> </head> <body><div id="div">dddd</div> </body> </html>location地址欄對象
Location 地址欄對象
href 屬性
就是瀏覽器的地址欄。我們可以通過為該屬性設置新的 URL,使瀏覽器讀取并顯示新的 URL 的內容。
代碼演示倒數多少時間跳過頁面
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>location地址欄對象</title><style>p{text-align: center;}span{color: red;}</style> </head> <body><p>注冊成功!<span id="time">5</span>秒之后自動跳轉到你喜歡的內容...</p> </body> <script>//1.定義方法。改變秒數,跳轉頁面let num = 5;//設置循環定時器 每一秒鐘執行一次tiaozhuan = setInterval(function(){//每一秒執行就減一次標記num--;//顯示在上面document.getElementById("time").innerHTML=num;//當秒數小于0的時候跳轉到指定的路徑if(num===0){location.href="http://www.baidu.com";//結束循環clearInterval(tiaozhuan);}},1000) </script> </html>總結
以上是生活随笔為你收集整理的javascript的内置对象以及BOM(定时器,location)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: javascript基本语法(输入输出语
- 下一篇: 浅谈Mybatis的一级缓存和二级缓存