0

では、ここで問題です...

私はしなければならない：

  1. AJAX 呼び出しを使用して REST API 経由で html のページを取得し、
  2. そのhtmlから既知のIDを持つテーブルを抽出します（ありがたいことに、整形式です）
  3. スタイル ブロックからテーブルに関連付けられた CSS を抽出し、
  4. テーブルをマイページの div に追加し、
  5. 元の CSS を再適用する

したがって、私が興味を持っているページの部分は次のとおりです。

<style>
 #tableid td.someclass {
  ...
  }
 #tableid td.anotherclass {
  ...
  }
 [etc etc ..]
</style>

と

<table id="tableid">
 ...
</table>

したがって、上記の 1、2、および 4 のリストを確認することはまったく問題ありません。脳に負担をかけているのは 3 と 5 です。ところで、心配する外部スタイルシートはありません。すべてが単一のタグ内で取得しているページにあります。

要素全体を抽出してページに追加できると思いますが、それは面倒で、望ましくない副作用が発生する可能性があります。私がやりたいことは、#tableid に適用されるスタイリングを抽出し、それらを私の div に追加されたテーブルに適用することです。

それを行うエレガントな方法はありますか？

4

1 に答える 1

1

標準の jQuery ファインダーを使用して、ヘッダーからスタイルを取得できます。

var styles = $('head style').text();

次に、それに対して正規表現を実行します。

var tableID     = 'tableid',
    pattern     = new RegExp('#'+ tableID + '[^}]+}', 'g'),
    tableStyles = styles.match(pattern);

これにより、テーブルの ID のスタイルの配列が得られます。これらのスタイルを現在のドキュメントの head に追加できるようになりました:

$('<style/>', { text: tableStyles.join('\n') }).appendTo('head');

ユースケースによっては微調整が必​​要になる場合がありますが、これでおおよその目的が得られるはずです。

于 2012-11-12T09:51:33.780 に答える