آموزش طراحی سایتآموزش HTML

تگ script در HTML

برای معرفی و نمایش کد‌های جاوا اسکریپت در HTML از چه تگی استفاده می‌کنیم؟ منظور از تگ Script چیست؟ آیا میتوانیم در HTML به صورت مستقیم از جاوا اسکریپت استفاده کنیم؟ در این مقاله با تگ script آشنا می‌شویم.

تگ <script>

در فصل قبل در رابطه کار با فریم ها صحبت کردیم و با تگ‌ frame و تگ iframe آشنا شدیم. در این جلسه می‌خواهیم در رابطه با تگ Script صحبت کنیم.

این تگ برای تعریف یک اسکریپت سمت کلاینت مورد استفاده قرار می‌گیرد.

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

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

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

مثال زیر یک عبارت “سلام جاوا اسکریپت” را با پیدا کردن عنصر جاوا اسکریپت می‌نویسد.

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

نکات و یادداشت ها

اگر در تگ <script> از خاصیت  “src” استفاده می کنید، محتوای تگ باید خالی باشد.

برای فراخوانی یک اسکریپت بیرونی چندین راه وجود دارد:

  • اگر مقدار خاصیت async برابر با async باشد، در این حالت اسکریپت به صورت ناهمگام به همراه سایر اجزای صفحه بارگیری می‌شود(در حین بارگیری صفحه اسکریپت اجرا می‌شود)
  • اگر مقدار async تعیین نشده باشد و مقدار defer برابر با defer باشد در این حالت، پس از بارگیری کامل صفحه اسکریپت اجرا می‌شود.
  • اگر هیچ یک از خواص async و defer تعیین نشده باشند، در این حالت اسکریپت قبل از بارگیری کامل صفحه توسط مرورگر به سرعت بارگیری و فرخوانی خواهد شد.

تفاوت های تگ <script> در نسخه HTML 4.01 و HTML5

  1. خاصیت “type” در HTML 4 ضروری است در حالی که در نسخه 5 اختیاری می‌باشد.
  2. خاصیت “async” در نسخه HTML 5 وجود دارد.
  3. خاصیت “xml:space” موجود در نسخه 4 در نسخه HTML 5 پشتیبانی نمی‌شود.

 

تفاوت تگ <script> بین HTML و XHTML

در XHTML، محتوای اسکریپت به عنوان #PCDATA تعریف می شوند(به جای CDATA)، معنای آن این است که محتوای تگ تجزیه می‌شود.

در نتیجه در XHTML، همه کاراکتر های خاص باید encode شوند یا همه محتوا باید به بخش CDATA انتقال یابد.

<script type="text/javascript">
//<![CDATA[
var i = 10;
if (i < 5) {
  // some code
}
//]]&gt;
</script>

خاصیت‌ها

خاصیتمقدارتوضیح
AsyncAsyncتعیین می کند اسکریپت به صورت ناهمگام اجرا شود (فقط برای اسکریپت های بیرونی)
CharsetCharsetتعیین کننده نوع encoding کاراکتر های اسکریپت بیرونی
DeferDeferتعیین کننده اجرای اسکریپت پس از بارگیری صفحه(فقط برای اسکریپت های بیرونی)
Srcurlتعیین کننده آدرس اسکریپت بیرونی
TypeMedia_typeتعیین کننده نوع رسانه اسکریپت
Xml:spacePreserveتعیین کننده حفظ فاصله در کد(در نسخه 5 پشتیانی نمی شود)

 

نتیجه گیری

در این مقاله با تگ script که یک تگ برای معرفی کد‌های جاوا اسکریپت در HTML می‌باشد آشنا شدیم. راه‌های دیگری نیز برای معرفی کد‌های جاوا اسکریپت به سند HTML وجود دارد، با اینحال یکی از روش‌های خوب استفاده از تگ Script می‌باشد.

اگر سوال، انتقاد و نظری در رابطه با این مقاله داشتید خیلی خوشحال میشیم که برام بنویسید.

برچسب ها

علی اسمعیلی

درباره خودم گفتن یا نوشتن کار آسونی نیست. باید تو کم‌ترین حجم مهم‌ترین اطلاعات رو بنویسی. وقتی که اولین بار دستم به کیبورد خورد، ۶ سالم بود. حس جالبی بود؛ زندگیم شده بود ۴ تا کلید WASD روی کیبورد کامپیوتر برای کنترل ماشین. از ۱۰ سالگی که مادرم با فوتوشاپ کار می‌کرد کنارش نشستم و یاد گرفتم. ۱۳ سالم بود که اولین وب‌سایتم رو با پی اچ پی نیوک ایجاد کردم. تا الان وب سایت‌های زیادی رو شروع کردم و شاید به خاطر اینکه هدف تجربه کردن رو داشتم شکست خوردند. موفق‌ترین پروژه شکست خوردم رو می‌تونم اوکسو معرفی کنم که شاید اسمش رو شنیده باشید. الانم دارم کار‌هایی رو شروع می‌کنم چون با خودم عهد کرده بودم که تا بیست سالگی جاهای مختلفی کار کنم و تجربه کنم و بعد از تجربیاتم استفاده کنم. بعد از رسیدن به بیست سالگی خوشحالم که یکی از تجربیات خوبم همکاری با میزفاست و دارم ادامش میدم...

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا
سایت خود را در گوگل مدیریت کنید + ۱۵ ساعت فیلم آموزشیجزئیات بیشتر اینجا کلیک کنید
بستن
با موفقیت ثبت شد، میزفا از شما برای عضویت در خبرنامه هفتگی تشکر میکند.

عضویت در خبرنامه هفتگی برای دریافت:

  • فیلم و مقاله رایگان سئو
  • آموزش‌های UX ، GA و GTM
  • مقاله های تخصصی ASP.NET Core
  • اطلاع رسانی از محصولات
ترک میزفا خوب نیست!
دوره سئو، رایگان شد.
یک چیز متفاوت تجربه کنید
کاراکتر اشاره گر
دوره سئو، رایگان شد.
یک چیز متفاوت تجربه کنید
کاراکتر اشاره گر