Time of Update: 2017-01-19
本文執行個體講述了JavaScript類比重力狀態下拋物運動的方法。分享給大家供大家參考。具體分析如下:這段JavaScript代碼類比重力狀態下的拋物運動,可設定以下參數:橫向初速度、縱向初速度、重力加速度(如果這個加速度是一個隨時間變化的值,就能達到其他非勻加速運動的效果了)、動畫間隔時間等,相對專業<!doctype html><html><head><title>js拋物運動</title><meta
Time of Update: 2017-01-19
介紹裝飾者提供比繼承更有彈性的替代方案。 裝飾者用用於封裝同介面的對象,不僅允許你向方法添加行為,而且還可以將方法設定成原始對象調用(例如裝飾者的建構函式)。裝飾者用於通過重載方法的形式添加新功能,該模式可以在被裝飾者前面或者後面加上自己的行為以達到特定的目的。本文那麼裝飾者模式有什麼好處呢?前面說了,裝飾者是一種實現繼承的替代方案。當指令碼運行時,在子類中增加行為會影響原有類所有的執行個體,而裝飾者卻不然。取而代之的是它能給不同對象各自添加新行為。如下代碼所示:複製代碼
Time of Update: 2017-01-19
介紹與建立型模式類似,原廠模式建立對象(視為工廠裡的產品)時無需指定建立對象的具體類。原廠模式定義一個用於建立對象的介面,這個介面由子類決定執行個體化哪一個類。該模式使一個類的執行個體化延遲到了子類。而子類可以重寫介面方法以便建立的時候指定自己的物件類型。這個模式十分有用,尤其是建立對象的流程賦值的時候,比如依賴於很多設定檔案等。並且,你會經常在程式裡看到Factory 方法,用於讓子類類定義需要建立的物件類型。本文下面這個例子中,是應用了Factory
Time of Update: 2017-01-19
本文執行個體講述了JavaScript實現同步於本地時間的動態時間顯示方法。分享給大家供大家參考。具體分析如下:動態顯示時間的例子非常簡單,瞭解JavaScript之後就是幾行的代碼便能夠完成的事情,但是對於一些未接觸過JavaScript的人來說,幾乎很大工程的樣子,然後在網上苦苦尋覓代碼,之後在茫茫的html代碼中尋求不到,最終得不到要領。一、基本目標實現一個隨同用戶端(瀏覽者機器上的)時間的網頁文本時間,使用最短的代碼。二、製作過程複製代碼 代碼如下:<!DOCTYPE html
Time of Update: 2017-01-19
本文執行個體講述了觸屏中的JavaScript事件。分享給大家供大家參考。具體分析如下:一、觸摸事件ontouchstartontouchmoveontouchendontouchcancel目前移動端瀏覽器均支援這4個觸摸事件,包括IE。由於觸屏也支援MouseEvent,因此他們的順序是需要注意的:touchstart → mouseover → mousemove → mousedown → mouseup → click1執行個體如下:/*** onTouchEvent*/var
Time of Update: 2017-01-19
本文執行個體講述了JavaScript判斷使用者是否對錶單進行了修改的方法。分享給大家供大家參考。具體分析如下:這段JS代碼可以判斷出使用者是否對錶單內容進行了修改,如果修改了表單,並退出瀏覽器,則會提醒使用者是否要儲存表單的內容,是非常有用的代碼。function formIsDirty(form) { for (var i = 0; i < form.elements.length; i++) { var element = form.elements[i]; var type =
Time of Update: 2017-01-19
介紹 使用過JavaScript架構(如AngularJS, Backbone
Time of Update: 2017-01-19
好吧,也沒有背景說明,沒有高深技能,純粹無聊,想找出10000內的所有質數。那麼就開始了:function zhishu(num) { if (num == 1) { return false; } if (num == 2) { return true; } for (var i = 2; i <= Math.sqrt(num); i++) { if (num % i == 0) { return false; } } return
Time of Update: 2017-01-19
本文執行個體講述了JavaScript使用function定義對象並調用的方法。分享給大家供大家參考。具體分析如下:JS中你可以通過函數的方式定義對象,下面的JS代碼定義了一個movie的函數對象,然後通過new的方法聲明對象,調用起來也非常簡單。<script type="text/javascript">function movie(title, director) { this.title = title; this.director = director; }var
Time of Update: 2017-01-19
前端工程師都知道 JavaScript 有基本的異常處理能力。我們可以 throw new Error(),瀏覽器也會在我們調用 API 出錯時拋出異常。但估計絕大多數前端工程師都沒考慮過收集這些異常資訊反正只要 JavaScript 出錯後重新整理不複現,那使用者就可以通過重新整理解決問題,瀏覽器不會崩潰,當沒有發生過好了。這種假設在 Single Page App 流行之前還是成立的。現在的 Single Page App
Time of Update: 2017-01-19
為了達到平穩退化,向後相容,標記分離的思想,每次寫js代碼時做的第一件事應該是必要的測試和檢查工作:在js檔案裡首先添加以下代碼進行檢查:window.onload = function(){if(!document.getElementsByTagName) return false;if(!document.getElementById) return false;if(!document.getElementsByClassName) return
Time of Update: 2017-01-19
本文執行個體講述了JavaScript自訂數組排序方法。分享給大家供大家參考。具體分析如下:Array中有內建的排序功能,這個使用起來比較方便,我們有一點必須清楚,就是排序的依據,如果sort不傳入參數的話,那就是按照字元編碼(Unicode編碼)的順序排序。var a=["3","2","1"]; console.log(a[0].charCodeAt(0)); // 51 console.log(a[1].charCodeAt(0)); // 50
Time of Update: 2017-01-19
本文執行個體講述了javascript表格隔行變色加滑鼠移入移出及點擊效果的方法。分享給大家供大家參考。具體分析如下:表格隔行變色,也是一個提高使用者體驗的js效果。效果實現:表格奇偶行的顏色不一樣。這樣可以防止使用者看資料時串列。滑鼠移入某行時變顏色,移出再變回來。這樣可以讓使用者清楚的知道自己正在看哪一行。表格點擊變色。便於使用者選中自己想保留的項。 說明:i%2 每個數和2模數的值,只有0和1兩種,這樣就可以實現隔行變色的效果tables_li[i].onoff =
Time of Update: 2017-01-19
介紹本文介紹的四種代碼複用模式都是最佳實務,推薦大家在編程的過程中使用。模式1:原型繼承原型繼承是讓父物件作為子物件的原型,從而達到繼承的目的:複製代碼 代碼如下:function object(o) { function F() { } F.prototype = o; return new F();}// 要繼承的父物件var parent = {&
Time of Update: 2017-01-19
本文執行個體講述了JavaScript替換當前頁面的方法。分享給大家供大家參考。具體如下:下面的JS代碼可以替換當前頁面為指定的URL<!DOCTYPE html><html><head><script>function replaceDoc(){window.location.replace("http://www.jb51.net")}</script></head><body><input type=
Time of Update: 2017-01-19
代碼很簡單,實現的功能卻很實用,直接奉上代碼CSS:複製代碼 代碼如下:<meta charset="utf-8" /><title>Pull to Refresh</title><meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;"
Time of Update: 2017-01-19
javascript文法靈活,同一個功能有五六種實現方式並不罕見,然後再加上有些反人類的原型繼承和非同步特性,就更讓人一頭霧水了。我經常搞不清楚call,apply之間的區別,今天就記錄一下,以免再忘了。在javascript中,方法可以通過以下幾種方式執行:1.func(),這是最直接最常見的調用方式,也符合一般人的思維邏輯,但是在某些情況下有一些不足,下面會解釋。2.(function(arg){})(window),匿名方法調用,在構造命名空間時比較有用,後面的括弧中的參數與匿名方法中的入
Time of Update: 2017-01-19
示範圖styles.css*{ /*清空所有元素預設的外邊距和內邊距*/ } .photo_wall{background:url(bg.jpg); /*定義照片牆的預設背景*/background-size:cover; /*使照片牆的背景填充照片牆*/width:1200px; /*設定照片牆的寬高*/height:500px;margin:40px auto; /*設定照片牆的外邊距*/display:-webkit-box;
Time of Update: 2017-01-19
產生跨域問題的原因跨域問題是瀏覽器同源策略限制,當前網域名稱的js只能讀取同域下的視窗屬性。跨域問題產生的情境當要在在頁面中使用js擷取其他網站的資料時,就會產生跨域問題,比如在網站中使用ajax請求其他網站的天氣、快遞或者其他資料介面時以及hybrid app中請求資料,瀏覽器就會提示以下錯誤。這種情境下就要解決js的跨域問題。XMLHttpRequest cannot load http://你請求的網域名稱. No 'Access-Control-Allow-Origin' header
Time of Update: 2017-01-19
calleecallee是對象的一個屬性,該屬性是一個指標,指向參數arguments對象的函數首先我們來寫個階成函數:function chen(x){if (x<=1) {return 1;} else{return x*chen(x-1);};};從這個函數中可以看出來,用到了遞迴函式,要是改變了函數名,裡面的函數名也要隨著改變,這樣很不方便所以我們用callee來試試function chen(x){if (x<=1) {return 1;}else{return