在網頁開發中，大部分的下拉式功能表都是一行一項並且上下對齊，這樣雖然很好但是缺乏階層感，客戶不知道各個選項之間的關係，因此有的時候我們需要在下拉式功能表中以樹形結構展示下拉項，給客戶更好的體驗。比如：假設資料庫中有張表存放了中國省市資訊，如下所示：這張表是符合樹形結構特徵的，它的樹形結構如右圖所示，相信很多表都有這樣的特徵，這種結構的表以下拉樹展示最好不過了，使用者可以直接看出選項之間的關係。javascript實現樹形結構應該有很多種方法，我也不知道那些方法都是如何?的，也不想從網上下載現成的
/* DataParser singleton, converts character delimited strings into arrays. */ /* Now using true private methods. */ GiantCorp.DataParser = (function() { // 私人屬性 var whitespaceRegex = /\s+/; // 私人方法 function
一直在使用js編寫自以為是物件導向的方法，遇到一個問題，就是定義一個方法，如下： function ListCommon2(first,second,third) { this.First=function () { alert("first do"+first); } } ListCommon2.do1=function(first) { // this.First(); alert("first
在物件導向編寫js指令碼時，定義執行個體方法主要有兩種如下：function ListCommon2(afirst) { var first=afirst; this.do1=function () { alert("first do"+first); } } ListCommon2.prototype.do2=function() {
都知道js變數有範圍的概念，因此可以使用這個特性定義私人欄位，私人欄位的初始化主要是通過建構函式。例如如下定義了一個唯讀欄位firstfunction ListCommon2(afirst) { var first=afirst; this.GetFirst=function ()//定義了一個訪問讀取欄位的特權方法 { return first; } }
前端碼農們在做項目中時候，必定不可少的需要做到輪播效果。但是有些特殊的需求，比如：需要做到第一個容器內容輪播滾動之後，第二個容器內部再輪播滾動，再第三個容器內容輪播滾動。這時候我的一開始的思路是：每個容器都看成一個單獨的輪播效果，既然是依次的滾動就設定滾動開始時間差,三個setTimeout()分別延遲差。HTML 代碼：<div id="warp"> <div class="items">
/** 判斷是否碰撞 * @param obj 原對象 * @param dobj 目標對象 */function impact(obj, dobj) { var o = { x: getDefaultStyle(obj, 'left'), y: getDefaultStyle(obj, 'top'), w: getDefaultStyle(obj, 'width'), h: getDefaultStyle(
javascript 的 var 作用是聲明變數。一般情況下不寫都不會出錯，但有些情況如果不寫，會有不同的結果。<div id="a"></div> <script type="text/javascript"> a = 1; alert(a); </script>上面這個例子在FF Chrome執行不會有問題，能輸出1。但在IE運行呢？ 報錯：”object doesn’t support
遊戲介紹:這是一個翻牌配對遊戲，共十關。1.遊戲隨機從42張牌中抽取9張進行遊戲，每組為2張相同的牌，共18張牌。2.連續翻到兩張相同的為勝利，當9組全部翻到則過關。如不是翻到連續兩張相同的，則需要重新翻。3.遊戲共有10關，在規定時間內通過為挑戰成功。4.如果某關在規定時間內沒有通過，則會從當前關繼續遊戲。5.遊戲中的卡牌圖片與音樂均為大宇公司所有。6.需要支援html5的瀏覽器，chrome與firefox效果最好。遊戲圖片：源碼下載地址：http://download.csdn.net/d
遊戲介紹:業餘時間寫的一個飛行射擊遊戲，縱向，共六關。遊戲需求:1.戰機可發射子彈，子彈可通過擷取道具升級。2.戰機可放bomb，可擷取道具增加數量。3.戰機可蓄力攻擊。4.道具有三種，分別是升級子彈，增加bomb數量，增加戰機數量。5.每關音樂不同。6.戰機被擊落後再進入戰場，有保護狀態。7.敵機AI設計。遊戲圖片:源檔案下載地址:
大家也需對windows 8上可以用javascript開發Metro 介面的netive app有所瞭解。其實osx上也提供了類似的功能， OS X v10.4
在mobile上使用iscroll的話，預設啟用touch事件綁定，由於touch事件非常靈敏。如果手指觸摸到串連的話，滑動換沒完成瀏覽器就會預設開啟串連操作。這樣就不能完成正常滾動。iscroll的設計思想是在一個頁面完成操作，沒有新開標籤開啟頁面的方式，那麼既要用iscroll又要實現新頁面開啟的功能怎麼辦能？time.qq.com的處理方式是，整個頁面都沒有使用a標籤，完全用指令碼操作介面的轉換。http://h5.m.sohu.com/ 的處理方式是使用了a
大家都有過用-min.js開發的經曆，但這樣的指令碼調試非常頭疼。如果使用為壓縮版的，上線前又要去壓縮，sourcemap的出現完美解決了這一問題。即便是chrome提供了格式化代碼但閱讀壓縮後的代碼環視很吃力的。以angularjs為例，談談sourcemap的使用。我的檔案夾結構如下：由於google經常被牆所以建議把angular.js angular.min.js
因為我們手動互動某一行為，首先是讓它的某些屬性發生變化，其次是讓它觸發某事件。想明白這一點就簡單了。讓屬性發生變化，當然是改動其固有屬性，因此 setAttribute(aaa,bbb)便出局了，因此它是用來設定自訂屬性（IE678另談，那是怪胎）。想觸發事件，我們可以用fireEvent或dispathEvent，阿狸從雅虎的YUI搞了一個event-simulate，想得更加周全，大家想深入可以參考一下。下面就是我的成果了：<!DOCTYPE html><html>
今天開發中遇到一個問題：如何替換一段HTML字串中包含的所有img標籤的src值？開始想到的解決方案是：content.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/gi, function (match) { console.log(match);});輸出結果是：<img
在豆瓣網上添加自己的標籤是一種常見的效果，今天也就做了一個簡單的demo。由於時間的問題 我不多原理，大家可以試著操作幾遍就能明白其中的原理了。JSFiddle的效果如下： 點擊我看看效果！依賴於HTML結構如下：<div class="j-container"> <div class="mb-meta"> <div class="btn mb-add-button">Add</div>
現如今，雖然多數的web應用都使用了大量的JavaScript，但如何保持用戶端功能的專註性、健壯性和可維護性依然是一個很大的挑戰。儘管其它程式設計語言和系統都已經將關注分離和DRY這樣的基本原則視為理所當然的宗旨，但往往在進行瀏覽器端應用開發的時候，這些原則就被忽視了。造成這一現象的部分原因是JavaScript語言本身就在不斷掙紮的曆史，在很長的一段時間內，它都難以獲得開發人員的認真關注和對待。而更重要的原因或許是源於服務端與用戶端的差異造成的。雖然在這方面已經有大量的架構風格方面的概念，例
第一次接觸這個問題還是在我剛開始學js的時候，當時就是一頭霧水，時隔一年多了，突然又想起了這個問題，在這個春氣盎然的周末，我就坐下來研究下並把結果和大家分享下；先看代碼：demo.html<!DOCTYPE HTML><html><head><meta charset="utf-8" /><title>閉包迴圈問題</title><style
今天整理自己的檔案夾時，發現了曾經面試騰訊實習生時的被問掛了的面試題，我將它們整理好了供大家借鑒。當時要求的是手寫代碼。汗啊，我那時弱爆了！1，將給定數群組轉換為一個隨機數組Array.prototype.shuffle=function(){ var resultArr=[]; var len=this.length; while(len){ var _index=parseInt(Math.random()*len);
在實際的項目中，我們通常都是用建構函式來建立一個對象，再將一些常用的方法添加到其原型對象上。最後要麼直接執行個體化該對象，要麼將它作為父類，再申明一個對象，繼承該父類。而在繼承的時候有兩種常用方式，今天我們就來稍作探討//父類 function Person(name){ this.name = name;}; // 子類 function Student(sex){ Person.apply(this,arguments); //繼承父類的建構函式 this.sex=sex;
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
