Gezgin, ekran ve konum nesneleri - Tarayıcı ve ekran çözünürlüğü bilgileri - Mevcut URL. Tarayıcı penceresi özelliklerini programlama Javascript penceresi gezgin nesnesi tarayıcı adı

Tarayıcı adres alanı genellikle pencerenin üst kısmında bulunur ve yüklenen belgenin URL'sini görüntüler. Kullanıcı manuel olarak bir sayfaya gitmek isterse (URL'sini yazın), bunu adres alanına yapar.

Şekil: 4.2.

Emlak yer pencere nesnesinin kendisi bir sınıf nesnesidir yer... Sınıf yersırayla, sınıf nesnelerini de içeren URL sınıfının bir alt sınıfıdır Alan ve Link. Nesneler yer URL şemasının herhangi bir kısmına erişmenize izin vererek, URL nesnelerinin tüm özelliklerini devralır. URL nesne sınıfı hakkında daha fazla bilgi için, bkz. Köprü Metninde Gezinmeyi Programlama.

JavaScript ile geriye dönük uyumluluk için dil, özelliği de destekler window.document. yerşu anda pencereyi tamamen kopyalar. yer tüm özellikleri ve yöntemleri ile. Şimdi pencere nesnesinin özelliklerini ve yöntemlerini düşünün. yer (bu nesneyle ilişkili olay yok).

Konum nesnesi özellikleri

Bir örnekle göstermeleri daha kolaydır. Tarayıcının şu konumda bulunan bir sayfa görüntülediğini varsayalım:

Sonra nesnenin özellikleri yer aşağıdaki değerleri alın:

window.location.href \u003d "http://www.site.ru:80/dir/page.cgi?product\u003dphone&id\u003d3#mark" window.location.protocol \u003d "http:" window.location.hostname \u003d " www.site.ru "window.location.port \u003d 80 window.location.host \u003d" www.site.ru:80 "window.location.pathname \u003d" dir / page.cgi "window.location.search \u003d"? ürün \u003d phone & id \u003d 3 "window.location.hash \u003d" #mark "

Önceki derslerde belirtildiği gibi, nesne özelliklerine her ikisi kullanılarak erişilebilir nokta notasyonu (yukarıdaki gibi) ve parantez gösterimiörneğin: pencere. konum ["ana bilgisayar"].

Konum nesnesi yöntemleri

Nesne yöntemleri yer sayfa yükleme ve yeniden yüklemeyi kontrol etmek için tasarlanmıştır. Bu kontrol, geçerli belgeyi yeniden yükleyebileceğiniz anlamına gelir (yöntem tekrar yükle ()) veya yeni bir tane yükleyin (yöntem değiştir ()).

window.location.reload (true);

Yöntem tekrar yükle () araç çubuğundaki Yeniden Yükle düğmesine tıklandığında tarayıcı davranışını tamamen simüle eder. Yöntemi bağımsız değişken olmadan çağırırsanız veya true değerine eşit olarak belirtirseniz, tarayıcı belgenin son değiştirilme zamanını kontrol eder ve ya önbellekten (belge değiştirilmemişse) ya da sunucudan indirir. Bu davranış, tarayıcının Yeniden Yükle düğmesine (Internet Explorer'da F5 tuşu) basit bir tıklamaya karşılık gelir. Bağımsız değişken olarak false belirtirseniz, tarayıcı ne olursa olsun sunucudan geçerli belgeyi yeniden yükleyecektir. Bu davranış, Shift tuşuna ve tarayıcı Yeniden Yükle düğmesine (veya Internet Explorer'da Ctrl + F5) aynı anda basılmasına karşılık gelir.

Nesneyi kullanma yer, yeni bir sayfaya iki şekilde gidebilirsiniz:

window.location.href \u003d "http://www.newsite.ru/"; window.location.replace ("http://www.newsite.ru/");

Aralarındaki fark, bu eylemin sayfa ziyaretleri penceresinin geçmişinde gösterilmesidir. tarih... İlk durumda, ziyaret geçmişine "http://www.newsite.ru/" adresini içeren yeni bir öğe eklenecektir, böylece dilerseniz bir önceki sayfaya dönmek için tarayıcı panelindeki Geri düğmesine basabilirsiniz. İkinci durumda, yeni adres olan "http://www.newsite.ru/" ziyaret geçmişinde bir öncekinin yerini alacak ve Geri butonuna basarak bir önceki sayfaya dönmek imkansız olacaktır.

