Home > Article > Web Front-end > Summary of jQuery methods for dynamically adding rows to html tables
Summary of jQuery methods for dynamically adding rows to html tables
- php中世界最好的语言Original
- 2018-04-24 09:52:463922browse
This time I will bring you a summary of jQuerymethods of dynamically adding rows to html tables, what are the notes for jQuery to dynamically add rows to html tables, The following is a practical case, let’s take a look.
The example in this article describes the jQuery method of dynamically adding new rows to an html table. Share it with everyone for your reference. The specific implementation method is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Add Row example</title>
<script src="jquery-1.6.2.min.js"></script>
<script type="text/javascript">
<!-- jQuery Code will go underneath this -->
$(document).ready(function () {
// Code between here will only run when the document is ready
$("a[name=addRow]").click(function() {
// Code between here will only run
//when the a link is clicked and has a name of addRow
$("table#myTable tr:last").after('<tr><td>Row 4</td></tr>');
return false;
});
});
</script>
</head>
<body>
<table style="width: 100%" id="myTable">
<tr><td>Row 1</td></tr>
<tr><td>Row 2</td></tr>
<tr><td>Row 3</td></tr>
</table>
<a href="#" name="addRow">Add Row</a>
</body>
</html>
I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the PHP Chinese website!
Recommended reading:
The grep() method implements array filtering
Detailed explanation of the steps for Jquery to parse json string json array (Code attached)
jquery’s method grep() implements array filtering
The above is the detailed content of Summary of jQuery methods for dynamically adding rows to html tables. For more information, please follow other related articles on the PHP Chinese website!