rush:xhtml;">
<Meta charset="UTF-8">
<style type="text/css">
- {
margin: 0;
padding: 0;
}
.bos {
margin: 100px auto;
width: 350px;
position: relative;
}
.bos a {
float: right;
}
button {
position: relative;
left: 301px;
bottom: 0;
}
textarea {
width: 350px;
resize: none;
}
ul li {
list-style: none;
}
<script type="text/javascript">
window.onload = function() {
var txt = document.getElementById('txt');
var btn = document.getElementsByTagName('button')[0];
var oUl = document.getElementsByTagName('ul')[0];
btn.onclick = function() {
if(txt.value == '') {
alert('请输入...');
return false; //结束事件*******
}
var newli = document.createElement('li'); //创建<a href="https://www.jb51.cc/tag/biaoqian/" target="_blank" class="keywords">标签</a><li></li>
newli.innerHTML = txt.value + '<a href = "#"><a href="https://www.jb51.cc/tag/shanchu/" target="_blank" class="keywords">删除</a><a>';
//oUl.appendChild(newli); //将创建<a href="https://www.jb51.cc/tag/biaoqian/" target="_blank" class="keywords">标签</a><li></li>加到最后面
var lis = oUl.childNodes; //oUl.children
oUl.insertBefore(newli,lis[0]); //将创建<a href="https://www.jb51.cc/tag/biaoqian/" target="_blank" class="keywords">标签</a><li></li>加到最前面
txt.value = '';
//<a href="https://www.jb51.cc/tag/shanchu/" target="_blank" class="keywords">删除</a>发出去的消息
var oA = document.getElementsByTagName('a');
for(var i = 0; i < oA.length; i++) {
oA[i].onclick = function() {
oUl.removeChild(this.parentNode);
}
}
}
}
Box" class="bos">
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。