コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > jsチュートリアル > IE7 での jquery のセレクターの問題により、fail_jquery への追加が発生する問題の解決策

IE7 での jquery のセレクターの問題により、fail_jquery への追加が発生する問題の解決策

WBOY
リリース： 2016-05-16 15:20:40
オリジナル
1305 人が閲覧しました

1、次のような HTML があります

コードをコピーします コードは次のとおりです:









2. jquery を使用して tbody の下にコンテンツを動的に入力します。コードは次のとおりです。

コードをコピーします コードは次のとおりです: $("#pending table tbody").empty().append(th).append(html);


このコードは、ie7 以下のバージョンでは問題が発生します。jquery は正しい dom 位置を見つけられず、#pending table tbody を通じてコン​​テンツを追加できません。修正が必要です。修正後のコードは次のとおりです

コードをコピーします コードは次のとおりです: $("table tbody").empty().append(th).append(html);


#pending を削除し、テーブル tbody から直接 dom を検索します
3. カスケードセレクターはよくあることですが、なぜ IE7 でこのような問題が発生するのでしょうか? それとも、div の下にネストされたテーブル tbody の HTML の記述方法が十分ではないのでしょうか?

さらに追加してみましょう:

IE で jquery append を使用する際の注意点

変更 (以下): 
$(document).ready(function() {
   $.ajax({
     url: 'Cutepage.htm',
     dataType: 'json',
     data: 'type=Init&PageSize=' + EachPage + '&PageIndex=1',
     success: function(msg) {

      //在IE7下无法显示,在火狐下没有问题。。。。。
      $('#Content').append('<tr><td width="19%"> 商品编号</td><td width="15%">商品名字</td><td width="20%">供应商商编号</td><td width="30%">商品种类编号</td><td width="10%">单价</td></tr>');

     },
    error: function(x) { alert("服务器错误代码:" + x.status); $('#Loading').hide(); }
   });
 });
ログイン後にコピー

コンテンツをパラメータにコピーするだけであり、HTML コンテンツを直接使用しないでください。 
$(document).ready(function() {
   $.ajax({
     url: 'Cutepage.htm',
     dataType: 'json',
     data: 'type=Init&PageSize=' + EachPage + '&PageIndex=1',
     success: function(msg) {

      //修改后...（这样就没有问题了,可以看出Jquery对html标签是比较敏感的，以后需要注意........） 
      var pageContent = '';  
       pageContent += '<table border="2">';
       pageContent += '<tr><td width="19%"> 商品编号</td><td width="15%">商品名字</td><td width="20%">供应商商编号</td><td width="30%">商品种类编号</td><td width="10%">单价</td></tr>';
       pageContent += '</table>';      
       $('#Content').append(pageContent );

     },
    error: function(x) { alert("服务器错误代码:" + x.status); $('#Loading').hide(); }
   });
 });
ログイン後にコピー

jQuery の append メソッドは接続などの HTML 属性をサポートしていません

今日プログラムを書いていて、

などの HTML を追加したいのですが、次のようなリンクが含まれた HTML に遭遇しました。 🎜>

コードをコピーします

コードは次のとおりです: $("#test").append("test");

Firefox では問題ありませんが、IE6、IE7、IE8 では固まり、接続せずにテキストコンテンツのみが表示されます。 Google への準備をしていましたが、Google.com にログインできなくなったことがわかりました。基本的に、Google.cn で見つけたページは収集サイトのジャンク記事でいっぱいで、とても憂鬱でした。長い間取り組んだ後、jQuery 独自の append 関数に問題があるという記事を見つけました。この関数には、HTML の解析と分析に似た独自のステートメントがありますが、リンクやタグが発生します。タグが完全に閉じられていない、またはカスタマイズされているため、jQuery がそれらを認識できません。私が持っている js ライブラリは圧縮版なので、もう頭がクラクラして老子子のソースコードを見たくないです。次のように、 a タグの要素を作成して直接挿入するだけです:

コードをコピーします

コードは次のとおりです: $(document.createElement(‘a’)).attr({"href":"#", "id": ‘#mylink’}).appendTo("#test");

次に、このリンクにコンテンツを添付します:

コードをコピーします

コードは次のとおりです: $(‘#mylink’).text("テスト");
ねえ、疲れてる？明日は時間があれば、jQuery のソース コードがどのように記述されているか見てみましょう。

関連ラベル：
append
ソース：php.cn
前の記事：AngularJsの動的ロードモジュールと依存性注入の詳細解説_AngularJS 次の記事：クリックしてテキストボックスをクリアすると、JavaScript は自動的にデフォルトのテキストを復元します_javascript スキル
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
SQL テーブルから順序なしマップの欠損値を埋める効率的な方法 (SQL/C++) 質問 現在、一意の識別子 (ID) とそれに関連付けられたデータセットを SQL テーブルから順序なしマップに読み取るシステムがあります。データセットは id1 から始まりましたが...
から 2024-04-04 11:47:44
0
1
345
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート