1

Web ページ全体で特定のキーワードを検索し、純粋な JavaScript を使用してイタリック体にするものを作成しようとしました。私は最近、JavaScript を使って何もしようとさえしていないので (余談ですが)、なぜこれが機能しないのかわかりません。私はグーグルを試しましたが、私の問題に特に役立つものはありませんでした (私が見つけたものはすべてclass、基本的な css プロパティだけではなく、要素の を変更しようとしていました)。私が本当に知りたいのは、なぜこれが機能しないのかということだけです。これが私がこれまでに持っているものです:

<html>
<head>
    <script>
        var str = document.getElementsByTagName("*").innerHTML;
        var n = str.match(/(Nautilus|Captain Nemo)/i);
        n.style.fontStyle = "italic";
    </script>
</head>
<body>
The Nautilus was a ship run by Captain Nemo.
</body>
</html>

結果は次のようになります: The Nautilus was a ship running by Captain Nemo .

私の経験の浅いロジックでは、ドキュメント全体を大きな文字列として解析し、正規表現を使用してその文字列とキーワードを照合し、style.fontStyle.

さて、私が言ったように、私は忙しくて JavaScript や jQuery にさえ触れていませんでした。

4

2 に答える 2

5

nここでは単なる文字列です。ページ上のノードではありません。また、ページ上のノードだけが、親とは異なるスタイルを持つことができます。文字列を単純にイタリックにすることはできません。これは単なる文字列であり、それに固有の関連するプレゼンテーション情報はまったくありません。

したがって、これを行うには、次のことを行う必要があります。

  1. テキストを見つける
  2. <em>一致するたびに、テキストを要素にラップします
  3. 結果の HTML 文字列をドキュメントに挿入します

またはJSで:

// get all body content as a string
var str = document.body.innerHTML;

// find all magic words and wrap them in a <em> tag
var result = str.replace(/(Nautilus|Captain Nemo)/ig, "<em>$1</em>");

// set all body content HTML with new processed content
document.body.innerHTML = result;

ここで動作することを確認してください:http://jsfiddle.net/2px7m/

于 2013-06-22T00:37:09.650 に答える
1
var str = document.getElementsByTagName('body');
//Use g so it will be global  
var regex= /(Nautilus|Captain Nemo)/ig;

str[0].innerHTML = str[0].innerHTML.replace(regex, "<i>$1</i>");
于 2013-06-22T00:47:56.497 に答える