當(dāng)前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
用JS动态显示文本
index.html：
?
<!DOCTYPE html> <html lang="zh"><head><meta charset="utf-8" ><title>頁面（HTML5）</title><!-- 通過鏈接的方式使用 CSS --><link rel="stylesheet" href="css/master.css" /><script src="js/main.js" charset="utf-8"></script></head><body><!-- HTML5 語義標(biāo)簽 --><header>time is long, life is short</header><main><aside class="">aside</aside><article class=""><input id="info" placeholder="輸入內(nèi)容"><!-- <input type="button" value="添加"> --><button οnclick="show()" type="button" name="button">添加</button><h1 id="result">顯示</h1></article></main><footer>Copyright (c) 2016 Copyright Holder All Rights Reserved.</footer></body> </html>
main.js:
?
?
// 定義函數(shù) function show() {// 獲得id為info的input標(biāo)簽的內(nèi)容var a = document.getElementById('info').value;// 顯示，在id為result處動態(tài)顯示（清除舊的顯示新的）document.getElementById('result').innerText = a;}
show函數(shù)封裝在專門存放JS腳本代碼的文件夾main.js，function是屬于JavaScript的腳本語言函數(shù)。。。function是JavaScript語言中的關(guān)鍵詞，也就是聲明一個函數(shù)時使用的。。。
?
demo：
但是這個顯示沒有對齊輸入框，可在CSS樣式文件master.css中添加如此：
?
轉(zhuǎn)載于:https://www.cnblogs.com/zhangmingzhao/p/7256715.html
總結(jié)
- 上一篇： -bash:/etc/profile P
- 下一篇： 【SpringMVC】SpringMVC