4.1 Tarayıcı nesneleri

Bildiğiniz gibi, JavaScript dili tarayıcının içinde çalışır, bu nedenle bir şekilde aynı tarayıcıyla etkileşime girmesi gerekir. Bunu yapmak için, tarayıcının JavaScript'te bulunan birkaç nesnesi ve işlevi vardır.

İlki an object window, tarayıcı penceresini tanımlayandır. Daha doğrusu, tarayıcıların sekmesiz olduğu zamanları anlatırdım. Şimdi pencere nesnesi, komut dosyası içeren sayfanın yüklendiği geçerli tarayıcı sekmesini tanımlar.

an object documentİkincisi, sekmede görüntülenen belgeden sorumlu olan budur . Bu biraz kafa karıştırıcı olabilir. Basit olması için, belgenin kullanıcıya görüntülenen şey olduğunu ve pencerenin bu belgenin görüntülendiği yer olduğunu varsayalım.

an object consoleÜçüncüsü, tarayıcı konsoluna çıktıdan sorumlu olan budur . Evet, tarayıcıların da bir konsolu vardır, esas olarak komut dosyasında hata ayıklamak ve hata mesajlarını görüntülemek için kullanılır. Genellikle tarayıcınızdaki F12 düğmesine basarak açabilirsiniz.

Object window, tüm sayfa nesneleri için en üst düzey nesnedir. documentVe komut dosyanıza doğrudan nesne adları yazabilseniz de console, aslında bunların adları window.documentve window.console.

4.2 JavaScript'te Diyaloglar

uyarı () yöntemi

Ayrıca, an object windowsayfa komut dosyası tarafından görülebilen çeşitli işlevlere sahiptir. En sık kullanılanı alert(). Kullanıcıya bir mesaj içeren bir iletişim kutusu görüntülemenizi sağlar. Ardından komut dosyası, kullanıcı Tamam'ı tıklatana kadar askıya alınır.

Örnek:

alert("JavaScript is the best!");

istem () yöntemi

Kullanıcıdan bir değer girmesini isteyebileceğiniz bir işlev de vardır - bu prompt().

Örnek:

var age = prompt("Enter Year of Birth");

onayla() yöntemi

İki düğmeli bir iletişim kutusu görüntüleyebilirsiniz Ok- Cancelkullanıcıya bazı işlemler hakkında soru sorun.

Örnek:

var isOK = confirm("Are you ready");

4.3 aşırı yük() olayı

Ve bir tane daha yararlı ve ilginç an. Tarayıcı penceresi, belge tamamen yüklendiğinde tetiklenen bir olaya sahiptir. Belge yüklenip görüntülendikten sonra yürütülecek kodu belirleyebilirsiniz.

Bu üç şekilde yapılabilir.

İlk olarak, JavaScript kodunu bir öznitelik değeri olarak doğrudan bir HTML sayfasına gömebilirsiniz:

<body onload="alert('document loaded');">
  <img src="big-image.png">
</body>

İkinci olarak, JavaScript kodunu bir HTML sayfasına gömebilirsiniz:

<head>
    <script>
        function load()
        {
            alert('document loaded');
        }
        window.onload = load;
    </script>
</head>
<body>
    <img src="big-image.png">
</body>

Üçüncüsü, anonim bir işlev bildirerek biraz daha kısa yazabiliriz:

<head>
    <script>
        window.onload = function () {
            alert('document loaded');
        }
    </script>
</head>
<body>
    <img src="big-image.png">
</body>

4.4 onclick() olayı

Ve son olarak, bir diğer önemli olay (olay) dır event OnClick. Bu, kullanıcının tıkladığı herhangi bir öğede gerçekleşir. Tıpkı event OnLoadfarklı şekillerde ayarlanabileceği gibi, bu yüzden sadece en basitini vereceğiz:

<body>
  <img src="big-image.png" onclick="alert('user clicked on the image');">
</body>