摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>聊天信息生成</title>
</head>
<body>
<input type="text"><button>發(fā)送</button>
<ol></ol>
<script>
let input = document.getElementsByTagName('input')[0];
let button = document.getElementsByTagName('button')[0];
let ol =document.getElementsByTagName('ol')[0];
button.onclick=function(){
let li = document.createElement('li');
li.innerHTML= input.value;
ol.appendChild(li);
input.value="";
}
</script>
</body>
</html>通過獲取到元素,然后創(chuàng)建li節(jié)點(diǎn)來接收input中輸入的值,接著將li節(jié)點(diǎn)插入到ol節(jié)點(diǎn)中,然后將input節(jié)點(diǎn)中的值清空,這樣就能達(dá)到在輸出框輸入文字,點(diǎn)提交后,讓文字在下面顯示的效果
批改老師：天蓬老師批改時(shí)間：2019-03-30 13:42:49
老師總結(jié)：這是一個(gè)簡單的dom操作, 涉及一些基本的元素獲取技巧 , 多做幾次, 掌握它