Get data from EXTERNAL HTML Table to an array

Question

I need to save some data from a html table (an external site) to a json file to work with the data.

Is there a way to access a table from an external HTML site (not like in my code example)?

Is there a way to create a json file from the data (I need the columns in an array or object?) and save it somehow so I can work with it?

The current output of data i hardcoded into my site is: (I need to access from an external site)

https://i.gyazo.com/8bea34c222d8bba99c8705c8ca73c1a3.png

    <table>
      <tr>
        <th>A1</th>
        <th>A2</th>
        <th>A3</th>
        <th>A4</th>
        <th>A5</th>
      </tr>
      <tr>
        <td>B1</td>
        <td>B2</td>
        <td>B3</td>
        <td>B4</td>
        <td>B5</td>
      </tr>
      <tr>
        <td>C1</td>
        <td>C2</td>
        <td>C3</td>
        <td>C4</td>
        <td>C5</td>
      </tr>
      <tr>
        <td>D1</td>
        <td>D2</td>
        <td>D3</td>
        <td>D4</td>
        <td>D5</td>
      </tr>
      <tr>
        <td>E1</td>
        <td>E2</td>
        <td>E3</td>
        <td></td>
        <td>E5</td>
      </tr>
      <tr>
        <td>F1</td>
        <td></td>
        <td>F3</td>
        <td></td>
        <td></td>
      </tr>
    </table>

    <script>

    var columns = $('tr').first().children().map(function(i){
    return [
        $('tr').map(function(){
            return $(this).children().eq(i).text()
        }).get()
        ]
    }).get();

    localStorage

    console.log(columns)

You can run your Javascript on someone else's site with the browser console, or a userscript, if that's what you're asking..? From there, you can do anything. If the other site has CORS restrictions (like most sites do), you won't be able to directly connect to it client-side, though — CertainPerformance, Apr 14 '19 at 19:51
Let's have a look to this example : https://www.quora.com/How-do-I-get-data-from-an-external-URL-by-using-JSON-and-display-it-in-an-HTML-table — sylvain, Apr 14 '19 at 20:25
Possible duplicate of [Grab content from another website daily](https://stackoverflow.com/questions/14388709/grab-content-from-another-website-daily) — Heretic Monkey, Apr 14 '19 at 20:48

sylvain · Answer 1 · 2019-04-15T07:26:02.637

In your current html/js file :

$.ajax({
        type: "POST",
        dataType: "json",
        url: "save_json_on_server.php",
        data: {my_columns:my_columns},
        success: function(data){
            alert('saved');
        },
        error: function(e){
            console.log(e.message);
        }
  });

save_json_on_server.php : To get the ajax in php in order to write a file on the server.side :

<?php
    $myjson_file = "my_columns_file.json";
    $fh = fopen($myjson_file, 'w') or die("can't open file");
    $str_data = $_POST["my_columns"];
    if(! fwrite($fh, $str_data ))
         die ("Failed to fwrite in the file : $myjson_file");
    fclose($fh);
    echo "success";
 ?>

To get your json file from an external website using PHP :

<?php

$external_url = 'https://jsonplaceholder.typicode.com/posts';
$external_data = file_get_contents($external_url); 
$myjson_obj = json_decode($external_data);

?>

<table>
<tbody>
<tr>
  <th>id</th>
  <th>name</th>
  <th>description</th>
</tr>
<?php foreach ($myjson_obj as $one_obj) : ?>
    <tr>
        <td> <?php echo $one_obj->id; ?> </td>
        <td> <?php echo $one_obj->title; ?> </td>
        <td> <?php echo $one_obj->body; ?> </td>
    </tr>
<?php endforeach; ?>
</tbody>
</table>

Get data from EXTERNAL HTML Table to an array

1 Answers1