如何展示jquery控制css樣式的幾種方法同樣效果

2019-12-12 05:42:05

在JavaScript中，可以獲取元素對應的ID或類選擇器，使用點style方式設定樣式；而在jQuery中可以使用css()方法，這個方法也有三種展示形式。下面利用範例說明，操作如下：

第一步，雙擊開啟HBuilder工具，新建一個Web專案並在指定資料夾中新建一個HTML5頁面，如下圖所示：

第二步，由於要使用到jquery，這裡需要把jquery檔案引入到頁面中，如下圖所示：

第三步，在<body></body>標籤內，插入一個div和p標籤，如下圖所示：

第四步，在<script></script>標籤內，呼叫jquery初始化函數，新增p標籤點選事件，設定字型大小、字型顏色和背景色，如下圖所示：

第五步，儲存程式碼並直接使用瀏覽器預覽頁面效果，並點選頁面上的文字檢視效果，如下圖所示：

第六步，在第五步中的css()呼叫了三次，this也使用了三次，可以減少程式碼重複，如下圖所示：