JavaScript – کجا استفاده شود (Where To)

جاوا اسکریپت کجا استفاده می‌شود

تگ <script>

در HTML، کد جاوا اسکریپت بین تگ‌های <script> و </script> قرار می‌گیرد.

مثال:

<script>
document.getElementById("demo").innerHTML = "اولین جاوا اسکریپت من";
</script>

نمونه‌های قدیمی جاوا اسکریپت ممکن است از ویژگی type استفاده کنند: <script type="text/javascript">. این ویژگی دیگر الزامی نیست زیرا جاوا اسکریپت زبان پیش‌فرض در HTML است.

توابع و رویدادهای جاوا اسکریپت

یک تابع جاوا اسکریپت بلوکی از کد جاوا اسکریپت است که می‌تواند هنگام فراخوانی اجرا شود.

به عنوان مثال، یک تابع می‌تواند هنگام وقوع یک رویداد فراخوانی شود، مثل زمانی که کاربر روی دکمه‌ای کلیک می‌کند.

شما در فصول بعدی بیشتر درباره توابع و رویدادها یاد خواهید گرفت.

جاوا اسکریپت در head یا body

شما می‌توانید هر تعداد اسکریپت در یک سند HTML قرار دهید.

اسکریپت‌ها می‌توانند در بخش <body>، <head> یا هر دو بخش صفحه HTML قرار گیرند.

جاوا اسکریپت در <head>

در این مثال، یک تابع جاوا اسکریپت در بخش <head> قرار گرفته است. این تابع هنگام کلیک روی دکمه فراخوانی می‌شود:

مثال:

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
  document.getElementById("demo").innerHTML = "پاراگراف تغییر کرد.";
}
</script>
</head>
<body>
<h2>دمو جاوا اسکریپت در هد</h2>

<p id="demo">یک پاراگراف</p>
<button type="button" onclick="myFunction()">امتحان کنید</button>

</body>
</html>

جاوا اسکریپت در body

در این مثال، یک تابع جاوا اسکریپت در بخش <body> قرار گرفته است. تابع هنگام کلیک روی دکمه فراخوانی می‌شود:

مثال:

<!DOCTYPE html>
<html>
<body>

<h2>دمو جاوا اسکریپت در بادی</h2>

<p id="demo">یک پاراگراف</p>

<button type="button" onclick="myFunction()">امتحان کنید</button>

<script>
function myFunction() {
  document.getElementById("demo").innerHTML = "پاراگراف تغییر کرد.";
}
</script>

</body>
</html>

قرار دادن اسکریپت‌ها در انتهای عنصر <body> سرعت نمایش صفحه را بهبود می‌بخشد، زیرا تفسیر اسکریپت‌ها نمایش را کند می‌کند.

جاوا اسکریپت خارجی

اسکریپت‌ها همچنین می‌توانند در فایل‌های خارجی قرار گیرند:

فایل خارجی: myScript.js

function myFunction() {
  document.getElementById("demo").innerHTML = "پاراگراف تغییر کرد.";
}

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

فایل‌های جاوا اسکریپت با پسوند .js ذخیره می‌شوند.

برای استفاده از یک اسکریپت خارجی، نام فایل اسکریپت را در ویژگی src (منبع) تگ <script> قرار دهید:

مثال:

<script src="myScript.js"></script>

می‌توانید مرجع اسکریپت خارجی را در <head> یا <body> قرار دهید.

مزایای جاوا اسکریپت خارجی

قرار دادن اسکریپت‌ها در فایل‌های خارجی دارای برخی مزایا است:

  • جدا کردن HTML و کد
  • خوانایی و نگهداری آسان‌تر HTML و JavaScript
  • فایل‌های جاوا اسکریپت کش شده می‌توانند سرعت بارگذاری صفحات را افزایش دهند

برای اضافه کردن چندین فایل اسکریپت به یک صفحه، از چندین تگ اسکریپت استفاده کنید:

مثال:

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

ارجاعات خارجی

یک اسکریپت خارجی می‌تواند به سه روش مختلف ارجاع شود:

  1. با یک URL کامل (آدرس کامل وب)
  2. با یک مسیر فایل (مانند /js/)
  3. بدون مسیر

این مثال از یک URL کامل برای پیوند به myScript.js استفاده می‌کند:

مثال:

<script src="https://www.w3schools.com/js/myScript.js"></script>

این مثال از یک مسیر فایل برای پیوند به myScript.js استفاده می‌کند:

مثال:

<script src="/js/myScript.js"></script>

این مثال بدون مسیر به myScript.js پیوند می‌دهد:

مثال:

<script src="myScript.js"></script>

پست های مرتبط

مطالعه این پست ها رو از دست ندین!
JavaScript - کلمه کلیدی Let (Let)

JavaScript – کلمه کلیدی Let (Let)

تعریف let کلیدواژه let در ES6 (2015) معرفی شد و دارای ویژگی‌های خاصی است که آن را از var...

بیشتر بخوانید
JavaScript - متغیرها (Variables)

JavaScript – متغیرها (Variables)

متغیرها در جاوا اسکریپت متغیرها در جاوا اسکریپت به عنوان ظرف‌هایی برای ذخیره‌سازی داده‌ها استفاده می‌شوند و می‌توانند به...

بیشتر بخوانید
JavaScript - کامنت‌ها (Comments)

JavaScript – کامنت‌ها (Comments)

کامنت‌ها در جاوا اسکریپت کامنت‌ها در جاوا اسکریپت به برنامه‌نویسان این امکان را می‌دهند تا توضیحاتی را به کد...

بیشتر بخوانید

نظرات

سوالات و نظراتتون رو با ما به اشتراک بذارید

برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید.