js輪播圖菜鳥(niǎo)教程 新手學(xué)習(xí)js是直接學(xué)vue,還是從jquery開(kāi)始學(xué)?
新手學(xué)習(xí)js是直接學(xué)vue,還是從jquery開(kāi)始學(xué)?我不想寫。作為一個(gè)10歲的韋伯,我想在這里說(shuō)幾句話!Web技術(shù)變化太快,但是jQuery至今還沒(méi)有被淘汰。想想為什么!此外,Vue和其他新框架確實(shí)
新手學(xué)習(xí)js是直接學(xué)vue,還是從jquery開(kāi)始學(xué)?
我不想寫。作為一個(gè)10歲的韋伯,我想在這里說(shuō)幾句話!Web技術(shù)變化太快,但是jQuery至今還沒(méi)有被淘汰。想想為什么!此外,Vue和其他新框架確實(shí)簡(jiǎn)化了編程的復(fù)雜性,這是他的優(yōu)勢(shì)。然而,Vue能做什么,jQuery能做什么,jQuery能做什么,Vue可能做不到。同樣,jQuery能做什么,JS能做什么,JS能做什么,jQuery可能做不到!在采訪中,許多人說(shuō)他們精通Vue。而精通意味著精通Vue的源代碼和思想。一個(gè)問(wèn)題,十個(gè)不知道!只能說(shuō)威爾·維!JS,看起來(lái)很簡(jiǎn)單,不是五六年,不能說(shuō)精通JS。個(gè)人建議,先學(xué)習(xí)JS的基礎(chǔ)知識(shí),然后jQuery和Vue,數(shù)據(jù)模型驅(qū)動(dòng)程序要學(xué)習(xí),DOM操作要能夠。同時(shí),回去學(xué)JS,不斷重復(fù)。不要局限于一種方式,過(guò)時(shí)的是框架,而不是語(yǔ)言
如何用JS實(shí)現(xiàn)輪播圖效果?
首先,創(chuàng)建一個(gè)HTML文件。在下圖中,我創(chuàng)建了一個(gè)HTML5文件,因此看起來(lái)非常簡(jiǎn)單。
然后在HTML的主要部分添加一個(gè)div標(biāo)簽,然后在標(biāo)簽下面添加一個(gè)img標(biāo)簽,并設(shè)置img的寬度和高度。
然后我們可以在HTML的header下添加CSS樣式的代碼來(lái)控制Div的顯示效果
接下來(lái),在body標(biāo)簽中添加JS event onload,即在加載頁(yè)面時(shí),調(diào)用onload值對(duì)應(yīng)的方法。在圖中,它是init()。
為img添加一個(gè)ID屬性,這樣我們就可以通過(guò)getelementbyid(“ID value”)獲得元素標(biāo)簽。
然后通過(guò)<script>標(biāo)記,添加如下圖所示的代碼以完成carousel功能。其中
setinterval(code,time)//需要兩個(gè)參數(shù),其中code是要執(zhí)行的方法或代碼字符串,time是時(shí)間間隔(毫秒,1000是1秒,可以根據(jù)需要調(diào)整)。
if語(yǔ)句中I的值與圖片的編號(hào)和命名有關(guān)。
完成后,您可以通過(guò)瀏覽器運(yùn)行看到效果,它會(huì)自動(dòng)切換圖片,即旋轉(zhuǎn)木馬圖片。
(由于上傳網(wǎng)站的原因,GIF圖表可能會(huì)有所不同。例如,當(dāng)我預(yù)覽圖像時(shí),它會(huì)變大,但實(shí)際上,當(dāng)我運(yùn)行它時(shí),以及當(dāng)我在本地查看GIF圖像時(shí),它的大小將相同。)