當前位置：
首頁 >
前端技术
> 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 語義標簽 --><header>time is long, life is short</header><main><aside class="">aside</aside><article class=""><input id="info" placeholder="輸入內容"><!-- <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:
?
?
// 定義函數 function show() {// 獲得id為info的input標簽的內容var a = document.getElementById('info').value;// 顯示，在id為result處動態顯示（清除舊的顯示新的）document.getElementById('result').innerText = a;}
show函數封裝在專門存放JS腳本代碼的文件夾main.js，function是屬于JavaScript的腳本語言函數。。。function是JavaScript語言中的關鍵詞，也就是聲明一個函數時使用的。。。
?
demo：
但是這個顯示沒有對齊輸入框，可在CSS樣式文件master.css中添加如此：
?
轉載于:https://www.cnblogs.com/zhangmingzhao/p/7256715.html
總結
- 上一篇： -bash:/etc/profile P
- 下一篇： 【SpringMVC】SpringMVC