在現今的互聯網時代中,網站不再是僅僅用來呈現信息的靜態頁面了,交互式網站成為了用戶所喜愛的一種方式。而要將網站變成一個交互性的網站,html可以發揮很大的作用。
要將網頁設置為交互網頁,示例如下:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>交互式網頁</title> </head> <body> <h1>歡迎來到交互式網頁</h1> <p>請輸入您的名字:</p> <input type="text" id="name"> <button onclick="greeting()">提交</button> <script> function greeting() { var name = document.getElementById("name").value; alert("歡迎," + name + "!"); } </script> </body> </html>
上述代碼展示了一個簡單的交互頁面,其中有一個輸入框和一個按鈕,當用戶在輸入框內輸入名稱并點擊按鈕時,會彈出一個歡迎框。
在代碼中,我們采用了input標簽來創建輸入框,并給其添加了一個唯一標識名字id,這樣在javascript中通過getElementById方法就能輕易的獲取到輸入框內的值。
而在button標簽中,我們添加了一個onclick事件,這個事件會在按鈕被點擊時執行其中的代碼。在這里,我們調用了greeting函數,這個函數會彈出一個歡迎框,并從輸入框內獲取名稱來展示在框中。
這只是一個簡單的例子,而在html中有很多標簽和屬性可以用來創建更加復雜的交互式頁面。通過html的靈活性,我們可以把網頁變成用戶可以自由互動的一個界面。