2

Scriptish を使用して、フォーラムで迷惑なフォントを置き換える JavaScript を作成しようとしています。コード自体は問題なく動作しますが、実行するとテキスト エディターも強制終了されます。ボタンとバーはまだありますが、テキストボックスはなくなりました。使用された正規表現には一致がありません。

document.body.innerHTML = document.body.innerHTML.replace(/font-family:georgia, serif/g, 'font-family:arial, tahoma');

私document.body.innerHTML = document.body.innerHTML;は何もしませんが、本体をそれ自体に置き換えてみました。これでも、エディターが台無しになります。私もWYSIWYGエディタに変更しようとしましたが、それさえ消えてしまいます。

私はその Web サイトの管理者ではなく、不要なフォントは誰でも使用できます (すべての投稿でそれらを使用する人もいます)。それらを画面に表示したくないだけです。

私の推測では、Scriptish は Web サイトのスクリプト作成に干渉していると思いますが、どうすればこれを確認できますか?

4

3 に答える 3

2

ピートのヒントで、私はこの解決策をかなり早く見つけました。これにより、すべてのユーザー定義フォントが入力内容で上書きされます。

var css = document.createElement("style");
css.type = "text/css";
css.innerHTML = "span[style] { font-family:arial, tahoma !important }";
document.body.appendChild(css);

ご協力いただきありがとうございます。

于 2015-06-24T08:58:17.453 に答える
1

すべてのノードを見つけて、ループ内で font-family を変更または削除できます。

var list = document.querySelectorAll("[style]");

for (var i = 0; i < list.length; i++) {
  if (list[i].style.fontFamily.indexOf("Arial") > -1)
    alert("I is Arial!");
}
<span style="font-family: Arial">Blaaa</span>
<span style="font-family: Verdana">Blaaa</span>
<span style="font-family: Tahoma">Blaaa</span>

innerHTMLドキュメント内のすべてのバインドが壊れるため、使用しないでください。

于 2015-06-24T09:03:09.527 に答える
0

JavaScript (IE8+) 内では、 document.querySelectorAll(selector)を使用できます。このセレクターは、高度な jQuery フィルタリング メソッドを除いて、実際には jQuery と CSS で実行できるほとんどすべてのことを実行します (それも 100% 確実ではありません)。

とにかく、画面に奇妙なフォントを表示したくない場合は、これを行うことができます。 document.querySelectorAll('[font-family^="serif-"]')これは、「属性がで始まる要素を探し、serif-そこから操作できるノードリストを取得することを意味します。

属性セレクターの完全なドキュメントについては、こちらを参照してください。

MDN から取得

[attr] attr という属性名を持つ要素を表します。

[attr=value] 属性名が attr で、その値が正確に「値」である要素を表します。

[attr~=value] attr という属性名を持つ要素を表し、その値は空白で区切られた単語のリストであり、そのうちの 1 つは正確に「値」です。

[attr|=value] 属性名が attr の要素を表します。その値は、正確に「値」にすることも、「値」で始まり、その直後に「-」を付けることもできます (U+002D)。言語サブコードの一致に使用できます。

[attr^=value] 属性名が attr で、値の前に「value」が付く要素を表します。

[attr$=value] 属性名が attr で、値の末尾に「value」が付いた要素を表します。

[attr*=value] 属性名が attr で、その値に部分文字列として文字列「value」が少なくとも 1 回出現する要素を表します。

これらのセレクターはあなたの場合に役立つはずです。これらを組み合わせdocument.querySelectorAll(selector)て、楽しい時間を過ごすことができます ;)

編集

したがって、ここで行う必要があることについてさらに詳細を追加するには、次のようにします。

  • 問題のあるフォントを使用してすべての要素を取得しますdocument.querySelectorAll()
  • forコンストラクトを使用してコレクション内の要素をループします
  • ループ内で、element[i].style.fontFamily = 'new-family'すべてのフォントを置き換えるために使用します。

スタイルの変更に関する完全なドキュメントについては、こちらを参照してください

あなたがしたいことは、最初に問題のある要素を見つけることです。たとえば、迷惑なフォントの要素です。これらが常にこれを含むインライン スタイルを持っている場合はfont-family難しくありません。

homebrew snippet (untested) //インライン [style] 属性に font-family が含まれる要素を取得

//loop all the elements to replace the font
for (var i = 0; i < annoyingFontElements.length; i++) {
    //actually do the replacing
    annoyingFontElements[i].style.fontFamily = 'nice-font'
}
于 2015-06-24T08:41:57.850 に答える