怎么覺得JS和CSS重疊的東西太多了？

JS和CSS根本就是兩種東西，按說不應(yīng)該有交叉之處。我覺得，題主覺得所說的重疊，應(yīng)該是指兩者的操作“套路”太相近了吧？別看有的書動輒七八百頁，看起來內(nèi)容很厚重的樣子，但一些關(guān)鍵的東西可能都沒有總結(jié)出來。我這里就來說說JS和CSS看起來差不多的“套路”，也就是所謂的重疊。

選擇器的套路基本是一致的

由于JS的各種原生getElementBy...選擇器用起來有點(diǎn)繁瑣，我平時更喜歡使用堪稱為JS標(biāo)配工具的jQuery選擇器。

以最常見的id選擇器為例，CSS中使用的是#id，jQuery中只要使用$函數(shù)再將它包起來即可，例如：$('#id')。

再比如，class選擇器，CSS的寫法是.abc，jQuery是$('.abc')；

標(biāo)簽選擇器，CSS是div，jQuery是$('div')；

屬性選擇器，CSS是[href^="http"]，jQuery是$('[href^="http"]')。

至于其他更復(fù)雜的選擇器，如復(fù)合選擇器、層次選擇器、偽類選擇器等等都是一樣的用法。因此，完全可以將CSS選擇器和jQuery中的選擇器結(jié)合在一起學(xué)習(xí)。從這個角度來看，它們確實(shí)是重復(fù)的！

我不明白的是，那些看起來很厚重的所謂專業(yè)書，CSS講了一堆選擇器，jQuery中也講了一堆選擇器，為什么不能把它們放在一起？不覺得這樣的書既浪費(fèi)讀者的時間同時也浪費(fèi)讀者的金錢么？

在我寫的《B/S項(xiàng)目開發(fā)實(shí)戰(zhàn)》一書中，關(guān)于CSS選擇器的介紹只有一頁半的內(nèi)容，其它部分全部放到j(luò)Query選擇器中了：

這是因?yàn)椋灰獣薺Query選擇器，CSS的選擇器用法自然也就會用了，而且功能更強(qiáng)大：

CSS和JS的使用套路也是一致的

絕大部分的專業(yè)書都會總結(jié)使用CSS樣式的3大方法：一是元素內(nèi)嵌樣式，也就是以Style屬性直接將樣式寫在元素中；二是文檔內(nèi)嵌樣式，也就是將聲明的樣式單獨(dú)寫在style標(biāo)簽元素中；三是外部引用樣式，將樣式寫在一個單獨(dú)的css文件中，然后通過link標(biāo)簽引用。

事實(shí)上，JS代碼也是同樣的三種方法，但很少有人對此進(jìn)行總結(jié)。例如，下面的寫法就相當(dāng)于是元素內(nèi)嵌方式的寫法，因?yàn)樗鼉H對當(dāng)前標(biāo)簽元素的單擊有效：

<button onclick="alert('這是彈出的信息')">操作按鈕</button>

文檔內(nèi)嵌方式就是以<script></script>標(biāo)簽包起來的一對js代碼；外部引用更直觀，它是以<script>標(biāo)簽引用的外部js文件。

您說兩者的使用套路是不是一樣？經(jīng)過這樣對比之后，印象應(yīng)該更深刻了吧？

我是人民郵電出版社簽約作者，我倡導(dǎo)的是“換一種角度來學(xué)習(xí)”。歡迎大家關(guān)注并留言交流，謝謝！