IFrame'ler (HTML) eski mi? [kapalı]


92

Bununla ilgili çelişkili mesajlar almak, umarım değildir. Milyonlarca site onları kullandığı için desteğin duracağını hayal bile edemiyorum.

Bununla ilgili bazı ek sorular:

  1. Neden bu etiketi aşamalı olarak kaldırmalılar?
  2. Bunun için herhangi bir alternatif var mı?


herhangi bir güncelleme var mı_ Bu soru 2009 yılında sorulmuş ve cevaplanmıştır; şimdi 2020.
Kolob Canyon

Yanıtlar:


54

Benim düşünceme göre W3C, Strict HTML ve XHTML doctype'lerinden damping iframe'lerde silahı atlattı. Teoride, bu <object>öğeyi belgenize yabancı nesneler eklemek için kullanırsınız , ancak tarayıcı farklılıkları ve sınırlamaları, bunu birçok geliştirici için başlangıç ​​dışı hale getirdi. Çok daha pragmatik HTML 5 ile (ki bu hala bir taslaktır), iframe'ler geri döndü ve hatta iki yeni niteliğe sahip: seamlessve ilgi çekici sandbox.


Harika, umarım tarayıcılar AJAX dosya yüklemelerini desteklemeye başlar, bu yüzden bunun için iframe veya flash kullanmamıza gerek kalmaz.
Xeoncross

@Xeoncross Firefox ve chrome şunları yapar: developer.mozilla.org/en/Using_files_from_web_applications
jches

2
Güncelleme: semless özniteliği html5'ten kaldırılmıştır. Bakınız: caniuse.com/#feat=iframe-seamless
Gabe

76

İçin destek <iframe>hala HTML 5'te var, bu yüzden bunun yakın gelecekte değişeceğini düşünmüyorum.

Diğer sorularınızı cevaplamak için:

  1. <iframe>s (genel olarak çerçeveler olarak) çoğu zaman kullanıcı dostu değildir:
    • Çerçevedeki içeriğe bir URL aracılığıyla kolay erişime izin vermezler (en azından çerçeve dışındaki içeriği kaybetmeden).
    • Çoğu "teknofobik" kullanıcı çerçevelerden rahatsız olur.
    • Tarayıcılar için oluşturmanın daha yavaş olduğunu bildiğim kadarıyla
  2. Alternatifler arasında dinamik sayfa oluşturma (SSI, PHP, Rails vb.) Ve örneğin bir sayfanın içeriğini değiştirmek için JavaScript / AJAX kullanma yer alır. <div>

Açık olmak gerekirse: <iframe>Bir arayüz öğesi olarak bahsediyorum . Örneğin, Google Mail gibi diğer şeyleri yüklemek için gizli bir öğe değildir.


29
Google'ın iç çerçeveleri son derece özel amaçlar için kullandığı noktaya +1.
cgp

25

İç çerçeveler , sayfa düzeni için kullanılmıyor. Bunları asla iyi CSS düzeni yerine kullanmayın, hatta tablo tabanlı düzen daha iyidir.

İframe kullanmak için iyi nedenler şunlardır:

  • reklamlar : örneğin adwords bu tekniği kullanır, kapsüllemek için iyidir - reklam css sayfanızı yok etmez.
  • gizli iframe : izleme, ajax alternatifi vb. gibi yüzlerce kullanılabilir şey için kullanılabilir.

35
*** adwords için iframe KULLANMAYIN, bu bir TOS ihlalidir. *** scribd.com/doc/97655/…
cgp

37
altCognito: AdWords iframe kullanıyor, ben değil :) Adword iframe'i başka bir iframe'e koymak istemedim.
Düşünür

7
Bunun yaygın bir hata olduğunu biliyorum (dolayısıyla tüm makaleler), bu yüzden insanların ne dediğini anladığından emin olmak için bunu işaretlemek istedim.
cgp

5
İç çerçeveler, başka bir etki alanından sunulması gereken karmaşık içerikler eklerken bir zorunluluktur ve geçerli sayfanın CSS veya JS koduyla değiştirilmemelidir.
vsync

4
Bahsettiğiniz şeyin iframe'lerle hiçbir ilgisi yok. Önemli olan - İç içe geçmiş, harici bir göz atma bağlamı getirmek için bir iframe kullanırsınız. Bunu 'sayfa düzeni' için kullanmazsınız. İç içe geçmiş bir göz atma bağlamına ihtiyacım olursa - bunun yerine nasıl "iyi CSS düzeni" kullanırım? Mantıklı değil.
Chris B

