HTML標(biāo)簽innerHTML的使用
在HTML中有很多標(biāo)簽可以提供我們來設(shè)置HTML屬性,其中之一就是innerHTML。它可以通過JavaScript來改變HTML元素的內(nèi)容。下面以QQ注冊(cè)提示為例: 1. 如果我們寫好了一個(gè)用于注
在HTML中有很多標(biāo)簽可以提供我們來設(shè)置HTML屬性,其中之一就是innerHTML。它可以通過JavaScript來改變HTML元素的內(nèi)容。下面以QQ注冊(cè)提示為例:
1. 如果我們寫好了一個(gè)用于注冊(cè)的表單,一般會(huì)使用彈出框來告訴用戶是否注冊(cè)成功。然而,這種方式往往會(huì)讓用戶感到繁瑣和不舒服。相比之下,使用innerHTML給用戶顯示一段文字,會(huì)給他們一種舒適的感覺。
2. 學(xué)習(xí)后的成品如下圖所示:
3. 顯示效果如下圖所示:
4. 你只需要寫一個(gè)簡(jiǎn)單的HTML頁面,就可以實(shí)現(xiàn)這個(gè)功能。代碼如下:
lt;htmlgt;
lt;headgt;
lt;scriptgt;
function inter() {
var inter ("inner");
if ( "") {
"顯示的文字";
} else {
"";
}
}
lt;/scriptgt;
lt;/headgt;
lt;bodygt;
lt;input type"button" value"點(diǎn)擊添加文字" onclick"inter()"gt;
lt;div id"inner"gt;lt;/divgt;
lt;/bodygt;
lt;/htmlgt;
5. 點(diǎn)擊按鈕就可以添加你想要的文字。再次點(diǎn)擊就會(huì)使文字消失。雖然文字排序可能比較亂,但以下是截圖展示。請(qǐng)注意,我并沒有將JavaScript代碼分離成外部文件,主要是因?yàn)槲矣X得這樣更加方便,哈哈,這僅供學(xué)習(xí)使用。
6. 知識(shí)的價(jià)值在于分享,讓人們受益匪淺。