在web開發中,我們經常需要改變頁面元素的樣式,其中包括圖片和文字的顏色。jQuery是一個輕量級的JavaScript庫,它提供了許多簡單易用的方法,能夠輕松地選擇和操作頁面元素。
選擇圖片的方法如下:
$(document).ready(function(){ // 選擇所有img標簽 $('img').click(function(){ // 在控制臺輸出圖片的src屬性 console.log($(this).attr('src')); }); });
首先,我們等待頁面加載完成,然后選擇所有的img標簽。通過click事件,當用戶點擊任意一張圖片時,我們就會在控制臺輸出該圖片的src屬性。使用$(this)選擇當前被點擊的元素,使用attr方法獲取src屬性。
現在我們來看看如何改變文字顏色:
$(document).ready(function(){ // 選擇所有p標簽 $('p').click(function(){ // 改變文字顏色為紅色 $(this).css('color', 'red'); }); });
同樣地,我們等待頁面加載完成,然后選擇所有的p標簽。通過click事件,當用戶點擊任意一個p標簽時,我們就會將該元素的文字顏色改為紅色。使用$(this)選擇當前被點擊的元素,使用css方法改變color屬性。
總之,使用jQuery庫可以輕松地選擇和操作頁面元素,包括圖片和文字顏色。以上是一些簡單的示例,你可以通過修改代碼來實現自己想要的效果。
下一篇jquery選擇器除外