İkilemim var.ön saklama elemanı en erişilebilir yoldur
Amacım, sayfayı oluşturmak için yapılması gereken yeniden boyama ve yeniden doldurma miktarını azaltmaktır. Şimdiye kadar kod formatında bu tür takip ederek çok elde ettik:
<html>
<head>
<title>whatever</title>
</head>
<body>
<div ID="page">
<!-- All visible page content and normal HTML here -->
</div>
<script>
document.getElementById('page').style.visibility="hidden";
// functions to manipulate dom and styles of elements go here
document.getElementById('page').style.visibility="visible";
</script>
</body>
</html>
Şimdiye kadar, bu biçim ben ancak bazı sorunları görmek Internet Explorer 7 dahil tüm tarayıcılar ile sorunsuz çalışıyor.
Sayfa işlendiğinde (özellikle ağır çekimde), tam sayfa stiller uygulanmış yükler olmadan işlenir, daha sonra javascript yürütüldüğünde tüm sayfa beyaz olur, sonra yürütme sonrasında sayfa stilleri uygulanmış olarak döner.
Şimdi yapmak istediğim, javascript etkin olan kullanıcıların, her şey tamamlanana kadar sayfayı boş görebileceği yer haline getirmesi ve ardından her şeyi bir kerede göstermesidir. Yeniden boyama ve yeniden doldurmayı en aza indirmeye çalışıyorum (sahnelerin ardındaki her şeyi yapmak istediğim gibi).
Kod # 1: İşte
Ben düşündüm ve hiçbir başarının ana kadar çalıştığı şey budur<html>
<head>
<title>whatever</title>
<style>
#page{visibility:hidden}
</style>
</head>
<body>
<div ID="page">
<!-- All visible page content and normal HTML here -->
</div>
<script>
// functions to manipulate dom and styles of elements go here
document.getElementById('page').style.visibility="visible";
</script>
</body>
</html>
Bu kod çalışmayacaktır
çünkü CSS etkin ve javascript bir göreceksiniz devre dışı olan kullanıcılar sayfa yüklendiğinde boş ekran. TÜM kullanıcıların, tarayıcıdan veya kullanılan ayarlardan bağımsız olarak içerik görmesini istiyorum.
Kod # 2: o innerHTML genelinde geldiğinde
<html>
<head>
<title>whatever</title>
<script>
var x=document.getElementsByTagName("STYLE")[0];
if(x){
x.innerHTML+="#WR{visibility:hidden}";
}
</script>
</head>
<body>
<div ID="page">
<!-- All visible page content and normal HTML here -->
</div>
<script>
// functions to manipulate dom and styles of elements go here
document.getElementById('page').style.visibility="visible";
</script>
</body>
</html>
Bu Internet Explorer 7'de yukarı hareket eder. Bu kodu denedim: Daha sonra bu kodu denedim.
Kod # 3:
<html>
<head>
<title>whatever</title>
<script>
var x=document.getElementById("WR");
if(x){
x.style.visibility="hidden";
}
</script>
</head>
<body>
<div ID="page">
<!-- All visible page content and normal HTML here -->
</div>
<script>
// functions to manipulate dom and styles of elements go here
document.getElementById('page').style.visibility="visible";
</script>
</body>
</html>
Internet Explorer 7 raporlar:
Line: 1 Char: 1 Error: Object doesn't support this property or method Code: 0
Ben window.
için document.
değişen çalıştı ve hala yukarıdaki hata alırsınız. Öneki kaldırmış ve sadece getElementById("WR")
kullandıysanız, IE7'den bir Object Expected hatası alıyorum.
Bunu düzeltmek için yapabileceğim bir şey var mı? Böylece, javascript etkinken mümkün olduğunca çok sayıda (yeni ve eski) web tarayıcısı boş ekranı görebilir ve javascript işlemeyi bitirdiğinde ekran yeniden belirir?
Ayrıca, sitemde adsense adsense sahip olduğum için ve ve </head>
arasındaki javascript miktarını sınırlamak istiyorum çünkü HTML'mde kodlarını çok düşük istemiyorum ve sayfalarımın hızlı yüklenmesini istiyorum.
getElementById yardımcı
Umut yerleştirin - küçük harf d. – James
Bu konuda haklısınız ama bu sorunu tamamen çözmüyor. Kimlik belirlemesi için getelementbyid yazarken sadece sermaye kimliğini kullanma alışkanlığım var. – Mike