Just change the following line

otArr.push('"' + e + '": {' + itArr.join(',') + '}');

to

otArr.push('"' + (e+1) + '": {' + itArr.join(',') + '}');

The parenthesis will add the values as numbers not strings.

Also, add keys array for internal object keys.

function html2json() {
   var json = '{';
   var otArr = [];
  // var i = 1;
   var tbl2 = $('table tbody tr').each(function(e) {        
      x = $(this).children();
      var itArr = [];
      var keys = ['no','name','lastname'];
      x.each(function(i) {
         itArr.push('"' + keys[i] + '":"' + $(this).text() + '"');
      });
      otArr.push('"' + (e+1) + '": {' + itArr.join(',') + '}');
   })
   json += otArr.join(",") + '}'

   return json;
}
Answer from mhatch on Stack Overflow
🌐
Adobe
opensource.adobe.com › Spry › samples › data_region › JSONDataSetSample.html
JSON Data Set Sample
In this example, we are simply ... of the "item" objects, and then display the info we get in a table: var dsExample8 = new Spry.Data.JSONDataSet("../../data/json/donuts.js", { path: "items.item" }); ......
🌐
IBM
developer.ibm.com › articles › i-json-table-trs
JSON Format Example: JSON_TABLE function
This article explains the four types of database columns that can be defined using JSON tables, and provides examples of using JSON_TABLE to retrieve JSON objects from the web and process that information in relational form.
People also ask

Can I convert API response JSON to HTML table with nested objects?
Yes! The tool is designed specifically for API responses from REST APIs, GraphQL endpoints, and microservices. It handles nested objects, arrays, and complex hierarchical data structures automatically. Simply paste your API response, and it will create organized tables with sub-tables for nested data.
🌐
jsontotable.org
jsontotable.org
JSON to Table Converter - Convert Complex Nested JSON to HTML Table ...
How do I convert complex nested JSON to a table?
Simply paste your JSON data (including deeply nested structures, recursive objects, or multi-level arrays) into the input area or upload a JSON file. The tool instantly parses and converts it to a hierarchical table format with tree visualization. For nested JSON objects and arrays at any depth level, it automatically creates sub-tables within cells to maintain the complete data structure and parent-child relationships.
🌐
jsontotable.org
jsontotable.org
JSON to Table Converter - Convert Complex Nested JSON to HTML Table ...
Can I edit nested JSON directly in table view and update the source?
Yes! Enable edit mode by clicking the 'Edit' button, then click any cell to modify values even in deeply nested structures. The source JSON updates automatically in real-time with proper JSON path preservation. This makes it easy to fix data, update values, or remove unwanted information without manually editing complex JSON syntax.
🌐
jsontotable.org
jsontotable.org
JSON to Table Converter - Convert Complex Nested JSON to HTML Table ...
🌐
Polygon
docshield.tungstenautomation.com › KTA › en_us › 7.9.0-ud9cfx6hos › help › designer › All_Shared › SystemData › c_dmjsonexamples.html
Examples of data models using JSON sample
The Employee details are taken for the different data models. This sample includes employee details, such as name, job, id and created at. { "name": "Morpheush", "job": "Leader", "id": "199", "createdAt": "2020-02-20T11:00:28.107Z" } The above JSON sample creates the following 'Employee' model..
🌐
Teradata
docs.teradata.com › r › Enterprise_IntelliFlex_VMware › JSON-Data-Type › JSON-Shredding › JSON_TABLE › JSON_TABLE-Examples
JSON_TABLE Examples - Teradata Vantage
Loading application · Promo placeholder · Tracking Consent Teradata.com · Developers · Getting Started · VantageCloud Lake Documentation AI Unlimited All Documentation · Downloads · Community · Teradata Community Technical Medium Blogs Github Stack Overflow · Try for free
🌐
Jsontotable
jsontotable.org › blog › json › sample-json
Sample JSON Data - 50+ Real-World JSON Examples for Testing & Development | JSON to Table Converter
Comprehensive collection of sample JSON data with real-world examples. Copy-ready JSON samples for testing APIs, learning JSON structure, and development.
🌐
Datatables
editor.datatables.net › examples › advanced › deepObjects.html
DataTables example - Complex (nested) JSON data source
The columns.data, fields.data and fields.name options can be given as Javascript dotted object notation strings, to be able to read the data required. For example, to get the first name parameter from the above data source object, use users.first_name as is done in the Editor initialisation in this example. This can be exceptionally useful when working with joined tables.
Top answer
1 of 4
2

Just change the following line

otArr.push('"' + e + '": {' + itArr.join(',') + '}');

to

otArr.push('"' + (e+1) + '": {' + itArr.join(',') + '}');

The parenthesis will add the values as numbers not strings.

Also, add keys array for internal object keys.

function html2json() {
   var json = '{';
   var otArr = [];
  // var i = 1;
   var tbl2 = $('table tbody tr').each(function(e) {        
      x = $(this).children();
      var itArr = [];
      var keys = ['no','name','lastname'];
      x.each(function(i) {
         itArr.push('"' + keys[i] + '":"' + $(this).text() + '"');
      });
      otArr.push('"' + (e+1) + '": {' + itArr.join(',') + '}');
   })
   json += otArr.join(",") + '}'

   return json;
}
2 of 4
1

You can convert e to a Number and add one to it like in this fiddle.

