0

ここにこのJavascriptがあります：

function getTxt(obj) {
var first = obj.innerHTML.substring(0, obj.innerHTML.indexOf('<span class=\"item2\">'));
var second = obj.innerHTML.substring(obj.innerHTML.indexOf('<span class=\"item2\">'));
var f = first.replace(/(<([^>]+)>)/ig,'');
var s = second.replace(/(<([^>]+)>)/ig,'');
alert(first + "\n" + second + "\n" + f + "\n" + s);
}

そしてHTML：

<span class="item" onclick="getTxt(this)"><span class="item1">MyName</span><span class="item2">555-555-5555</span></span>

ほとんどのブラウザー (FireFox、Chrome、Safari、Opera) では、次の警告が表示されます。

<span class="item1">MyName</span>
<span class="item2">555-555-5555</span>
MyName
555-555-5555

予想通り。ただし、IE9 では次のように警告します。

<span class="item1">MyName</span><span class="item2">555-555-5555</span>

MyName555-555-5555

そのため、変数 "first" と "second" をまとめて var "first" に入れ、"f" と "s" をまとめて var "f" に入れます。

IE9（およびおそらく他のバージョンのIEも）が他のブラウザと同じように動作するようにこれを修正する方法があるかどうか知りたいです。

4

2 に答える 2

4

パターン マッチングinnerHTMLは特に IE の問題であり、一般的にはお勧めできません。IE は、元のページにあったものと同じ HTML を返さないことがよくあります。多くの場合、引用符の再引用または削除、属性の順序の変更、大文字と小文字の変更などを行います。IE は、元のページにあったものを返すのではなく、明らかに HTML を再構成しています。そのため、IE で innerHTML を確実にパターン マッチさせることはできません。おそらく一致できる特定のもの (タグの開始) がいくつかありますが、属性が特定の場所にあることや、特定の形式を持つことは期待できません。

IE を使用している場合はconsole.log(obj.innerHTML)、私が話していることがわかるでしょう。それは異なって見えるでしょう。

より堅牢な解決策は、DOM 関数を使用して特定の要素をナビゲートするか、CSS セレクターを使用して特定のオブジェクトを見つけてから、単一の特定の要素の属性または innerHTML を変更することです。HTML を自分で解析するのではなく、DOM ナビゲーションに適切な要素を見つけてもらいます。

必要な HTML の前後のサンプルを提供し、何を達成しようとしているのかを説明すると、HTML の解析ではなく DOM 操作で作業を完了できるようになる可能性があります。

どのセレクター ライブラリを使用できるか、またはどのブラウザーを対象としているかはわかりませんが、jQuery では次のように実行できます。

function getText(obj) {
    return $(obj).find(".item1").text();
}

プレーンな JavaScript、IE8 以降、およびその他すべての最新のブラウザーでは、次のように使用できます。

function getText(obj) {
    return obj.querySelectorAll(".item1").innerHTML;
}

IE6 または IE7 に戻す必要がある場合は、Sizzle ライブラリを取得してクエリに使用することをお勧めします。

function getText(obj) {
    return Sizzle(".item1", obj)[0].innerHTML;
}
于 2012-07-17T20:30:18.670 に答える
0

Internet Explorer の「Quirky モード」が原因で発生します。これは非常に面倒ですが、IE DevTools で無効にするか、次のメタタグをページに追加することで無効にできます。

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
于 2012-07-17T20:36:49.333 に答える