zoukankan      html  css  js  c++  java
  • 动态创建2016/4/21

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <script>
    window.onload = function() {
    	
    	var oText = document.getElementById('text1');
    	var oBtn = document.getElementById('btn');
    	var oUl = document.getElementById('ul1');
    	
    	oBtn.onclick = function() {
    		
    		/*
    			document.createElement(标签名称); 创建元素
    		*/
    		
    		var oLi = document.createElement('li');
    		
    		//oLi.innerHTML = oText.value + '<a href="javascript:;">删除</a>';
    		oLi.innerHTML = oText.value;
    		
    		var oA = document.createElement('a');
    		oA.innerHTML = '删除';
    		oA.href = 'javascript:;';
    		oA.onclick = function() {
    			
    			/*
    				父级.removeChild(要删除的元素); 删除元素
    			*/
    			
    			oUl.removeChild( this.parentNode );
    			
    		}
    		
    		oLi.appendChild( oA );
    		
    		
    		//添加到页面中
    		/*
    			父级.appendChild(要添加的元素) 方法 追加子元素
    		*/
    		//oUl.appendChild( oLi );
    		
    		/*
    			父级.insertBefore(新的元素,被插入的元素) 方法 在指定元素前面插入一个新元素
    			在ie下如果第二个参数的节点不存在,会报错
    			在其他标准浏览器下如果第二个参数的节点不存在,则会以appendChild的形式进行添加
    		*/
    		//oUl.insertBefore( oLi, oUl.children[0] );
    		
    		if ( oUl.children[0] ) {
    			oUl.insertBefore( oLi, oUl.children[0] );
    		} else {
    			oUl.appendChild( oLi );
    		}
    		
    	}
    	
    }
    </script>
    </head>
    
    <body>
    	<input type="text" id="text1" /><input type="button" value="留言" id="btn" />
    	<ul id="ul1"></ul>
    </body>
    </html>
    

      

  • 相关阅读:
    nvidia-smi电源显示ERR (Pwr:Usage ERR)
    阿里云windows安装ftp
    ansible常用模块
    ansible playbook
    ansible Inventory
    ansible安装
    ansible命令
    ansible配置文件
    js插件中提示框含有 或者<br/>显示不成换行怎么办,改样式
    [转] react项目安装及运行
  • 原文地址:https://www.cnblogs.com/hduhdc/p/5415729.html
Copyright © 2011-2022 走看看