function html2json() {
  var json = '{';
  var otArr = [];
  // var i = 1;
  var tbl2 = $('table tbody tr').each(function(e) {
    x = $(this).children();
    var itArr = [];
    x.each(function() {
      itArr.push('"' + $(this).text() + '"');
    });
    otArr.push('"' + (Number(e) + 1) + '": {' + itArr.join(',') + '}');
  })
  json += otArr.join(",") + '}'

  return json;
}

The json you're returning is not valid though. You may want to do something like this fiddle if you can to simplify and ensure valid json and to create your objects from any table structure.

function html2json() {   
  var otArr = [];
  var tblHeaders = Array.from($('table thead tr')
    .children())
    .map(header => $(header).text());  
  var tbl2 = $('table tbody tr').each(function(e) {        
    const values = Array.from($(this).children());
    const row = {};
    for (let i = 0; i < tblHeaders.length; i++){        
        row[tblHeaders[i]] = $(values[i]).text();
    }
    otArr.push({
        [e+1]: row
    })      
  })
  json = JSON.stringify(otArr);  
  return json;
}
Find elsewhere
🌐
MySQL
dev.mysql.com › blog-archive › json_table-the-best-of-both-worlds
MySQL :: JSON_TABLE - The Best of Both Worlds
Since JSON_TABLE returns a result set, it may be used in the FROM clause. JSON_TABLE takes the following arguments: The JSON data source: This expression may refer to columns of preceding tables in the FROM list. In this example, json_col refers to the column that contains our JSON document.
🌐
Jsontotable
jsontotable.org
JSON to Table Converter - Convert Complex Nested JSON to HTML Table Online
Just paste it in: Got some JSON from an API call (REST API, GraphQL response), database dump, or configuration file? Just copy and paste it into the left editor. Handles deeply nested structures, recursive objects, and complex hierarchies. ... Upload a file: Have a .json file sitting on your computer? Click that upload button and select it. Works with .txt files too! ... Not sure? Try the sample: Click "Sample" to load some example data and see the magic happen.
🌐
MariaDB
mariadb.com › resources › blog › introducing-json-tables
Introducing JSON Tables | MariaDB
August 30, 2021 - To gain an understanding of the new JSON_TABLE function, let’s first take a look at a simple example. We’ll start by creating a simple table, named people, that can be used to store structured data, like id and name values, as well as semi-structured data, for, say, storing a person’s pets.
🌐
Teradata
docs.teradata.com › r › Enterprise_IntelliFlex_VMware › SQL-Data-Definition-Language-Syntax-and-Examples › Table-Statements › CREATE-TABLE-and-CREATE-TABLE-AS › Examples › Example-Create-Tables-with-JSON-Data-Type-Columns
Example: Create Tables with JSON Data Type Columns
Loading application · Promo placeholder · Tracking Consent Teradata.com · Developers · Getting Started · VantageCloud Lake Documentation AI Unlimited All Documentation · Downloads · Community · Teradata Community Technical Medium Blogs Github Stack Overflow · Try for free
🌐
Pulse
timestored.com › data › sample › json
Download JSON Sample Data
e.g. SELECT * FROM read_json('https://www.timestored.com/data/sample/price.json'); SELECT * FROM read_json('c:\users\bill\Desktop\price.json');
🌐
Microsoft Learn
learn.microsoft.com › en-us › sql › relational-databases › json › json-data-sql-server
Work with JSON Data in SQL Server - SQL Server | Microsoft Learn
Run the scripts in this file to ... test sample queries and reports over the JSON data, index the JSON data, and import and export JSON. Here's what you can do with the scripts that are included in the file: Denormalize the existing schema to create columns of JSON data. Store information from SalesReasons, SalesOrderDetails, SalesPerson, Customer, and other tables that contain ...
🌐
JSON
json.org › example.html
JSON Example
This page shows examples of messages formatted using JSON (JavaScript Object Notation) · The same text expressed as XML:
🌐
Oracle
docs.oracle.com › en › database › oracle › oracle-database › 18 › adjsn › creating-a-table-with-a-json-column.html
Creating a Table With a JSON Column
If you are sure that your application inserts only well-formed JSON data into a particular column, then consider disabling the check constraint, but do not drop the constraint. ... CREATE TABLE j_purchaseorder (id VARCHAR2 (32) NOT NULL PRIMARY KEY, date_loaded TIMESTAMP (6) WITH TIME ZONE, po_document VARCHAR2 (23767) CONSTRAINT ensure_json CHECK (po_document IS JSON));
🌐
Jsontotable
jsontotable.net › blog › json-tools › sample-json
Free Sample JSON Data for Testing (2026)
January 20, 2026 - JSON to CSVJSON MinifierCSV to ... Markdown TableJSON to YAMLJSON to XMLJSON to TOMLJSON to INIJSON to SQLYAML to JSONXML to JSONTOML to JSONINI to JSONBSON to JSONJSON FixerJSON ValidatorJSON ViewerJSON Schema ValidatorJSON Size CalculatorHTML FormatterHTML Viewer☰ ... Download ready-to-use sample JSON files for testing APIs, prototyping frontends, and debugging. Includes users, products, GeoJSON, and API errors. ... Every developer needs reliable sample data...
🌐
Microsoft Learn
learn.microsoft.com › en-us › office › dev › scripts › resources › samples › get-table-data
Output Excel data as JSON - Office Scripts | Microsoft Learn
Note that for column names with spaces, be sure to place your key in quotation marks, such as with "Event ID" in the sample. For more information about working with JSON, read Use JSON to pass data to and from Office Scripts. function main(workbook: ExcelScript.Workbook): TableData[] { // Get the first table in the "PlainTable" worksheet.