如题,使用appendChild()方法添加节点到UL列表(末尾),当出现垂直滚动条时,请问如何让添加的LI始终显示出来,类似聊天窗口那样始终显示接收或发送的最新消息!
描述不太清楚请见谅!
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style> #list { height: 200px; width: 200px; background: #450; overflow-y:auto; text-align: justify; border:5px solid #fcc;} </style> </head> <body> <ul id="list"> <li>1</li> <li>2</li> <li>3</li> </ul> <p>向列表中(末尾)添加项目</p> <input id ="text1"type="text"> <button type="button" onclick="addNode()">添加</button> <script> function addNode(){ var otxt1 = document.getElementById('text1'); var oUl1 = document.getElementById('list'); var node = document.createElement('li'); var nodeText = document.createTextNode(otxt1.value) if (otxt1.value =='') { alert('文本为空!'); }else{ node.appendChild(nodeText); oUl1.appendChild(node); }; otxt1.value = ""; } </script> </body> </html>