JQ添加

1. 用js添加

	        var txt1=document.getElementById("txt1")
		var txt2=document.getElementById("txt2")
		var span1=document.getElementById("span1")
		var span2=document.getElementById("span2")
		
		txt1.onkeyup=function(){
			span1.innerHTML=txt1.value
		}
		
		var ul1=document.getElementById("ul1")
		
		btn.onclick=function(){
			
			if(txt1.value=="" || txt2.value==""){
				alert("不能")
				return
			}
			
			
			
			var li=document.createElement("li") //创建
			li.className="item"    
			ul1.appendChild(li)   //追加
			ul1.insertBefore(li,ul1.firstChild)
			
			
			
			var divcontent=document.createElement("li")
			li.appendChild(divcontent)
			var divt=document.createElement("div")
			li.appendChild(divt)
			
			divt.innerHTML=new Date().toLocaleString()
			
			
			var del=document.createElement("input")
			del.type="button"
			del.value="删除"
			li.appendChild(del)
			
			
			var str=txt1.value+"说:"+txt2.value
			var timer=setInterval(function(){
				var ch=str.charAt(0);
				str=str.substr(1)+ch;
				
				divcontent.innerHTML=str
				
			},800);
			
			
			
			
			
			
			del.onclick=function(){
				this.parentNode.remove()
			}
		}
		
		

2.用JQ

$("#btn1").click(function(){
		
		var $li=$("<li></li>").appendTo("ul")
		
		var ch=$("<input type='checkbox' class='c1'/>").appendTo($li)
		
		var pp=$("<p class='aa2'></p>").appendTo($li)
		var $img=$("<img />").attr("src",str).appendTo(pp)
		$("<img />").css({"width":"100px","height":"100px"})
		
		var pp2=$("<p class='aa3'></p>").appendTo($li).html($(":text:eq(1)").val())
		
		
		var $div=$("<div></div>").appendTo($li)
		
		var $btn1=$("<input type='button' value='-'/>").appendTo($div)
		var $tet=$("<input type='text' class='yi'  />").appendTo($div).val($(":text:eq(0)").val())
		var $btn3=$("<input type='button' value='+'/>").appendTo($div)
		
		var pp3=$("<p class='aa4'></p>").appendTo($li)
		
		//删除
		var $del=$("<a href='#'>删除</a>").appendTo($li)
		$del.click(function(){
			alert("确定")
			$(this).parent().remove()
		})
		
		
		
		
		//加减
		$("li :button:first-child").click(function(){
			
			var n=$(this).next().val()
			n--
			
			
			if (n<=1) {
				n=1
			}
			$(this).next().val(n)
			
			var x=n*$(this).parent().prev().html()
			$(this).parent().next().html(x)
		})
		
		$("li :button:last-child").click(function(){
			
			var n=$(this).prev().val()
			n++
			
			if (n>=10) {
				n=10
			}
			$(this).prev().val(n)
			
			var x=n*$(this).parent().prev().html()
			$(this).parent().next().html(x)
			
		})
		
		
		$(":checkbox:gt(0)").click(function(){
			
			var len1=$(":checkbox:gt(0):checked").length
			var len2=$(":checkbox:gt(0)").length
			if (len1 == len2) {
				$(":checkbox:eq(0)").prop("checked",true)
				
			} 
			else{
				$(":checkbox:eq(0)").prop("checked",false)
				
			}
		})
		
		
		
	})
	$(":checkbox:eq(0)").click(function(){
		var f=$(this).prop("checked")
		
		$(":checkbox:gt(0)").prop("checked",f)
		
	})