24

IFrame'ler eski değildir, ancak kullanım nedenleri nadirdir.

İframe'leri kullanma nedenleri:

  • Başkalarının eşyalarını diğer alanlardan ayırmak için harikadır, ancak sorunsuz bir şekilde bütünleşmez. (stil sayfaları, javascript vb ...)
  • Multimedya entegrasyonu, embed etiketinin yerine bazen bir iframe aracılığıyla daha kolay yapılabilir.
  • Gerçekten, sesler ve geçmiş yönetimi için kullandıkları gmail vakası gibi gerçekten özel vakalar.

Ayrıca, iframe'lerin kaldırılmasına gerek olmadığını, bunun gerekli bir etiket olduğunu ve bir süre buralarda olacağını da yanıtlayacağım.


12

Muhtemelen çoğu durumda işe yarayan IFrame'in yerine Nesne etiketini öneren birçok forum gördüm.

Örneğin, bir IFrame'de gösterilen bir PDF'im vardı (çünkü sayfada yalnızca PDF'nin yanı sıra göstermemiz gereken başka şeyler de vardı) ve bunu Object kullanarak iyi bir şekilde görüntüleyebildim.

Neydi:

<iframe id="confirmed_pdf" class="current_pdf" src="/prescriptions/show_pdf?id=123" height="570" width="480"></iframe>

Oldu:

<object id="confirmed_pdf" class="current_pdf" data="/prescriptions/show_pdf?id=123" type="application/pdf" height="570" width="480">
  <p>[Show this message if displaying the PDF did not work]</p>
</object>

Ancak Object, sayfanın YALNIZCA PDF bölümünü yazdırabilme gereksinimini karşılayacak uygun bir yedek değildi.

Bir IFrame, sayfadaki kendi penceresi gibidir (temelde bir pencere içindeki pencere) ve pencere nesnesini aldığınızda, üzerinde .print () öğesini çağırabilirsiniz, örneğin:

jQuery("#confirmed_pdf").contentWindow.print();

IFrame'in bir contentWindow özelliği vardır, bu, yalnızca bu bölümü yazdırmayı mümkün kılan şeydir. Nesne contentWindow özelliğine sahip değildir, bu nedenle yalnızca sayfanın bölümünü yazdırmanın bir yolu yoktur.

Öyleyse, bir şeyi görüntülemek için sadece IFrame kullanıyorsanız, bunun yerine kullanılabilecek Object gibi başka etiketler var gibi görünüyor. Ancak, IFrame'in içeriğiyle belirli şekillerde etkileşime girmeniz gerekirse, IFrame gerekli olabilir.


7

IFrame'ler AJAX ile çok kullanılır. Örneğin GMail, inandığım dokuz gizli IFrame kullanıyor.


5
Beş iframe sayıyorum. Biri gizli değil ve aslında, neredeyse tüm manzara bunlardan biri. IFrame'ler Ajax ile tipik olarak kullanılmaz (zaten ana çerçevelerin hiçbirinde kullanılmaz). Gmail, aşağıdakiler gibi şeyler için iç çerçeveler kullanıyor: Geçmiş izleme, ses (garip) ve bir tür tuval çizimi.
cgp

Birkaç yıl önce okuduğum bir makaleye bakıyordum.
John Topley

7

IFrame'ler ölmedi, ancak Çerçeve Kümesi / Çerçeveler ölüyor.

IE'nin (IE7 / IE8) son 2 sürümünde Çerçeveleri yakınlaştırmak (IFrame'ler değil) feci sonuçlar yarattı.

Elbette IFrame'leri kullanın, ancak IMHO Çerçeve Kümelerinden / Çerçevelerden uzak durun.


5

