Time of Update: 2017-01-19
最後成品代碼寫的倉促,沒有容錯,封裝也不合理,只實現了核心部分,其他部分,喜歡添加的舊添加吧。 下面就開始我的教程(姑且算是教程吧,草草寫點吧,時間太少,大家原諒) 以最高難度遊戲層級作的分析。 第一步,大體分析 看看遊戲主要包含哪些元素,發現3部分,一些成對的圖片塊,一個能盛圖片塊的方盤容器,一個能串連兩個圖塊的線。 第二步,元素分析 圖塊:圖塊一共有32種不同的圖案,每種圖案4張,圖塊會相應滑鼠的點擊,圖塊會消失,圖塊有高度和寬度。 方盤:能承載128個圖塊,2維承載,橫向16塊,縱向8塊,
Time of Update: 2017-01-19
前面我們自己寫了一個小小的關於js動畫的外掛程式,下面我們來使用之前的架構來完成我們想要的動畫效果。我們經常在淘寶網中看到,滑鼠經過某一圖片時,該圖片有從上滾出而又從下滾入的效果,那麼那種效果是如何?的呢?首先我們我們完成該效果的html和css代碼,代碼如下:html部分代碼:<div id="move"> <a href="#"><i><img
Time of Update: 2017-01-19
如果你想使一個元素在全螢幕模式下展現 (比如說 <video>),你可以調用該元素的 requestFullscreen() 方法;這個方法在 Gecko 中的實現是 element.mozRequestFullScreen(),在 WebKit 中為 element.webkitRequestFullscreen()。比如一個執行個體:var elem = document.getElementById("myvideo");if (elem.requestFullscreen)
Time of Update: 2017-01-19
在JavaScript中有三種聲明變數的方式:var、let、const。下文給大家介紹js中三種定義變數的方式const, var, let的區別。1.const定義的變數不可以修改,而且必須初始化。const b = 2;//正確// const b;//錯誤,必須初始化 console.log('函數外const定義b:' + b);//有輸出值// b = 5;// console.log('函數外修改const定義b:' +
Time of Update: 2017-01-19
本文給大家分享一段js代碼實現自動切換圖片的執行個體代碼,代碼如下所示:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title> new
Time of Update: 2017-01-19
在前面的文章中講了簡單的Javascript動畫效果,這篇文章主要介紹我在改變之前代碼時發現的一些問題及解決方案。在前面的多物體寬度變化的例子中,我們給其增加代碼:border: 4px solid #000;我們發現,滑鼠移出後,寬度不是200px了,那麼究竟是如何產生這種情況的呢?下面我們通過一個新的例子來分析html代碼:<div id="div1">hello</div>css代碼:body,div{ margin: 0px; padding: 0px;
Time of Update: 2017-01-19
前面我們介紹了Javascript的回到頂部效果,今天呢,我們對Javascript動畫做進一步的研究。在這篇博文中我們只介紹簡單的勻速運動、簡單的緩衝運動和簡單的多物體運動後面我們還會介紹任意值變化的運動、鏈式運動、同時運動,同時我們還會簡單的封裝一個運動外掛程式並且還會將Javascript方法和jquery方法進行比較。1、簡單的勻速運動下面我們介紹一個demo,滑鼠移入,動畫向右移動(即隱藏部分顯示);滑鼠離開,動畫向左運動(繼續隱藏)整個過程都是勻速的。有了前面回到頂部效果作為基礎,這
Time of Update: 2017-01-19
接觸jquery也有一段時間了,今天剛好利用輪播圖來練練手。博文的前面會介紹一個簡單用jquery做輪播圖的例子,中間會插入一些關於輪播圖更多的思考,在後面會用Javascript的方法來寫一個輪播圖,最後則是關於jquery和Javascript的比較。jquery做輪播圖的例子:html部分代碼:<!DOCTYPE html><html> <head> <meta charset="UTF-8">
Time of Update: 2017-01-19
做項目時遇到一個問題,判斷一個對象是否為空白對象,發現這樣判斷可以,上代碼:1. 代碼1:var a = {};if(!a){ console.log(1);}else if(a == null) { console.log(2);} else { console.log(3);}結果為:32. 代碼2:var b = {};if(b == {}){ console.log(4);}if(b == '{}') { console.log(5);} if(typeof(b) == 'object'
Time of Update: 2017-01-19
關於函數在Javascript中函數實際上就是一個對象,具有參考型別的特徵,所以你可以將函數直接傳遞給變數,這個變數將表示指向函數“對象"的指標,例如:function test(message){ alert(message); } var f = test; f('hello world');你也可以直接將函數申明賦值給變數:var f = function(message){ alert(message); };f('hello
Time of Update: 2017-01-19
本文執行個體講述了JavaScript基於對象去除數組重複項的方法。分享給大家供大家參考,具體如下:JavaScript中,去除數組重複項是一個很常用的函數,而且在面試中也很經常被提問到.很多人在面對這個問題的時候,一般都是採用多層for迴圈來一步一步的比較,然後刪除,那樣不僅代碼量很多,而且效能也很不好.在JavaScript的對象中,有一個特性就是key永遠不重複,如果重複後面的就會覆蓋前面的.三個步驟:1# 把數群組轉換成js對象2# 把數組值變成js對象中的key3#
Time of Update: 2017-01-19
你知道JavaScript中的每條語句、甚至運算式都有一個結果值嗎?當你在瀏覽器中測試代碼時,經常會在控制台的輸出結果的最後面多出一條,大部分為undefined,這個undefined就是一個結果值。ES7的do運算式先從ES7的一個提案說起吧:do運算式do{...}(注意:不是do{...}while();中的do)var a,b,c = 3;a = do { if (true) { b = c*3; }};a; //9
Time of Update: 2017-01-19
第一列 第二列 第3列 第一列 第二列 第3列 [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
Time of Update: 2017-01-19
這個是沒有種cookie的,記錄給自已。 複製代碼 代碼如下:<link href="001.css" id="cssfile" rel="stylesheet" type="text/css" /> <script> function changeStyle(name){ //alert(name);
Time of Update: 2017-01-19
屬性: 1Attributes 儲存節點的屬性列表(唯讀) 2childNodes 儲存節點的子節點列表(唯讀) 3dataType 返回此節點的資料類型 4Definition 以DTD或XML模式給出的節點的定義(唯讀) 5Doctype 指定文件類型節點(唯讀) 6documentElement 返迴文檔的根項目(可讀寫) 7firstChild 返回當前節點的第一個子節點(唯讀) 8Implementation 返回XMLDOMImplementation對象 9lastChild
Time of Update: 2017-01-19
最近因為做了一個項目,其中涉及到了js私人方法,這個概念在其語言裡面是很常見的,很多語言都有private這個關鍵字,只要在一個類的前面加上private就表示申明了一個私人方法,但是javascript在物件導向的方面沒有那麼多的特徵,他沒有專門的private關鍵字,。要做到這一點就必須使用js自己的一些特性來變相的完成。首先javascript裡面有一個進階特性叫閉包,簡單的說js的閉包可以理解成是一種現象或者特性,一般出現在兩個函數嵌套的情況下,看例子:function a(){var
Time of Update: 2017-01-19
前言在做javascript開發的時候,經常會遇到數組元素重複的問題,而javascript Array又沒有直接提供方法解決此問題,還需要自己去實現。這篇文章總結了Javascript中數組各種去重的方法,下面來一起看看。方法一 利用對象屬性不重複的特性Array.prototype.distinct = function (){ var arr = this, i, obj = {}, result = [], len = arr.length; for(i =
Time of Update: 2017-01-19
在某些程式中,你可能需要將數組組合成字串,比如將var aArray = ["a","b","c"];處理成字串的形式。這裡有兩種方法,當然如果你有更好的辦法,別忘記留言給我。 第一種: aArray.toString() 第二種: aArray + "" 示範: js數組組合成字串 [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
Time of Update: 2017-01-19
相對於很多其他的物件導向語言來說,this代表的就是當前對象。例如Java中的this就是編譯期間確定的。而在 JavaScript 中,this 是動態綁定,或稱為運行期綁定的Java中的this在以下代碼中。this代表的就是p對象。public class Test { public static void main(String[] args) {Person p = new Person("zmt",30);System.out.println(p.name);}}class
Time of Update: 2017-01-19
大家都有用過各種類型的瀏覽器,每種瀏覽器都有自己的特色,本人拙見,在我用過的瀏覽器當中,我是最喜歡Chrome的,因為它對於調試指令碼及前端設計調試都有它比其它瀏覽器有過之而無不及的地方。可能大家對console.log會有一定的瞭解,心裡難免會想調試的時候用alert不就行了,幹嘛還要用console.log這麼一長串的字串來替代alert輸出資訊呢,下面我就介紹一些調試的入門技巧,讓你愛上console.log先的簡單介紹一下chrome的控制台,開啟chrome瀏覽器,按f12就可以輕鬆的