ページ上の段落オブジェクトの配列に含まれる長い文 (たとえば、50 語以上) を強調表示したいと思います$("#content p")。これに対処する方法がわかりません。
最初はすべての文を強調表示しようとしましたが、HTML タグが含まれていると問題が発生しました (ネット上の強調表示コードの例は、個々の単語のみのようで、子ノードは考慮されていません)。文を分割するのが難しいことは承知しています。使いたい.!? スペースの後に大文字が続くか、何もない (つまり、段落の終わり) かのいずれかです。
ヘルプ/アドバイスをお寄せいただきありがとうございます。
あなたが言ったように、あなたがそれらすべてをキャッチするつもりはないという事実を考えると、正しく理解するのは難しいでしょう、私は次のような単純なものに固執します:
var regex = \[^.!?]{50,}[.!?]\;
巧妙になりすぎると、エッジケースのコーディングに、合理的に必要だと思うよりも多くの時間を費やすことになります。
クライアント側でこれを行うのが最善かどうかはわかりません。段落をサーバーに送り返して作業を行うことを検討します。しかし、どちらの方法でも作業は同じでなければなりません。
最初に段落のすべてのコンテンツを取得し、DOM のいくつかのノードにある可能性のあるすべてを取得するようにしてください。( Read This ) 次に、分割された文字を探し、HTML エンティティにある間は無視するパーサーを作成する必要があります。
例として、. href 属性内の は無視し、分割しないでください。解析を行っている間、単語数を維持したり、スペースの作業を中断したりできます。各文を、文全体と単語数を含むオブジェクトにします。したがって、これらのオブジェクトを段落を表す配列にプッシュできます。完了したら、配列を反復処理し、単語数がしきい値に達した場合に CSS で強調表示するために、任意の文をスパンでラップできます。
主な問題は、次のような 2 つの文の一部であるタグです。
I'm typing <b> in bold. NOW!</b>
私が話したことはそれを扱っていませんが、それをサポートするために後でパーサーをより複雑にすることができます。
それでは、単語のカウントと正しい場所での分割を処理するステート マシンを使用して、すべての文字を解析する私のとりとめのない解析の概要を説明します。分割時に、収集したデータを配列に追加します。完了したら、配列を反復処理して、新しくラップされた文を出力します。
これを行うには、各段落 ( node.html()) の HTML を取得し、すべての HTML タグを同じ数のスペースに置き換える必要があります。これはかなり単純明快で、開き角かっこと最初の閉じかっこを探すだけで済みます。タグ内のピリオドや単語が残りのアルゴリズムを混乱させないようにするため、またタグ自体が単語としてカウントされないようにするために、まずこれを行う必要があります。
ピリオドに基づいてテキストを分割し、その後に空白がまったくないか、またはいくらでも文を取得します。元の文字列内の文の開始位置と終了位置を追跡できるように、一致する正規表現を使用してこの分割を手動で実行する必要があります。
次に、各文を空白で分割し、空白だけで構成される配列から「単語」を削除します。これで文の長さが分かります。制限を超えている場合は、元の HTML 文字列の文の開始位置と終了位置に適切な HTML を挿入します。後続の長い文の正しい開始位置と終了位置を見つけることができるように、追加した余分な HTML の量を追跡する必要があります。
これはおそらくかなり遅い解決策であり、醜いものでもありますが、コーディングは非常に簡単なはずです。
すべてのテキストを文字列に読み取り、それを解析して、文字を数え、すべての .!? 文字を見つけます。解析ループでは、< と > も探します。ここで、< は「別の > が見つかるまですべて .!? を無視する」ことを意味します。次に、.!? 文字を見つけるたびに、最後の文字からの長さをチェックし、十分な長さであれば、開始点と終了点のインデックスを配列などに保存します。
すべてが完了したら、最初の文字列から新しい文字列に部分文字列を移動する別のループを作成し、すべての「長い文」の前にハイライト タグを追加し、最後に end-highlight-tag を追加します。先に進みます。
終わったら、新しい弦を元の場所に戻します...