类似聊天功能的实现

原创 2018-11-19 17:00:55 182
摘要:<!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <title>实战热身</title>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>实战热身</title>
</head>
<body>
<input type="text" name="info">
<button>提交</button>
<ul></ul>
<script type="text/javascript">
 let info=document.getElementsByName('info')[0];
 let btn=document.getElementsByTagName('button')[0];
 let ul=document.getElementsByTagName('ul')[0];
 btn.onclick=function(){
        let li=document.createElement('li');
 li.innerHTML=info.value;
 ul.appendChild(li);
 info.value='';
 }
</script>
</body>
</html>

总结:今天学到了各种选择器的使用、js对HTML属性的操作以及对元素内容的处理、还有Dom节点的创建,插入和删除,并且与jquery中的操作进行了对比,理解的更加清晰了,后期还需要多加练习应用,熟悉他们的用法。

批改老师:灭绝师太批改时间:2018-11-19 17:38:49
老师总结:完成的不错,多多练习很有必要,继续加油!

发布手记

热门词条