جلسه 1: محل قرارگیری کدهای جاوا اسکریپت
تگ <SCRIPT>
کدهای جاوا اسکریپت باید بین تگ <SCRIPT> و </SCRIPT> قرار بگیرند.
مثال: همانطور که در قطعه کد زیر میبینید کدهای جاوااسکریپت بین تگ باز و بسته <SCRIPT> قرار گرفته اند.
<p id="demo"></p> <script> document.getElementById("demo").innerHTML = "My First JavaScript"; </script>
کدهای جاوااسکریپت کجا قرار میگیرند؟
شما میتوانید هر تعداد اسکریپت را در یک سند HTML قرار دهید. کدهای اسکریپت میتوانند در قسمت <head> یا <body> سند html قرار گیرند.
جاوا اسکریپت در <head>
کدهای جاوا اسکریپت در قسمت <head> باید بین دو تگ باز و بسته ی<head> و </head> قرارگیرند. به مثال زیر توجه کنید یک تابع جاوا اسکریپت در قسمت <head> سند html قرار گرفته است.
در مثال زیر زمانی که بر روی دکمه کلیک میشود تابع ()myFunction فراخوانی میشود.
<html> <head> <script> function myFunction() { document.getElementById("demo").innerHTML = "مثبت+1"; } </script> </head> <body> <h2>JavaScript in Head</h2> <p id="demo">نام سایت من</p> <button type="button" onclick="myFunction()">کلیک کن</button> </body> </html>
جاوا اسکریپت در <body>
همانند مثال بالا ایندفعه در مثال زیر کدهای جاوا اسکریپت بین دو تگ باز و بسته ی<body> و </body> قرار گرفته اند.
در کد زیر تابع myFunction() زمانی که بر روی دکمه کلیک میشود فراخوانی میشود.
<html> <head> </head> <body> <h2>JavaScript in Head</h2> <p id="demo">نام سایت من</p> <button type="button" onclick="myFunction()">کلیک کن</button> <script> function myFunction() { document.getElementById("demo").innerHTML = "مثبت+1"; } </script> </body> </html>
جاوا اسکریپت EXTERNAL یا خارجی
در این روش توابع جاوا اسکریپت در یک فایل خارجی قرار میگیرند این روش زمانی استفاده میشود که یک وبسایت با صفحه های متعدد داریم و نوشتن توابع در داخل سندهای HTML باعث شلوغی و بهم ریختگی پرونده های وبسایت میشود. دراین روش توابع جاوااسکریپت داخل فایل های با پسوند JS. نگهداری میشوند.
برای استفاده از این ویژگی باید همانند مثال زیر نام فایل اسکریپت خارجی را درون مشخصه ()src تگ <script> بنویسید.
<script src="myScript.js"></script>
شما میتوانید آدرس اسکریپت خارجی را درون تگ <head> یا <body> قرار دهید.
نکته: درون فایل خارجی نیاز به نوشتن تگ <script> نیست.
مزایای جاوا اسکریپت خارجی
قرار دادن توابع جاوا اسکریپت درون فایل خارجی دارای مزایایی میباشد از جمله:
- توابع جاوا اسکریپت را از تگ های html جدا میکند.
- خوانایی و نگهداری فایل های html و جاوااسکریپت را تسهیل میکند.
- فایل های جداذخیره شده اسکریپت باعث لود و بارگذاری سریعتر صفحات وب میشود.
برای اضافه کردن چندین فایل اسکریپت به یک صفحه میتوانید از چندین تگ اسکریپت استفاده کنید.
به مثال زیر توجه کنید:
<script src="myScript1.js"></script> <script src="myScript2.js"></script>
اسکریپت های خارجی را میتوان بصورت کامل یا شکسته آدرس دهی کرد.
مثال زیر نمونه آدرس دهی کامل اسکریپت است:
<script src="https://www.mosbate1.ir/js/myScript1.js"></script>
و مثال زیر نمونه آدرس دهی شکسته فایل اسکریپت میباشد.
<script src="/js/myScript1.js"></script>
امیدوارم که خسته نشده نباشید با ادامه آموزش جاوا اسکریپت با ما باشید.