Önceki şirketimde, müşterilerin kendi web sitelerine entegre edebileceği, barındırılan bir uygulama sağladık. Bazen, bunu yapmak için bir IFrame kullanırlar ve barındırılan sayfamızı mevcut tasarımlarına sığdırırlar. Bazen bu bile sorunsuz bir şekilde yapıldı (yani, IFrame'in kenarlıkları veya kaydırma çubukları yoktu, yalnızca sayfanın bir parçası gibi görünüyordu). Bunun etiketin iyi bir kullanımı olduğunu düşündüm.


Iframe'ler, müşterilerin web sitelerine kendi stilinize ve kullanıcının kodunun bozulmayacağı Javascript'e sahip olmanız gereken şeylerle başa çıkmak için bir zorunluluktur. CSS kolaylıkla geçersiz kılınabilir ve JS bazen (nadir durumlarda) çakışmalara neden olabilir, bu nedenle "Kapalı Sistem" yaklaşımı için en iyisidir.
vsync

5

Bazı durumlarda son derece yararlı olabilirler, ancak bunlar sınırlıdır. Özellikle, ortak işlevselliği birden çok siteye yerleştirme.

Örneğin, birkaç İskoç malları e-ticaret sitesini işleten bir müşterim var. Bunun bir parçası olarak, soyadınızdan veya seçtiğiniz tartanlardan olası klan adlarını bulmak için birkaç basit uygulama geliştirdik (isterseniz kıkırdayın, ancak ekose kumaşlar ekonomimiz için yılda 700 milyon dolar değerindedir). Bunun arkasındaki veritabanı şaşırtıcı derecede büyüktür (çekirdek adlarda ve ekose tablolarda yaklaşık on bin satır) ve oldukça düzenli olarak güncellenir.

Bu nedenle, bir web sitesinde çalışacak şekilde ayarlanmış uygulamalara sahibiz ve daha sonra bunları bir iframe kullanarak diğer web sitelerimize yerleştirdik, böylece basit javascript parametresi geçişine olanak tanıyarak, bir tartan veya klan seçimini yerleştirme sitesinde işlevsellikle bütünleştirebiliriz. İframe, son kullanıcı için tamamen kesintisiz görünmesi için noborder olarak ayarlanmıştır.

Elbette bunu yapmanın başka yolları da olabilir, ancak bir iframe'in kullanımı basit ve sağlamdır. Ve kesinlikle modası geçmiş değil.


5

Kurslar için atlar ... <iframe> ler her şey gibidir ... doğru amaç için doğru araçlardır; yanlış amaç için çirkin bir hack veya daha kötüsü.

Ajax'ta <div> ler genellikle daha uygun kaplardır. Bazı yerlerde, <iframe> 'lerin desteklediği şekliyle, kendi sitenizin bir parçası olarak harici içerik yayma etkinliği uygunsuzdur.

Ekibim geçen gün kullanıcılara HTML e-posta geçmişlerine erişim sağlamak için ideal bir yol olarak bir <iframe> kullandı - e-postalar web şablonumuza kolayca eklemek istediğimiz tam <html> sayfalarıydı. <iframe> ler bu verileri sunmak için kesinlikle mükemmeldi] '.

Öte yandan, siteye geri gönderilen kullanıcı tarafından gönderilen içerikte <iframe> ler hemen hemen her zaman kaldırılmalı veya devre dışı bırakılmalıdır, çünkü bu bağlamda bunlar büyük bir güvenlik sorunudur.


4

Google gadget özelliği şu anda iframe'lere dayanmaktadır: http://code.google.com/apis/gadgets/docs/spec.html

Şu anda, birden çok etki alanından / sağlayıcıdan çekilen javascript uygulamaları için yalıtım sağlamanın tek basit yoludur.

Ayrıca, kişilerin web sitelerine üçüncü taraflardan yerleştirdiği widget'ların çoğu iframe kullanır.

Kendi dezavantajları olsa da, iframe'ler web'deki yaygın sorunlara pragmatik bir çözüm sağlar. Bir süre daha buralarda olacaklarını tahmin etmem gerek.


2

Normal çerçeveler ihtiyacım olanı yapamadığı için bir siteyi normal bir Çerçeve Kümesinden Iframe'lere değiştirdim. Kod tabanının geri kalanıyla hiçbir soruna neden olmadı.


2

Uyumluluk ve Güvenlik sorunları sizi Iframe'leri kullanmaya da yönlendirebilir; Alışveriş sepetleri, bazı web sayfalarının bir parçası olarak, bir şeylerin ödeme işleme tarafının tüm sorumluluğunu üstlenmeden bir alışveriş sepetini görsel olarak dahil etmek istediğinizde, IFrame tabanlı popüler uygulamalardır.

E-Ticaret öğelerimizi ve müşterilerimizi anahtar teslimi gibi entegre etmek için genellikle bir Iframe sunuyoruz.


0

Sadece .net web formlarının inceliklerini kapsamak için açılır menülerden, listelerden, içerik bloklarından vb. Her şey için çerçeve kullanan bir şirket için çalışıyorum. Uygulama çok yavaştır ve yalnızca IE üzerinde çalışır. Bunu yapma.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.