Ziyaret tarihi (tarih)

World Wide Web sayfalarının tarama geçmişi, kullanıcının belirli bir tarayıcı penceresinde daha önce görüntülediği sayfaya geri dönmesini sağlar. JavaScript'in göz atma geçmişi bir pencere nesnesine dönüştürülür. tarih... Bu nesne, kullanıcının ziyaret ettiği bir URL dizisine işaret eder ve tarayıcı menüsünden Git modu seçilerek erişilebilir. Nesne yöntemleri tarih bu diziden bir URL kullanarak sayfaları yüklemenize izin verir.

Tarayıcı güvenlik sorunlarını önlemek için, dizini kullanarak yalnızca Geçmişte gezinebilirsiniz. Bu durumda, bir metin dizesi olarak URL, programcı tarafından kullanılamaz. Çoğu zaman bu nesne, örneğin yükleneceği sayfaya geri dönebileceğinizi varsayarak, birkaç farklı sayfadan bağlanabilen örneklerde veya sayfalarda kullanılır:

Bu kod "Geri" düğmesini gösterir, üzerine tıklayarak önceki sayfaya döneceğiz. Yöntem benzer şekilde çalışır tarih. ileri (), bizi bir sonraki ziyaret edilen sayfaya götürüyor.

Ayrıca, göz atma geçmişinizde birkaç adım ileri veya geri atlamanıza izin veren bir tamsayı bağımsız değişkenine sahip bir go () yöntemi de vardır. Örneğin, tarih .go (-3) bizi tarama geçmişinde 3 adım geriye götürecek. Bu durumda, yöntemler back () ve ileri () sırasıyla -1 ve 1 bağımsız değişkenlerine sahip go () yöntemine eşdeğerdir. Aramak geçmiş .go (0) mevcut sayfayı yeniden yükleyecektir.

Tarayıcı türü (gezgin)

Genellikle görev, belirli bir görüntüleyici (tarayıcı) için bir sayfa oluşturmaktan doğar. Bu durumda iki seçenek mümkündür: sunucu tarafında veya istemci tarafında tarayıcı türünü belirlemek. İkincisi için, nesnelerin JavaScript cephaneliğinde bir pencere nesnesi vardır. gezgin... Bu nesnenin en önemli özellikleri aşağıda listelenmiştir.

İzleyici türünü belirlemenin basit bir örneğine bakalım.

Bir obje gezgin web tarayıcısı programının kendisine erişmeye yarar. Onu bir nesneyle karıştırmayın pencerebu, geçerli Web tarayıcısı penceresini ve Netscape Navigator programının adını temsil eder.

appCodeName

Web tarayıcısı programının kod adını döndürür. Hem Internet Explorer hem de Navigator için "Mozilla" dizesini döndürecektir. Kahrolası.

appMinorVersion

Web tarayıcısının sürüm numarasının en önemsiz basamağını döndürür. Örneğin, Internet Explorer 5.0 için "0" ve 5.5 - "5" döndürür.

Yalnızca 4.0'dan itibaren Internet Explorer desteklenir

uygulama ismi

"Netscape" veya "Microsoft Internet Explorer" gibi Web tarayıcısı programının adını alır.

uygulama sürümü

Web tarayıcısı programının sürümünü döndürür.

browserLanguage

Web tarayıcısı programının kodunu döndürür.

cookieEnabled

Kullanıcı, web tarayıcısının çerezleri kabul etmesine izin verdiyse doğru döndürür. 4.0'dan beri yalnızca IE'yi desteklemektedir

cpuClass

İstemci bilgisayarın "x86" veya "Alpha" gibi işlemci sınıfını alır. 4.0'dan beri yalnızca IE'yi desteklemektedir

dil

Web tarayıcı programının dil kodunu döndürür. 4.0'dan beri yalnızca NN destekleniyor

internet üzerinden

İstemci şu anda İnternet'e bağlıysa (çevrimiçi) doğru, bağlantısı kesilmişse (çevrimdışı) yanlış döndürür.

