JavaScriptda natija olish

JavaScriptda natija olish


JavaScript kodlarini print yoki display funksiyalari orqali chop qilib bo'lmaydi. Shuning uchun uning o'ziga xos chop qilish funksiyalari mavjud bo'lib, ular quyidagilar:

  • windows.alert
  • document.write
  • innerHTML
  • console.log()

Hozir har biri bilan birma bir tanishib chiqamiz.


Windows.alert orqali

windows.alert funksiyasi orqali Ogohlantiruvchi oynaga ma'lumotlarni chop qilishimiz mumkin.

Namuna:

O'zingni Sinab Ko'r
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
window.alert(5 + 6);
</script>

</body>
</html>

Document.write orqali

Bu funksiya orqali ma'lumotlar huddi HTML dagi ma'lumotlar chop etilgandek ko'rinish oladi. Bu JavaScript kodlarini chop etishni sinab ko'rish uchun qulay.

Namuna:

O'zingni Sinab Ko'r
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
document.write(5 + 6);
</script>

</body>
</html>

Bu yerda JavaScript kodlari maxsus script juft tegi va HTML document'niichiga yozildi. Buni script tegisiz ham yozsak bo'ladi ya'ni

Namuna:

O'zingni Sinab Ko'r
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<button onclick="document.write(5 + 6)">Try it</button>

</body>
</html>

Bu funksiya faqat JavaScript kodlarini test qilish uchungina tavsiya etiladi.


innerHTML orqali

Bu usulda ma'lumotlarni chop qilish uchun document.getElementById(id)dan foydalaniladi. Bu yerda qavs ichidagi id, HTMLning biror elementining idisini bildiradi.

Namuna:

O'zingni Sinab Ko'r
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My First Paragraph</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>

</body>
</html>

console.log() orqali

Barcha braurzerlarda ma'lumotlarni chop qilish uchun console.log() funksiyasi mavjud bo'lib, aktiv holatdagi brauzerdan F12 tugmasini bosgan holda konsol oynasiga o'tish mumkin.

Namuna:

O'zingni Sinab Ko'r
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
console.log(5 + 6);
</script>

</body>
</html>

Innovative Lab web sahifasiga xush kelibsiz biz bilan birga IT sohasidagi o'z bilimlaringizni bosqichma-bosqich oshirib boring!


Telegram kanalimizdan kunlik darslarni o'rganing  

TOSHKENT SHAHRIDAGI INHA UNIVERSITETI - 2017