你是否已經(jīng)初步掌握了html和css扛芽,但完全不知道從何入手JavaScript?
如果是积瞒,那么這篇文章一定會(huì)對(duì)你有所幫助川尖,這里總結(jié)了5條建議,幫助JavaScript初學(xué)者總結(jié)學(xué)習(xí)方法茫孔,提高學(xué)習(xí)效率空厌。
1. 多看視頻少看書
對(duì)初學(xué)者而言庐船,看書的效率是很低的,書上的內(nèi)容大多會(huì)展示核心代碼嘲更,而視頻為了演示效果筐钟,會(huì)展示全部代碼。初學(xué)者自學(xué)需要的是全部代碼赋朦,只看核心代碼必定會(huì)留下踩不完的坑篓冲。所以,初學(xué)者一定要多看視頻少看書宠哄。
2. 寫代碼的時(shí)間要多于看書和看視頻的時(shí)間
學(xué)習(xí)JavaScript壹将,一定要以寫為主,而不是以看為主毛嫉。學(xué)習(xí)時(shí)間的一半以上要留給寫代碼诽俯,剩下的時(shí)間用來(lái)看書和看視頻。幾乎所有初學(xué)者都有這個(gè)問(wèn)題承粤,就是拿一本書(或視頻)看3個(gè)小時(shí)但是一行代碼都沒(méi)寫暴区。這樣的結(jié)果就是,3個(gè)小時(shí)最多只利用了1個(gè)小時(shí)辛臊。太浪費(fèi)時(shí)間了仙粱。正確的學(xué)習(xí)方法是:看到一行代碼就寫一行代碼,就算理解彻舰,抄也得抄下來(lái)伐割,然后再去慢慢理解痘括。
3. 不可盲目追新技術(shù)
react囚痴,vue掸掏,angular,和你沒(méi)關(guān)系
node稠氮,express,koa缆蝉,和你沒(méi)關(guān)系
grunt澡腾,gulp凯亮,webpack辐真,和你沒(méi)關(guān)系
JavaScript這幾年變化很快,但是對(duì)于初學(xué)者來(lái)說(shuō)要摒棄浮躁的氣氛崖堤,靜下心來(lái)打好基礎(chǔ)侍咱。記住:自己是初學(xué)者密幔,玩的東西就是:JavaScript和jQuery楔脯,工具就用一個(gè)編輯器和一個(gè)瀏覽器,這些就夠了胯甩,別的不要碰.
4. jQuery還沒(méi)過(guò)時(shí)
有些朋友會(huì)說(shuō)jQuery已經(jīng)淘汰了昧廷,jQuery確實(shí)注定要被淘汰堪嫂,但是現(xiàn)在還差得遠(yuǎn)呢。
首先木柬,jquery對(duì)于初學(xué)者非常友好皆串,甚至不會(huì)js都可以學(xué)jQuery。并且目前市面上的網(wǎng)站和應(yīng)用眉枕,仍然是jQuery居多恶复,所以如果你是自學(xué),jQuery是必學(xué)的速挑。
5. 學(xué)習(xí)的順序
1.熟悉基本概念:變量谤牡,數(shù)據(jù)類型,函數(shù)姥宝,運(yùn)算符翅萤,表達(dá)式,對(duì)象(自定義對(duì)象腊满,內(nèi)置對(duì)象)套么。
這些基本概念一定要熟悉,熟悉到什么程度糜烹,看見一個(gè)概念违诗,立刻就能寫出示例代碼,就夠了疮蹦。
2.熟悉DOM:樹狀結(jié)構(gòu)诸迟,節(jié)點(diǎn)分類,添加節(jié)點(diǎn)愕乎,刪除節(jié)點(diǎn)阵苇,修改屬性,綁定事件感论。
3.熟悉jQuery:選擇器绅项、操作屬性和樣式、綁定事件比肄、節(jié)點(diǎn)操作快耿、動(dòng)畫方法。
4.用jQuery實(shí)現(xiàn)網(wǎng)頁(yè)上看到的頁(yè)面效果芳绩,比如輪播圖掀亥,菜單的各種效果,返回頂部等妥色。
5.試著用原生的js實(shí)現(xiàn)jQuery的常用方法搪花。比如addClass,removeClass,index這些。
上面5條如果沒(méi)能做到撮竿,就不要想著閉包吮便,原型繼承,ES6新特性這些東西了幢踏。
JavaScript 簡(jiǎn)介
JavaScript 是世界上最流行的編程語(yǔ)言髓需。
這門語(yǔ)言可用于 HTML 和 web,更可廣泛用于服務(wù)器惑折、PC授账、筆記本電腦、平板電腦和智能手機(jī)等設(shè)備惨驶。
JavaScript 是腳本語(yǔ)言
JavaScript 是一種輕量級(jí)的編程語(yǔ)言白热。
JavaScript 是可插入 HTML 頁(yè)面的編程代碼。
JavaScript 插入 HTML 頁(yè)面后粗卜,可由所有的現(xiàn)代瀏覽器執(zhí)行屋确。
JavaScript 很容易學(xué)習(xí)。
JavaScript:寫入 HTML 輸出
實(shí)例
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph</p>");
JavaScript:對(duì)事件作出反應(yīng)
實(shí)例
<button type="button" onclick="alert('Welcome!')">點(diǎn)擊這里</button>
alert() 函數(shù)在 JavaScript 中雖然并不常用续扔,但它對(duì)于代碼測(cè)試非常方便攻臀。
onclick 事件只是您即將在本教程中學(xué)到的眾多事件之一。
JavaScript:改變 HTML 內(nèi)容
使用 JavaScript 來(lái)處理 HTML 內(nèi)容是非常強(qiáng)大的功能纱昧。
實(shí)例
x=document.getElementById("demo")? //查找元素
x.innerHTML="Hello JavaScript";? ? //改變內(nèi)容
你會(huì)經(jīng)撑傩ィ看到 document.getElementByID("some id")。這個(gè)方法是 HTML DOM 中定義的识脆。
DOM(文檔對(duì)象模型)是用于訪問(wèn) HTML 元素的正式 W3C 標(biāo)準(zhǔn)设联。
JavaScript:改變 HTML 圖像
本例會(huì)動(dòng)態(tài)地改變 HTML <image>的來(lái)源 (src):
The Light bulb
點(diǎn)擊燈泡就可以打開或關(guān)閉這盞燈
JavaScript 能夠改變?nèi)我?HTML 元素的大多數(shù)屬性,而不僅僅是圖片灼捂。
JavaScript:改變 HTML 樣式
改變 HTML 元素的樣式离例,屬于改變 HTML 屬性的變種。
實(shí)例
x=document.getElementById("demo")? //找到元素
x.style.color="#ff0000";? ? ? ? ? //改變樣式
JavaScript:驗(yàn)證輸入
JavaScript 常用于驗(yàn)證用戶的輸入悉稠。
實(shí)例
ifisNaN(x) {alert("Not Numeric")};
JavaScript學(xué)習(xí)教程
JavaScript學(xué)習(xí)教程推薦小伙伴們看動(dòng)力節(jié)點(diǎn)老杜講解的web前端全套教程宫蛆,這個(gè)教程是將多年的編程經(jīng)驗(yàn)灌輸其中,典型的實(shí)踐派的猛,既適合初學(xué)者入門耀盗,也適合進(jìn)階(學(xué)習(xí)底層)。
主要講解了前端開發(fā)中的核心技術(shù)JavaScript卦尊,俗稱JS叛拷,視頻中講解了JavaScript核心語(yǔ)法、JavaScript內(nèi)置支持類猫牡、JavaScript調(diào)試胡诗、JavaScript DOM編程邓线、JavaScript BOM編程淌友、大量前端小案例煌恢、JavaScript事件處理、JavaScript對(duì)象震庭、繼承瑰抵、JSON等知識(shí)點(diǎn),該視頻可以開啟你的WEB前端之路器联。
學(xué)習(xí)目錄
JavaScript語(yǔ)言特點(diǎn)
JavaScript組成
JavaScript中BOM和DOM之間的關(guān)系及主流瀏覽器
JavaScript開發(fā)工具
JavaScript基礎(chǔ)語(yǔ)法
HTML嵌入JavaScript
JavaScript注釋
JavaScript標(biāo)識(shí)符
JavaScript保留關(guān)鍵字
JavaScript內(nèi)置類型
JavaScript變量
JavaScript函數(shù)
JavaScript數(shù)據(jù)類型
JavaScript的typeof運(yùn)算符
JavaScript創(chuàng)建對(duì)象
JavaScript Void
JavaScript中 null二汛、NaN和undefined的區(qū)別
JavaScript流程控制語(yǔ)句
JavaScript事件和事件句柄
JavaScript常用事件及事件句柄
JavaScript注冊(cè)事件的方式
JavaScript HTML DOM對(duì)象
JavaScript HTML DOM 對(duì)象
JavaScript BOM編程
JavaScript window對(duì)象
JavaScript history對(duì)象與location對(duì)象
JavaScript JSON
JavaScript JSON