4.0'dan beri yalnızca IE'yi desteklemektedir

platform

İstemci platformunun adını döndürür, örneğin "Win32".

systemLanguage

İstemci işletim sisteminin dil kodunu döndürür. 4.0'dan beri yalnızca IE'yi desteklemektedir

userAgent

İstemcinin Web tarayıcısını tanımlayan bir dize döndürür. AppCodeName ve appVersion özellik değerlerinin bir kombinasyonudur.

userLanguage

BrowserLanguage ile aynı.

4.0'dan beri yalnızca IE'yi desteklemektedir

Bir obje gezgin ayrıca yöntemi destekler javaEnabled ()kullanıcı Web tarayıcısında JavaScript komut dosyası oluşturmaya izin verdiyse bu doğru döndürür.

Emlak hakkında biraz daha detay söylemek istiyorum uygulama sürümüveya daha doğrusu, döndürdüğü değer. Mesele şu ki, IE ve NN farklı değerlere sahip olacak.

Bu, Navigator formatıdır:

(Sürüm) [(Dil)] ((İşletim Sistemi); U | I)

Buraya (Sürüm) web tarayıcısının sürümünü temsil eder (Dil) - programın dili (ancak mevcut olmayabilir), (İşletim sistemi) - istemcinin işletim sisteminin adı, örneğin, "Win96", "Win16" veya "WinNT", "U" harfi - programın Amerikan versiyonu ve "I" - uluslararası.

Örneğin:

4.0 (Win95; I)

Internet Explorer'da bir özellik değeri çıktı biçimi vardır uygulama sürümü diğer:

(Uyumlu Navigator sürümü) (uyumlu; (Sürüm); (İşletim sistemi))

Buraya (İşletim sistemi) "Windows 3.1", "Windows 3.11", "Windows 95" veya "Windows NT" olabilir.

2.0 (uyumlu; 3.01; Win95)

Emlak userAgent şu biçime sahip bir değer döndürür:

(AppCodeName değeri) / (Uygulama Sürümü değeri)

Yani, önceki iki örnek için aşağıdaki değerleri alıyoruz:

Mozilla / 4.0 (Win95; I) Mozilla / 2.0 (uyumlu; 3.01; Win95)

Bu nesne tamamen bilgi amaçlıdır. Tarayıcı hakkında bilgi sağlar.

Gezgini kullanmaya bir örnek olarak, tüm tarayıcı özelliklerini görüntüleyelim:

< script type= "text/javascript" > belge. writeln (); için (gezginde var özelliği) (document. write (" "+ mülk +": "); belge. writeln (gezgin [özellik]);)

Geçmiş nesnesi

2 düğmeden sorumlu: 'ileri' ve 'geri'. Tarayıcı, sayfadan sayfaya bağlantıyı izleyerek bu geçişlerin geçmişini kaydeder. Şunlar. bir sayfa geri gidebilir veya bir sayfa ileri gidebilirsiniz. Yöntemleri ve özellikleri kullanarak bu düğmelere javaScript'ten basmanın simülasyonunu yapabilirsiniz.

Nesnenin bir özelliği - uzunluk - uzunluk vardır.

Nesnenin yöntemleri vardır: go (), back (), forward ().

Bir örnek ele alalım:

< script type= "text/javascript> function length () (// geçiş sayısını gösterir alert ("Geçiş sayısı:" + geçmiş.length);) function back () (// geri dön history.back ();) function forward () (// 1 geçiş ileri git history.forward ();)

Konum nesnesi

Adres çubuğundan sorumlu. Sayfa adresini almanıza ve değiştirmenize izin verir. Adres değişir değişmez, tarayıcı otomatik olarak yeni adrese gider. Şunlar. adrese geçişi simüle edebilirsiniz.

var özellikleri:

• karma etikettir.
• ana bilgisayar - ana bilgisayar adı + bağlantı noktası.
• hostname site adresinde www ve.ru şeklindedir.
• href - adres çubuğunu içerir. Burada başka bir adres yazabilirsiniz ve tarayıcı bu adrese gidecektir.
• yol adı sayfanın kendisidir.
• bağlantı noktası - kullanılan yazı.
• protokol http: // veya ftp: // şeklindedir.
• arama - soru işaretinden sonraki parametreler.

