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

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

جاوا اسکریپت صفحات HTML را پویاتر و تعاملی‌تر می‌کند.

تگ <script> در HTML

تگ <script> در HTML برای تعریف یک اسکریپت سمت کلاینت (جاوا اسکریپت) استفاده می‌شود. عنصر <script> یا شامل دستورات اسکریپت است، یا از طریق خصوصیت src به یک فایل اسکریپت خارجی اشاره می‌کند.

کاربردهای رایج جاوا اسکریپت عبارتند از: دستکاری تصاویر، اعتبارسنجی فرم‌ها و تغییرات پویای محتوا.

جاوا اسکریپت برای انتخاب یک عنصر HTML، اغلب از متد document.getElementById() استفاده می‌کند.

این مثال جاوا اسکریپت، عبارت «!Hello JavaScript» را در یک عنصر HTML با id="demo" می‌نویسد:

مثال:

<script>
  document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>

نکته: شما می‌توانید اطلاعات بسیار بیشتری درباره جاوا اسکریپت در آموزش جاوا اسکریپت ما بیاموزید.

نمونه‌ای از قابلیت‌های جاوا اسکریپت

در اینجا چند نمونه از کارهایی که جاوا اسکریپت می‌تواند انجام دهد آورده شده است:

مثال:

جاوا اسکریپت می‌تواند محتوا را تغییر دهد:

document.getElementById("demo").innerHTML = "Hello JavaScript!";

مثال:

جاوا اسکریپت می‌تواند استایل‌ها را تغییر دهد:

document.getElementById("demo").style.fontSize = "25px";
document.getElementById("demo").style.color = "red";
document.getElementById("demo").style.backgroundColor = "yellow";

مثال:

جاوا اسکریپت می‌تواند خصوصیت‌ها (attributes) را تغییر دهد:

document.getElementById("image").src = "picture.gif";

تگ <noscript> در HTML

تگ <noscript> در HTML محتوای جایگزینی را تعریف می‌کند تا به کاربرانی که اسکریپت‌ها را در مرورگر خود غیرفعال کرده‌اند یا مرورگری دارند که از اسکریپت پشتیبانی نمی‌کند، نمایش داده شود:

مثال:

<script>
  document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
<noscript>
  متاسفیم، مرورگر شما از جاوا اسکریپت پشتیبانی نمی‌کند!
</noscript>

تگ‌های اسکریپت در HTML