在jquery中,可以利用attr()方法來改變src屬性,該方法用于設(shè)置或者返回被選元素的指定屬性值,當(dāng)方法內(nèi)的第一個參數(shù)設(shè)置為“src”時,就可以改變src屬性,語法為“指定元素對象.attr('src',新的src屬性值)”。
本教程操作環(huán)境:windows10系統(tǒng)、jquery3.2.1版本、Dell G3電腦。
jquery怎么改變src屬性
在jquery中,主要通過attr()方法來設(shè)置src屬性,從而實現(xiàn)改變src屬性。
下面舉例講解jquery如何改變img標(biāo)簽的src屬性。
新建一個html文件,命名為test.html,用于講解jquery 如何改變img標(biāo)簽的src屬性。使用script標(biāo)簽在當(dāng)前頁面引入jquery.min.js文件,成功加載該文件,才能使用jquery的方法。
使用p標(biāo)簽內(nèi),使用img標(biāo)簽創(chuàng)建一張圖片,并設(shè)置img標(biāo)簽的id為myimg,主要用于下面通過此id獲得img對象。使用button標(biāo)簽創(chuàng)建一個按鈕,按鈕名稱為“修改圖片地址”。
給button按鈕綁定onclick點擊事件,當(dāng)按鈕被點擊時,執(zhí)行editsrc()函數(shù)。
在js標(biāo)簽內(nèi),創(chuàng)建editsrc()函數(shù),在函數(shù)內(nèi),使用$符號通過id(myimg)獲得img對象,使用attr()方法設(shè)置src屬性,例如,設(shè)置src圖片路徑為“images/3.jpg”。
在瀏覽器打開test.html文件,點擊按鈕,查看實現(xiàn)的效果。
總結(jié):
1、創(chuàng)建一個test.html文件。
2、在文件內(nèi),使用p標(biāo)簽內(nèi),使用img標(biāo)簽創(chuàng)建一張圖片,同時使用button標(biāo)簽創(chuàng)建一個按鈕,用于觸發(fā)執(zhí)行js函數(shù)。
3、在js標(biāo)簽內(nèi),創(chuàng)建函數(shù),在函數(shù)內(nèi),使用$符號獲得img對象,使用attr()方法設(shè)置src屬性。
注意事項
attr()除了可以設(shè)置html標(biāo)簽外,還可以獲取html標(biāo)簽的屬性值。
相關(guān)視頻教程推薦:jQuery視頻教程