使用jquery来动态创建表格和删除 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>js的学习</title><script type="text/javascript" src="js/jquery-3.0.0.js"></script><style type="text/css"> .class1 { background-color: black; } .class2{ background-color: white; }</style><script type="text/javascript"> //获取函数 $(function (){ var ps =$("p"); //按钮的点击的事件 $("#get").click(function(){ for (var i = 0; i < ps.length; i++) { //获取内容 console.log($(ps[i]).text()) } }); //通过jquery获取值val //点检事件其实就是获取按钮的jQuery的对象或去点击的事件 $("#getv").click(function(){ //获取文本框的对象 $("#v").val("傻B"); }); //获取属性 $("#geta").click(function(){ //获取想要获得属性的对象 //alert($("#v").attr("type")); }); //s设置属性jquery没有属性全是方法 $("#setAtt").click(function(){ if($(this).text()=="白") { //获取当前的属性对象 $(this).text("黑"); $("#b").attr("class","class1"); }else { //alert("进啦"); $(this).text("白"); $("#b").attr("class","class2"); } }); //制作表格 //附加 $("#append").click(function (){ //制作td var td1=$("<td></td>").text("123"); var td2=$("<td></td>").text("123"); var td3=$("<td></td>").text("123"); var td4=$("<td></td>").text("123"); var td4=$("<td></td>").html("<a href='#' onclick ='delete1(this)'>删除</a>"); var tr =$("<tr></tr>") tr.append(td1); tr.append(td2); tr.append(td3); tr.append(td4); $("tbody").append(tr); }); }); function delete1 (th){ th.parentNode.parentNode.parentNode.removeChild(th.parentNode.parentNode); }</script></head><body id="b"><p>第1段的内容</p><p>第2段的内容</p><p>第3段的内容</p><p>第4段的内容</p><input type="text" id="v"><button id="get">点击获取内容</button><br><button id="getv">点击赋予内容</button><br><button id="geta">点击获取属性</button><br><button id="setAtt">设置属性</button><table border="1" cellspacing="0"><tbody></tbody></table><button id="append" >增加表格</button></body></html>