0

私は Java Script の初心者で、C++ の経験しかありません。以下の質問に対する答えをずっと探していましたが、不足しています。どなたでも喜んでご支援いただけると幸いです。

ボタンをクリックするだけでテーブル行をコピーして TR /TR タグを削除し、それを P /P に置き換えて変数に保存し、新しいフォーマットを作成できる JavaScript を作成しようとしています。テーブルセルなしでコピーアンドペーストに適しているか、その情報をクリップボードにコピーして、簡単に単語に貼り付けることができます。現在、表の行を複製することはできましたが、タグ間のデータを解析して表の書式を削除し、段落の書式を追加することはできません。

ありがとうございました。

これは、私がやりたいことの最初のステップを完了する小さなデモ プログラムです。セクションのボックスをチェックして切り捨てをクリックすると、チェックされていないボックスが消えます。私が今する必要があるのは、これらのチェックボックス内のテキストをクリップボードにコピーするか (テキストのみで、それぞれが段落になっています)、コピーして貼り付けやすい形式で解析して印刷することです。

脚本:

  var section0 = 6; //# of Basic Conditions
  function cloneTable() {
    for(var i = 0; i < section0; i++) //Basic Conditions
    {
      if(i == 0 || document.getElementById("check00-" + i).checked) {
        var row = document.getElementById('condition00-' + i); // find row to copy
        var table = document.getElementById("table2"); // find table to append to
        var clone = row.cloneNode(true); // copy children too
        clone.id = "newID"; // change id or other attributes/contents
        table.appendChild(clone); // add new row to end of table
      }
    }
    var elem = document.getElementById('table1')
    elem.parentNode.removeChild(elem);
  }

マークアップ:

<table width=890 style='table-layout:fixed'>
  <col width=20>
    <col width=30>
      <col width=840>
        <tbody id="table1">
          <tr id="condition00-0">
            <td width=20 valign="top">
              <input type="checkbox" id="check00-0">
            </td>
            <td colspan="2" align="left"><font size="6" face="Arial"><a  name="Bookmark1">Header</a></font>
            </td>
          </tr>
          <tr id="condition00-1">
            <td valign="top">
              <input type="checkbox" id="check00-1" onclick="MainTitles('check00-0')">
            </td>
            <td valign="top"><font size="4" face="Arial">1.</font>
            </td>
            <td align="left" style="word-wrap: break-word"><font size="4" face="Arial">Text section1</font>
            </td>
          </tr>
          <tr id="condition00-2">
            <td valign="top">
              <input type="checkbox" id="check00-2" onclick="MainTitles('check00-0')">
            </td>
            <td valign="top"><font size="4" face="Arial">2.</font>
            </td>
            <td align="left" style="word-wrap: break-word"><font size="4" face="Arial">Text section 2</font>
            </td>
          </tr>
          <tr id="condition00-3">
            <td valign="top">
              <input type="checkbox" id="check00-3" onclick="MainTitles('check00-0')">
            </td>
            <td valign="top"><font size="4" face="Arial">3.</font>
            </td>
            <td align="left" style="word-wrap: break-word"><font size="4" face="Arial">Text section 3</font>
            </td>
          </tr>
          <tr id="condition00-4">
            <td valign="top">
              <input type="checkbox" id="check00-4" onclick="MainTitles('check00-0')">
            </td>
            <td valign="top"><font size="4" face="Arial">4.</font>
            </td>
            <td align="left" style="word-wrap: break-word"><font size="4" face="Arial">Text Section 4</font>
            </td>
          </tr>
          <tr id="condition00-5">
            <td valign="top">
              <input type="checkbox" id="check00-5" onclick="MainTitles('check00-0')">
            </td>
            <td valign="top"><font size="4" face="Arial">5.</font>
            </td>
            <td align="left" style="word-wrap: break-word"><font size="4" face="Arial">Text Section 5</font>
            </td>
          </tr>
        </tbody>
</table>
</div>
<table width=890 style='table-layout:fixed'>
  <col width=20>
    <col width=30>
      <col width=840>
        <tbody id="table2"></tbody>
</table>
<input type="button" onclick="cloneTable()" value="Truncate" />

JSFiddle: リンクのテスト

4

1 に答える 1

0

行に DOM 要素としてアクセスし、各セルをループして、innerHTML を解析して値を取得できます。

この投稿を参照してください: HTML ページのテーブルの各列の合計を動的に計算する方法は?

例:

function strip(html) { // This is a very popular + useful technique.
   var tmp = document.createElement("DIV");
   tmp.innerHTML = html;
   return tmp.textContent||tmp.innerText;
}

var tbl = document.getElementById('my-table');
var rows = tbl.rows;
for (var i = 0; i < rows.length; i++) {
   var cells = rows[i].cells;
   for var j = 0; j < cells.length; j++) {
      alert(strip(cells[j].innerHTML));
   }
}
于 2013-03-13T04:59:17.113 に答える