DOM olmayan jQuery AJAX ayrıştırmasındaki görüntülerin yüklenmesini engelle

Question

ikincil bir sayfada HTML kapmak ve ayrıştırmak için jQuery ajax isteğini kullanıyorum .. Hem Chrome hem de FF'nin Ağ paneline baktığımda, bunun yükleneceğini fark ettim oradan da görüntüler - ama sadece 'başarılı' geri aramada $ (data) kullanarak sonucu yüklediğimde.

İçerik, şu anki sayfanın DOM'sine yüklenmemiş, bu yüzden bunun neden gerçekleştiğini gerçekten kafam karışmış durumdayım.

Ancak her halükarda, bunun olmasını önlemek için bir yol var mı? Sonuçtan bilgi almam gerekiyor, ancak ana DOM'a asla vurmuyor. Görüntüyü yüklemeden önce görüntü yüklemeyi engelleyen komut dosyaları mı yoksa yüklü öğeye karşı hiç ateş etmeyecek mi? Bunun bir kullanıcı uygulaması için olduğunu unutmayın, bu yüzden hedef HTML üzerinde tam kontrol sahibi değilim.

Teşekkür ederiz!

Answer 1

nedeni bu oluyor kısa sürede bir src özelliğiyle bir görüntü oluştururken, o görüntü yüklenmiş olmasıdır neden:

Bu

HTML görüntüler için düzenli ifade olduğunu. Örneğin: Bu DOM eklenir önce

var image = document.createElement('img'); 
image.src = 'example.png'; 

görüntü, tarayıcı tarafından yüklenen hemen olduğunu. Bu aslında genellikle bir optimizasyon. Örneğin, daha sonra kullanılacak görüntüleri önceden yüklemek için kullanılabilir.

jQuery, HTML dizesini bir DOM yapısına dönüştürdüğü için, yukarıdaki snippet'in yaptığı gibi, img öğesi oluşturur. Görüntü öğesi var olduğunda, DOM'a eklenmeden önce bile, sunucu sunucudan yüklenir.

sen eklemeden önce basit çözüm HTML tüm img etiketlerini kaldırmak olacaktır: bu bir seçenek değilse

html = html.replace(/<img\b[^>]*>/ig, ''); 

ve img unsurları ihtiyaç yapmanız src özelliklerini yeniden adlandırmak olabilir başka bir şey yoksa veya ihtiyacınız yoksa öznitelikleri kaldırın.

Answer 2

Tüm resim etiketlerini, döndürülen dizeden DOM'nize yüklemeden önce bulabilir ve silebilirsiniz.

<[iI][mM][gG][a-zA-Z0-9\s=".]*((src)=\s*(?:"([^"]*)"|'[^']*'))[a-zA-Z0-9\s=".]*/*>(?:</[iI][mM][gG]>)* 

Answer 3

Sorununuz, yanıt metnini bir jQuery öğesine ($(data)) yüklüyor. Bu aslında "ana" DOM'a eklemeseniz bile yüklenen içerik için bir DOM oluşturur.

Yapmanız gereken şey, bu metni jQuery'den uzak tutmak ve regex'i kullanarak metin düzeyinde işleme koymak veya bir XML belgesine yüklemek ve mevcut çeşitli XML yöntemleriyle sorgulamaktır.

Eğer burada okumayı deneyebilirsiniz jQuery kullanmak ve yükleme durdurmak istiyorsanız

: Aslında diğer etiketler arasında olanlar Resim etiketlerini (gerektiğini Yanıtınız için Javascript: Cancel/Stop Image Requests