JavaScript در کجا قرار میگیرد

تگ  <script>

در html کدهای JavaScript باید در میان تگ های <script> و <script/> قرار گیرد.

تگ script
 <script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script> 
مشاهده مثال

توجه : در  نمونه های گذشته ممکن بود از <"script type="text/javascript> استفاده میشد. اما مشخصه type الزامی نیست و JavaScript  بصورت زبان  پیشفرض  در html میباشد.

توابع  و رویداد های JavaScript

یک تابع JavaScript  یک بلوکی از کد های JavaScript است که زمانی استفاده میشود که توسط کد دیگری صدا زده شود.
برای مثال یک تابع می تواند زمانی اجرا شود که رویدادی رخ داده باشد مانند زمانی که کاربر یک دکمه را کلیک میکند.

JavaScript  در میان تگ <body> و یا <head>

شما هر تعداد کد JavaScript ای که دارید را می تواند در صفحه HTML خود قرار دهید. script ها می توانند در میان تگ های <head> و <body> و یا هر دو آن ها قرار گیرند .

JavaScript در <head>

در نمونه زیر یک تابع JavaScript را در <head> صفحه html استفاده میکنیم. این تابع زمانی صدا زده میشود که دکمه button کلیک میشود.

تگ head در جاوا اسکریپت
 <!DOCTYPE html>
<html>

<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>

<body>

<h1>A Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try it</button>

</body>
</html>
مشاهده مثال

JavaScript در <body>

در نمونه زیر یک تابع JavaScript را در <body> صفحه html استفاده میکنیم. این تابع زمانی صدا زده میشود که دکمه button کلیک میشود.

تگ body در جاوا اسکریپت
 <!DOCTYPE html>
<html>
<body>

<h1>A Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try it</button>

<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>

</body>
</html> 
مشاهده مثال

نکته : ایده جالبی است که کد های JavaScript را در پایین قسمت <body> قرار دهید. این کار میتواند در بارگذاری سریع صفحه کمک کند. چون که بارگذاری HTML صفحع قبل از بارگذاری script ها انجام خواهد شد.

JavaScript خارجی

script ها همچنین میتوانند در یک فایل خارجی قرار بگیرند

function myFunction() { document.getElementById("demo").innerHTML = "Paragraph changed."; }

این کار زمانی که بخواهیم از کد های یکسان دز صفحات مختلف استفاده کنیم بسیار کاربردی تر خواهد بود.
پسوند فایل های جاوااسکریپت js. میباشد
برای استفاده از Javascript خارجی نام فایل script را در مشخصه src تگ script قرار دهید:

فایل .js
 <script src="myScript.js"></script> 
مشاهده مثال

شما می تواند منابع خارجی را درمیان <head> ویا <body> استفاده کنید. script دقیقا در همان جایی که قرار گرفته است اجرا میگردد.
نکته: در داخل فایل های script خارجی از تگ <script> استفاده نکنید .

مزایای استفاده از JavaScript خارجی

- جدا سازی کد های HTML و JavaScript
- این کار بر خوانا بودن کدهای HTML و JavaScript  کمک میکند.
- فایل های JavaScript توسط مرورگر ذخیره میگردند و این باعث میشود سرعت بارگذاری صفحه بالا برود.

منابع خارجی

اسکریپت های خارجی را می توان با یک URL کامل یا با یک مسیر نسبت به صفحه وب فعلی ارجاع داد.

منبع خارجی
 <script src="https://www.w3schools.com/js/myScript1.js"></script> 
مشاهده مثال

این مثال از یک اسکریپت در یک پوشه مشخص در وب سایت فعلی استفاده می کند:

منبع محلی
 <script src="/js/myScript1.js"></script> 
مشاهده مثال

این مثال به یک اسکریپت در پوشه مشابه صفحه فعلی لینک می شود:

منبع محلی در همان پوشه
 <script src="myScript1.js"></script> 
مشاهده مثال

 

نظر شما

لطفا نام و نام خانوادگی خود را وارد کنید
لطفا ایمیل خود را وارد کنید لطفا ایمیل صحیح وارد کنید.
لطفا متن نظر خود را وارد کنید
>

یادگیری JavaScript

مقالات و دروس

به خبرنامه مدرسه طراحی وب ایران (وب مهراز) بپیوندید.

لطفا شماره همراه صحیح وارد کنید.
لطفا ایمیل صحیح وارد کنید.

مقالات مرتبط