1.制作出一个语言输入的基本框架
2.在文本输入框输入内容，点击按钮，内容自动弹到上面的框架内
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5 <title>无标题文档</title>
6 <style>
7 #div1 { width:240px; height:200px; border:1px solid #333; background:#f1f1f1; padding:10px; }
8 </style>
9 <script>
10 window.onload = function (){
11 var oDiv = document.getElementById(‘div1‘);
12 var oStrong = document.getElementById(‘strong1‘);
13 var oText = document.getElementById(‘text1‘);
14 var oBtn = document.getElementById(‘btn1‘);
15
16 oBtn.onclick = function (){
17 // 原来的内容，你得给我留着，然后再加上新内容
18 // a = a + b
19 // a += b
20
21 // 添加：+=
22 // oDiv.innerHTML = oDiv.innerHTML + oText.value + ‘<br />‘;
23 oDiv.innerHTML += oStrong.innerHTML + oText.value + ‘<br />‘;
24 oText.value = ‘‘;
25 };
26 };
27 </script>
28 </head>
29
30 <body>
31
32 <div id="div1"></div>
33 <strong id="strong1">张三：</strong>
34 <input id="text1" type="text" />
35 <input id="btn1" type="button" value="提交" />
36
37 </body>
38 </html>
示例代码
时间： 2024-10-16 02:53:12