九阴真经 第二层 第9天
今天總結：
button是雙標簽 ,所以要更改它的值 就要用innerHTML 改。而不是values （ asda）
setInterval(fun,1000); 按道理是1秒執行一次fun()，但實際上是：它自己這個1秒就不管了 必須等fun()里面走完
function fun(){
//花費時間2秒
}
setTimeOut(fun,1000); 這個是花2秒執行完fun()后，再等1秒執行 fun（）
function fun(){
//花費時間2秒
}
假如只用setTimeOut 來完成網頁上的倒計時返回首頁 。一般需要用上遞歸調用
setInterva(fun,10000) //先等10秒先再執行fun() 一直循環
定時器是單線程的
setTimeOut(fun,0); 不代表立即執行，只是代表插入隊列
img{vertical-align:top;} //取消圖片底部3像素距離
轉動的時鐘
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title><style>.clock {width: 600px;height: 600px;margin: 50px auto;background: url(images/clock.jpg) 0 0 no-repeat;position: relative;}div {width: 100%;height: 100%;position: absolute;top: 0;left: 0;}#hour {background: url(images/hour.png) no-repeat center center;}#minute {background: url(images/minute.png) no-repeat center center;}#second {background: url(images/second.png) no-repeat center center;}</style> </head> <body> <div class="clock"><div id="hour"></div><div id="minute"></div><div id="second"></div> </div> </body> </html> <script>// getHours() 返回 Date 對象的小時 (0 ~ 23)。 1 3// getMinutes() 返回 Date 對象的分鐘 (0 ~ 59)。 1 3// getSeconds() 返回 Date 對象的秒數 (0 ~ 59)。 1 3// getMilliseconds() 返回 Date 對象的毫秒(0 ~ 999)。 1 4// getTime() 返回 1970 年 1 月 1 日至今的毫秒數。// / 除 x=5/2 x=2.5// % 求余數 (保留整數) x=5%2 x=1function $(obj){return document.getElementById(obj);}setInterval(function () {var date = new Date(); //假設現在是電腦時間是 8:42var ms = date.getMilliseconds(); // console.log(ms / 1000); //0.153 (注意：并不像java那樣，是3位數除4位數等于0)var s = date.getSeconds() + ms / 1000; //57.487 // console.log(seconds); //58.153 秒var m = date.getMinutes()+s/60; // console.log(seconds/60); //0.9692166666666666 // console.log(minutes); // 42.472683333333336var h = date.getHours()%12+m/60; //因為時鐘是12個小時console.log(h + ":" + m + ":" + s + ":" + ms); // 輸出 8.844000833333334 : 50.64005 : 38.403 :403$("second").style.webkitTransform="rotate("+ s*6 +"deg)";$("minute").style.webkitTransform="rotate("+ m*6 +"deg)";$("hour").style.webkitTransform="rotate("+ h*30 +"deg)";}, 1);</script>this
this 指向的是 事件的調用者 ，或者是函數的使用者。
一般情況下，我們喜歡 var that = this;
深層次的看待定時器區別
1.setInterval是排隊執行的
假如 間隔時間是1秒， 而執行的程序的時間是2秒 上次還沒執行完的代碼會排隊, 上一次執行完下一次的就立即執行, 這樣實際執行的間隔時間為2秒
2.setTimeout延遲時間為1秒執行, 要執行的代碼需要2秒來執行,那這段代碼上一次與下一次的執行時間為3秒.
5秒后返回首頁之常用方法
發送驗證碼
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title> </head> <body> <input type="text"> <button id="btn">發送短信驗證碼</button> </body> </html> <script> // （重要） this 指向的是 事件的調用者 ，或者是函數的使用者var btn = document.getElementById("btn");var count = 5;var timer = null; //定時器的名字btn.onclick = function () {this.disabled= true; // alert(this);//object HTMLButtonElementvar that = this; //把當前btn對象 給thattimer = window.setInterval(sendTextMessage, 1000);function sendTextMessage() {count--; // alert(this); //object windowif(count>=0){that.innerHTML= "還剩"+count+"秒";}else{that.innerHTML="重新發送";that.disabled= false;count = 5;clearInterval(timer);}}} //小奇怪： 點了第一次后，是正常5 4 3 2 1 0//但第一次完后，再點一次重新發送，它是顯示 4 3 2 1 0 // 還有種 情況。 你多點幾下 按鈕，它計數會加快：（答案：你點一次按鈕，它就開一個定時器。所以它清除定時器，沒你點一次快）//解決辦法：點 按鈕時，先清除原來的定時器. </script>arguments 對象
function fn(a,b,c) { console.log(a+b+c); alert(arguments.length;)}
fn(1,3,4,6);
arguments.length; 返回的是 實參的個數。
但是這個對象有講究，他只在正在使用的函數內使用。
arguments.callee;
返回的是正在執行的函數。 也是在函數體內使用。 在使用函數遞歸調用時推薦使用arguments.callee代替函數名本身。
function fn() { console.log(arguments.callee); }
這個callee 就是 ： function fn() { console.log(arguments.callee); }
運算符順序
1 ()
2 !、-、++、-- (-10) 負號 正號
3 、/、%
4 +、- 10-5
5 <、<=、<、>=
6 ==、!=、===、!==、
7 &&
8 ||
9?:
10 =、+=、-=、=、/=、%= 賦值
幾個面試題
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title> </head> <body></body> </html> <script> // （重要）只要有0的，都為假。運算符順序 先&&后|| // && 如果a為假，則返回a // 如果a為真，則返回bconsole.log(0&&1); //0console.log(1&&0); //0console.log(1&&10); //10// || 如果a為假 則返回b // 如果a為真 則返回aconsole.log(0||1);//1console.log(1||0);//1console.log(1||5);//1console.log(5||1);//5console.log(1&&2&&3);//3console.log(0&&1&&2);//0console.log(1&&0&&2); //0// 0 |(或) 任何數都得另外一個人console.log(0||1||2); //1console.log(1||0||3); //1console.log(3&&0||2); //2console.log(3||0&&2); //3console.log(0||2&&3); //3</script>字符串對象常用方法
轉換為字符串
- “” 2+ “” = “2” 2+”ab” = “2ab”
var txt = 10;
txt.toString(2) 二進制 1010
獲取字符位置方法
charAt，獲取相應位置字符（參數： 字符位置）
charCodeAt獲取相應位置字符unicode編碼（參數： 字符位置）
var txt = “abcedf”;
比如， txt.charAt(4); 索引號一定是從0開始 返回的結果是 d
我們根據我們輸入的 位數 返回相應的 字符 。
unicode編碼 是我們字符的字符的唯一表示
===============================
轉載于:https://www.cnblogs.com/czy16/p/8437095.html
總結
以上是生活随笔為你收集整理的九阴真经 第二层 第9天的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： C#：导入Excel通用类（CSV格式）
- 下一篇： 大数据统计分析平台之一、Kafka单机搭