JavaScriptからテーブルからデータを抽出

Question

healcode私のサイトにmindbodyのデータを表示しています。私はヒーローコードウィジェットを使用していますが、問題は私だけがCSSを変更し、タッチできないことですHTMLウィジェットは私のニーズを非常に制限しているテーブルのデータを配信します。私は、HTML構造を作成するか、少なくとも現在の構造を操作できるようにしたい。

CSSやJavascript、あるいはその両方を使用して、テーブルからコンテンツとデータを抽出し、自分の選択したHTML構造を再作成することはできますか？

Answer 1

確かにJavaScriptでこれを行うことができますが、これはかなり広い質問です。あなたは操作する必要のあるテーブル要素を取得する必要があります（たとえば、IDがsomeIdの場合はvar table = document.getElementById('someId');を使用する必要があります）。table.innerHTML（おそらく良い出発点）またはDOM APIを使用する子どもを操作します。 this page（「パラメータ値」の表）ブラウザのコンソールで試すことがあります。

// first table with the "w3-table-all notranslate" class 
var table = document.getElementsByClassName("w3-table-all notranslate")[0]; 

table 
    .children[0] // will get the tbody element 
    .children[1] // will get the second row from the tbody element 
    .children[0] // will get the first (colomn) cell in the second row 
    .innerHTML; // will show you html contents of the cell in the console 

// change the cell contents 
table.children[0].children[1].children[0].innerHTML = "<b>I've changed this stuff!</b>"; 

// you may also want to remember rows/cells: 
var row = table.children[0].children[1]; 
var cell = row.children[0]; 

そして、基本的には、それはそれです。