var yöntemler:

• atama () - belirtilen adrese atla.
• reload () - 'yenile' düğmesine basmanın taklidi.
• replace () - belirtilen adrese gidin, ancak açık sayfada geri düğmesi yoktur, örn. bu sayfayı geçmişe kaydetmez.

Ekran nesnesi

Bu tamamen bilgi amaçlı bir nesnedir. Kullanıcı ekranının boyutunu piksel cinsinden bildirir. Yöntemi yoktur, yalnızca özellikleri vardır:

• availHeight, kullanılabilir ekran yüksekliğidir.
• availWidth, kullanılabilir ekran genişliğidir.
• colorDepth - renkleri depolamak için ayrılan bit sayısı (şu anda kullanılmıyor).
• yükseklik - kullanıcı ekranının yüksekliği.
• genişlik - kullanıcı ekranının genişliği.
• updateInterval - CRT ekran yenileme hızı (kullanılmaz).

Gezgin nesnesi şunları içerir: kullanıcının tarayıcısı hakkında bilgi (özellikle - mevcut tanımlama bilgilerinin kullanımı ve Java desteği etkin mi).

Navigator nesnesi ayrıca işletim sisteminin türünü belirlemenize de olanak tanır.

Navigator nesnesiyle çalışmanın rahatlığı için tüm özelliklerini ekranda gösterelim. Önceki dersteki materyali hatırlamak.

Tarayıcı bilgileri - userAgent özelliği;

Tarayıcı dili - dil özelliği;

İşletim sistemi adı - oscpu özelliği;

Tanımlama bilgilerinin etkinleştirilip etkinleştirilmediği - özellik cookieEnable d;

Kullanıcının internete bağlı olup olmadığı - onLine özelliği.

Nesne özelliklerine erişim gezgin bir noktadan yapılır.

Ekran nesnesi, kullanıcının ekran çözünürlüğü, renk derinliği vb. Hakkında veri almaya yardımcı olacaktır.

Aynısını ekran nesnesiyle yapacağız: önce tüm özelliklerini göstereceğiz.

Şimdi, ekran nesnesinin yükseklik ve genişlik özelliklerini kullanarak, ekran çözünürlüğü - piksel cinsinden yüksekliği ve genişliği hakkında bilgi alıyoruz. Ve ayrıca renk paletinin bit derinliği - colorDepth özelliği hakkında.

Konum nesnesi url döndürür mevcut kullanıcı penceresi.

Ayrıca mevcut adresin parçaları ve bileşenleri hakkında veriler de içerir: ana bilgisayar adı, bağlantı noktası numarası, protokol vb.

Nesne özellikleri yer.

Mevcut belgenin URL'sini görüntülemek için konum nesnesinin href özelliğini kullanacağız.

Bu ders için ödevimizi yapalım.

Kişinin sayfanıza hangi tarayıcıdan geldiğini ve tarayıcıya bağlı olarak şunu görüntülediğini öğrenin:

Firefox ise: "Tarayıcınız Firefox."
Opera ise: "Tarayıcınız Opera'dır."
Chrome ise: "Tarayıcınız Chrome'dur."

Bu ödevi çözmek için ihtiyacınız olan:

Navigator nesnesinin userAgent özelliğini kullanarak geçerli tarayıcı hakkında bilgi alın.

Bu sorunu çözerken, Firefox, Opera ve Chrome tarayıcıları hakkında aşağıdaki verileri aldım.

Mozilla / 5.0 (Windows NT 6.1; WOW64; rv: 56.0) Gecko / 20100101 Firefox /56.0

Mozilla / 5.0 (Windows NT 6.1; Win64; x64) AppleWebKit / 537.36 (KHTML, Gecko gibi) Chrome /61.0.3163.100 Safari / 537.36 OPR /48.0.2685.39

Mozilla / 5.0 (Windows NT 6.1; Win64; x64) AppleWebKit / 537.36 (KHTML, Gecko gibi) Chrome /61.0.3163.100 Safari / 537.36

Normal ifadeler kullanarak tarayıcı adlarını bulun onlar hakkındaki bilgilerden.