How to dynamically load tables and dynamically add table rows in javascript_javascript skills

1. Dynamically load the table

1. First set the id for the adding position of the table in html

That is, write a div tag inside the body tag of html to indicate the table To be added inside this div. As follows

2. Write the statement to add the table in javascript

If it is in the current html file, Then write it inside the <script> tag, such as <BR><div class="codetitle"><span><a style="CURSOR: pointer" data="74836" class="copybut" id="copybut74836" onclick="doCopy('code74836')"><U> Copy the code The code is as follows: </script>

< ;script type="text/javascript" >

document.getElementById("tbl").innerHTML="> ;" //The table added here can be created according to your own needs

If the js file is introduced, then in the js file ( Assume it is test.js) and directly write the following statement

Copy the code The code is as follows:

document .getElementById("tbl").innerHTML=""

Then again Introduce your own html file

Copy code The code is as follows:

2. Dynamically add table rows

1. First in html Set the id for the adding position of the table row. This position must be inside (not particularly accurate, but I got this conclusion based on my test. If you have other methods, please leave a message, thank you), as follows

Copy code The code is as follows:

//tfoot and thead are used in conjunction with tbody, but when I was writing, it was okay not to use them.




[sS ]*n
2. In the javascript content, To create rows and cells first, then add rows in <.tbody>, as follows
[code]
row=document.createElement("tr"); //Create rows

td1=document.createElement("tr"); //Create cell

td1.appendChild(document.createTextNode("content")); //Add content to cell

row .appendChild(td1); //Add cells to the row

document.getElementById("rows").append(row); //Add rows to


3. My little discovery (maybe others have known it already...)

1. I did a test myself, writing " in JavaScript, then test it, html The rows in the table will not be added.

2. After completing the above test, I changed the html to write

content" in JavaScript, and the test can add content.

3. Thinking: What conclusions can be drawn from the above two tests, but I haven’t figured out how to summarize it yet. What kind of tags can be added directly through innerHTML?