HTML點擊復制頁面地址代碼
在日常使用中,經常會有需要將網頁的地址復制給其他人或者自己收藏,此時需要手動復制或截屏,顯得比較繁瑣。那么有沒有一種簡單的方式可以將頁面地址快速復制到剪切板上呢?答案是肯定的!下面介紹如何使用HTML代碼實現點擊復制頁面地址功能。
首先,我們需要在頁面中添加一個按鈕元素,用于觸發復制操作。具體代碼如下:
當前頁面地址為:
https://www.example.com
其中,按鈕元素的id設置為“copy-btn”,點擊按鈕時會觸發copyToClipboard()函數。接下來,我們需要定義這個函數,實現復制功能。代碼如下:此函數主要用到了兩個方法:querySelector()和execCommand()。其中,querySelector()用于獲取代碼部分的元素,execCommand()用于執行復制操作。 最后,我們需要在標簽中添加樣式,使按鈕看起來更加美觀。代碼如下:至此,一個簡單的點擊復制頁面地址功能就完成了。用戶只需要單擊按鈕,就可以將頁面地址復制到剪切板中,非常方便! 總結 HTML代碼使復制操作變得簡單而快捷,不再需要手動復制或截屏,大大提高了用戶體驗。希望以上內容對使用HTML開發的前端工程師們有所幫助!