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

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

اولین کد جاوا اسکریپت من

دکمه زیر را کلیک کنید تا تاریخ و زمان جاری را مشاهده کنید.

 

تگ <script> در HTML

تگ <script> برای تعریف اسکریپت سمت مددجو (جاوا اسکریپت) استفاده می شود.

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

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

برای انتخاب یک عنصر HTML، جاوا اسکریپت در بیشتر مواقع از متد (document.getElementById(id استفاده می کند.

این مثال جاوا اسکریپت متن "Hello JavaScript!" را در داخل عنصر HTML با شناسه دمو ("id="demo) قرار می دهد:

مثال:

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

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

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

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

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

 

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

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

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

جاوا اسکریپت می تواند خصیصه های HTML را عوض کند:

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

تگ <noscript> در HTML

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

مثال:

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

<noscript>Sorry, your browser does not support JavaScript!</noscript>

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

تگ

شرح

<script>

تعریف اسکریپت سمت کلاینت (client-side)

<noscript>

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

اگر در اجرای این راهنما به مشکل برخورد کردید و سایر سئوالات و پیشنهادات خود را در بخش سئوالات عمومی انجمن پلکسا مطرح نمایید. گروه توسعه وب پلکسا به سئوالات شما پاسخ خواهند داد.