3

Say I have a string like this:

var tablestring = "<table><tr><td>Test</td></tr></table>";

Is it possible to populate a table DOM object doing something like this:

var Test = document.createElement("TABLE");
Test.value = tablestring;
Kristijan Iliev
  • 4,901
  • 10
  • 28
  • 47
w0051977
  • 15,099
  • 32
  • 152
  • 329
  • Are you partial to using jQuery to achieve this? A jumping-off point might be in this question here: http://stackoverflow.com/questions/11047670/creating-a-jquery-object-from-a-big-html-string – Geoff James Aug 25 '16 at 11:51
  • Kindly read the below link that may help you [enter link description here](http://stackoverflow.com/questions/16126357/create-html-table-using-javascript) – Parthasarathy Aug 25 '16 at 11:52

4 Answers4

1

Yes it is. Using .innerHTML you can assign html to a dom element. Please see the snippet below:

function addTable(){
 var tablestring = "<table><tr><td>Test</td></tr></table>";
 var container = document.getElementById('container');
 container.innerHTML = tablestring;
}
<button onclick="addTable()"> Add table </button>
<div id="container"></div>
Kristijan Iliev
  • 4,901
  • 10
  • 28
  • 47
0

you can do this :

var tablestring = "<table><tr><td>Test</td></tr></table>";

var Test = document.createElement("Div");
Test.innerHTML= tablestring;

document.body.appendChild(Test);
Mustapha Larhrouch
  • 3,373
  • 3
  • 14
  • 28
0

JQuery solution

$("Your div").html(tablestring);
0

You can use .html() in jQuery to add tablestring in div. It may be help to you.

function addTable(){
 var tablestring = "<table class='table'><tr><td>Test</td></tr></table>";
 $('#myTable').html(tablestring);
}
.table{
  border:1px solid red;
  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="addTable()"> Add table </button>
<div id="myTable"></div>
Kalu Singh Rao
  • 1,671
  • 1
  • 16
  • 21