多年來(lái)，Web 上的交互性意味著使用 JavaScript。無(wú)論是 vanilla JS 還是 jQuery 或 React 等庫(kù)，該語(yǔ)言一直是構(gòu)建用戶可以與之交互的元素的門戶。
 
雖然 JavaScript 在這些場(chǎng)景中仍然非常有用，但它不再是必需的。如今，結(jié)合使用 HTML 和 CSS 可以完成很多工作。每個(gè)標(biāo)準(zhǔn)都經(jīng)過(guò)擴(kuò)展以包含曾經(jīng)專為其他語(yǔ)言所獨(dú)有的功能。
 
這種演變帶來(lái)了幾個(gè)好處。首先，它大大降低了構(gòu)建這些元素的復(fù)雜性。您無(wú)需加載外部庫(kù)或擔(dān)心掌握 JavaScript 語(yǔ)法。反過(guò)來(lái)，這也可以提高性能并確保瀏覽器兼容性。
 
長(zhǎng)期以來(lái)，手風(fēng)琴都是在 JavaScript 的幫助下構(gòu)建的。jQuery UI 庫(kù)甚至包含該元素。這簡(jiǎn)化了創(chuàng)建和樣式化過(guò)程，但它不是最高性能的代碼。
 
尤其是當(dāng)您考慮到 HTML 現(xiàn)在內(nèi)置了details和summary標(biāo)簽時(shí)。使用一些基本的標(biāo)記和樣式，可以創(chuàng)建一個(gè)有吸引力且功能強(qiáng)大的 UI。它還與所有主要瀏覽器兼容。
 
值得一提的是，這種方法并不能提供全方位的特效。
 
除去這個(gè)警告，這是加載 JavaScript 庫(kù)的一個(gè)非常可行的替代方法。
 
下面是一個(gè)基本示例，說(shuō)明僅需幾行 HTML 和 CSS 即可完成的操作。
 

 
高級(jí)導(dǎo)航菜單
 
制作跨瀏覽器和設(shè)備的導(dǎo)航曾經(jīng)是一個(gè)相當(dāng)大的挑戰(zhàn)。特別是在創(chuàng)建多級(jí)或大型菜單時(shí)。高級(jí)功能通常需要回退才能在舊版瀏覽器上正常運(yùn)行。
 
這還沒有考慮到小屏幕?？赡苄枰獙?shí)現(xiàn)一個(gè)完全獨(dú)立的菜單，以確保在移動(dòng)設(shè)備上易于使用。
 
值得慶幸的是，這方面已經(jīng)取得了很大進(jìn)展。通過(guò)結(jié)合 HTMLnav標(biāo)簽、無(wú)序列表和 CSS，我們可以支持所有設(shè)備。它們不僅看起來(lái)和過(guò)去大量使用 JavaScript 的菜單一樣好，而且它們的執(zhí)行效率也更高。
 

 
游戲
 
基于網(wǎng)絡(luò)的游戲已經(jīng)存在了很長(zhǎng)時(shí)間——可以追溯到（吞咽！） Flash時(shí)代。即使在該平臺(tái)消亡之后，構(gòu)建它們的過(guò)程仍然很復(fù)雜。
 
創(chuàng)建流暢的動(dòng)畫、處理數(shù)學(xué)計(jì)算和允許用戶輸入傳統(tǒng)上需要高級(jí)腳本和庫(kù)使用。但現(xiàn)在不一定是這樣了。
 
canvas現(xiàn)在，CSS 可以與 HTML 、SVG 和其他好東西相結(jié)合，以創(chuàng)建一些令人驚訝的強(qiáng)大結(jié)果。雖然您不會(huì)將這些純 CSS 游戲誤認(rèn)為是在您的控制臺(tái)上播放的尖端游戲，但它們?nèi)匀涣钊擞∠笊羁獭?br />  

 
就像游戲一樣，網(wǎng)絡(luò)上的多媒體曾經(jīng)是瀏覽器插件領(lǐng)域。其中一些是由于專有格式，因?yàn)楣?yīng)商競(jìng)相為其編解碼器贏得市場(chǎng)份額。內(nèi)容提供者（以及設(shè)計(jì)者）被迫選擇一種或多種格式以提供給用戶。用戶需要安裝正確的軟件才能播放媒體。真是一團(tuán)糟。
 
但即使 MP4 等格式成為開放標(biāo)準(zhǔn)，播放仍然很復(fù)雜。然而，向 HTML5 的轉(zhuǎn)變給瀏覽器帶來(lái)了很多功能負(fù)擔(dān)。和元素使用具有多種可選功能video的audio內(nèi)置媒體播放器。
 
雖然 JavaScript 仍然被推薦用于更加自定義的 UI，但它不再是必需的。一些基本樣式可以使用 CSS 完成。此外，本機(jī)元素的瀏覽器兼容性非常強(qiáng)大。
 

 
建立基礎(chǔ)及超越
 
CSS 和 HTML 的進(jìn)步為推動(dòng)網(wǎng)絡(luò)向前發(fā)展創(chuàng)造了奇跡。我們不再需要借助大量代碼庫(kù)或過(guò)于復(fù)雜的流程來(lái)提供基本的交互性。這些本地支持的訂書釘完全有能力完成這項(xiàng)工作。
 
這是個(gè)好消息，因?yàn)榫W(wǎng)頁(yè)設(shè)計(jì)師需要考慮越來(lái)越多的設(shè)備。導(dǎo)航和媒體播放器等無(wú)需第三方庫(kù)即可運(yùn)行的元素對(duì)于實(shí)現(xiàn)這一目標(biāo)至關(guān)重要。
 
當(dāng)然，JavaScript 和類似的東西仍然存在，可以將事情提升到一個(gè)新的水平。但現(xiàn)在可以在沒有它們的情況下構(gòu)建基礎(chǔ)。