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

جاوا اسکریپت در HTML - افزودن کدهای جاوا اسکریپت به HTML


یک اسکریپت یک قطعه برنامه کوچکی است که می تواند تعامل را به وب سایت شما اضافه کند. به عنوان مثال، یک اسکریپت میتواند یک جعبه پیام هشدار به صورت pop-up ایجاد کند یا یک منوی کشویی ارائه دهد. این اسکریپت می تواند با استفاده از جاوا اسکریپت یا VBScript نوشته شود.

شما می توانید functionهای مختلفی را بنویسید، که  event handler نامیده می شوند و با استفاده از هر زبان اسکریپتی قابل نوشتن هستند و سپس می توانید این توابع را با استفاده از ویژگی های HTML اجرا کنید.

در حال حاضر، تنها JavaScript و  frameworkهای مربوط به آن، توسط بسیاری از توسعه دهندگان وب مورد استفاده قرار می گیرد، VBScript حتی توسط مرورگرهای مختلف پشتیبانی نمی شود.

شما می توانید کد جاوا اسکریپت را در یک فایل جداگانه نگه دارید و سپس آن را هر جا که لازم است وارد کنید یا می توانید function هایی داخل سند HTML تعریف کنید. بیایید هر دو این موارد را با مثال های مناسب، بررسی کنیم.

جاوا اسکریپت خارجی (External JavaScript)

اگر قصد تعریف یک قابلیت را دارید تا در اسناد مختلف HTML از آن استفاده کنید، بهتر است که این قابلیت را در یک فایل جاوا اسکریپت جداگانه قرار دهید و سپس آن فایل را در اسناد HTML خود قرار دهید. فایل های جاوا اسکریپت دارای پسوندهایی با نام  .js است و در فایل های HTML با استفاده از برچسب <script> درج می شوند.

مثال

تصور کنید ما یک تابع کوچک را با استفاده از جاوا اسکریپت در script.js تعریف می کنیم که دارای کد زیر است -

function Hello() {

   alert("Hello, World");

}

حال اجازه دهید نحوه استفاده از فایل جاوا اسکریپت خارجی فوق را در سند HTML زیر بیان کنیم-

<!DOCTYPE html>
<html>

   <head>
      <title>Javascript External Script</title>
      <script src = "/html/script.js" type = "text/javascript"/></script>
   </head>

   <body>
      <input type = "button" onclick = "Hello();" name = "ok" value = "Click Me" />
   </body>

</html>

گردانندگان رویدادها(()EventHandler)

Event handler ها چیزی جز توابع تعریف شده ی ساده نیستند که می توانند در برابر هر رویداد ماوس یا صفحه کلید فراخوانی شوند. شما می توانید منطق عملکرد خود را در یک Event handler تعریف کنید که می تواند از یک خط تا 1000 خط کد داشته باشد.

مثال زیر توضیح می دهد که چگونه یک event handler را بنویسیم. بیایید یک تابع SimpleHandler () را در هدر سند بنویسیم. ما این تابع را هنگامی که کاربر، ماوس را بر روی یک پاراگراف هدایت می کند، فراخوانی می کنیم.

<!DOCTYPE html>
<html>

   <head>
      <title>Event Handlers Example</title>
      <base href = "https://www.tutorialspoint.com/" />
      
      <script type = "text/JavaScript">
         function EventHandler() {
            alert("I'm event handler!!");
         }
      </script>
   </head>

   <body>
      <p onmouseover = "EventHandler();">Bring your mouse here to see an alert</p>
   </body>

</html>

پنهان کردن اسکریپت از مرورگرهای قدیمیتر

اگرچه امروزه، اغلبِ مرورگرها (اگرچه نه همه) جاوا اسکریپت را پشتیبانی می کنند اما هنوز بعضی از مرورگرهای قدیمی ای پیدا می شوند که قابلیت پشتیبانی از جاوا اسکریپت را ندارند. اگر یک مرورگر، جاوا اسکریپت را پشتیبانی نکند، به جای اینکه اسکریپت خود را اجرا کند، کد آن را به کاربر نشان می دهد. برای جلوگیری از این مسئله، شما می توانید به راحتی کدهای مربوط به کامنت گذاری در HTML را در اطراف اسکریپت قرار دهید. همانطور که در کد زیر نشان داده شده است.

JavaScript Example:
<script type = "text/JavaScript">
   <!--
      document.write("Hello JavaScript!");
   //-->
</script>

VBScript Example:
<script type = "text/vbscript">
   <!--
      document.write("Hello VBScript!")
   '-->
</script>

عنصر <noscript>

شما همچنین می توانید برای مرورگرهایی که از اسکریپت ها پشتیبانی نمی کنند و برای آن دسته از کاربرانی که گزینه script مرورگر خود را غیر فعال کرده اند، اطلاعات جایگزینی را ارائه دهید. شما می توانید با استفاده از برچسب <noscript> این کار را انجام دهید.

JavaScript Example:
<script type = "text/JavaScript">
   <!--
      document.write("Hello JavaScript!");
   //-->
</script>

<noscript>Your browser does not support JavaScript!</noscript>

VBScript Example:
<script type = "text/vbscript">
   <!--
      document.write("Hello VBScript!")
   '-->
</script>

<noscript>Your browser does not support VBScript!</noscript>

زبان پیش فرض اسکریپت

ممکن است که شما قصد داشته باشید از چندین فایل اسکریپت در سند خود استفاده کنید و برای این کار باید از چند تگ <script> استفاده نمایید. بدین منظور شما می توانید یک زبان اسکریپت پیش فرض، برای همه تگ های اسکریپت خود تعیین کنید. این عمل، باعث می شود که دیگر نیازی نباشد هر بار که شما از یک برچسب اسکریپت استفاده می کنید، زبان اسکریپت خود را  نیز بنویسید. به مثال زیر دقت کنید -

<meta http-equiv = "Content-Script-Type" content = "text/JavaScript" />

 

فصلِ: 5 , تعداد قسمت ها: 177 , سطح: صفر تا صد

این فصل در یک نگاه:

در این فصل صفحات قالب فروشگاهی را بطور کامل واکنشگرا می کنیم.…

HTML مخفف عبارت Hypertext Markup Language است. این زبان در واقع یک نوع زبان نشانه‌گذاری استاندارد برای ایجاد صفحات وب و وب اپلیکیشن‌ها محسوب می‌شود. در واقع HTML را عنصر کلیدی صفحات وب می‌…
فصلِ: 3 , تعداد قسمت ها: 25 , سطح: صفر تا صد

این فصل در یک نگاه:

فصل سوم…

آموزش طراحی ریسپانسیو مدرن و جذابتر نسبت به بوتسرپ (همراه با ساخت صفحه اصلی و پنل یک آژانس مسافربری) آموزش پروژه محور فریمورک متریالایز برای اولین بار بین وب سایت های آموزشی آموزش تمامی …
فصلِ: 5 , تعداد قسمت ها: 77 , سطح: متوسط

این فصل در یک نگاه:

ساخت منوی مدیریت سایت،ایجاد بخش دسته بندی ها ، جدول نمایش دسته ها و ایجاد دسته جدید،ایجاد بخش ویژگی های یک دسته،ایجاد وی…

این مجموعه با تلفیقی از فریمورک bootstrap  و کد های html و css  ارائه گردیده و پیش نیاز این آموزش ، دوره دیجی کالای آقای مهندس بلاغی است چون این پروژه در قالب mvc پیاده گردیده و با توجه به ا…
فصلِ: 11 , تعداد قسمت ها: 162 , سطح: صفر تا صد

این فصل در یک نگاه:

در این فصل(فصل یازدهم مجموعه)،به طراحی CMS (سیستم مدیریت محتوا)اختصاصی فروشگاه می پردازیم.هدف از طراحی این بخش،آنست که م…

در این مجموعه آموزشی قصد داریم از صفر تا صد طراحی یک فروشگاه اینترنتی رو به صورت کامل آموزش بدهیم.این فروشگاه شامل تمامی بخش های مورد نیاز یک فروشگاه اینترنتی است. هدف از این مجموعه،آموزش…
فصلِ: 4 , تعداد قسمت ها: 240 , سطح: صفر تا صد

این فصل در یک نگاه:

طراحی پنل مدیریت(دسته بندی)- دسته بندی یا category - نمایش دسته های فرعی در view با ورود به یکی از دسته های اصلی و آشن…

توضیحات کلی مجموعه: این مجموعه توسط فریمورک محبوب و دوست داشتنی bootstrap  و به صورت تضمینی  و صفر تا صد جهت یادگیری کارآموزان عزیز ارائه گردیده و دوستانی که این دوره را به طور کامل و دقیق…
فصلِ: 4 , تعداد قسمت ها: 368 , سطح: صفر تا صد

این فصل در یک نگاه:

مباحث تکمیلی فریم ورک لاراول…

فصل اول :آموزش مقدماتی فریم ورک لاراول معرفی فریم ورک لاراول و پیشنیازهای انجام کار انجام کانفیگ های اولیه برای نصب و راه اندازی فریم ورک معرفی روش های نصب پروژه لاراولی از طریق سایت گی…
فصلِ: 1 , تعداد قسمت ها: 155 , سطح: صفر تا صد

این فصل در یک نگاه:

مباحث مقدماتی فریم ورک react.js…

توضیحات کلی مجموعه: فصل اول : آشنایی با مباحث مقدماتی فریم ورک react.js نصب و راه اندازی node.js  و کلیه پیش نیازهای لازم نصب فریم ورک react روی لوکال و انجام تست های لازم آغاز آشنایی …
فصلِ: 1 , تعداد قسمت ها: 15 , سطح: متوسط

این فصل در یک نگاه:

رشد و درآمدزایی یک وب سایت یا کسب و کار اینترنتی کاملا به ذوق و مهارت وب مستر یا همان مدیر اصلی وب سایت گره خورده و متاس…

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

تولید شده توسط کلیک سایت

پشتیبانی آنلاین
آماده پاسخگویی هستیم
انتخاب تصویر جهت ارسال:
در حال ضبط صدا

(جهت توقف و یا لغو ضبط از دکمه های زیر استفاده کنید)

توقف و ارسال :
لغو ضبط
در حال حاضر تمامی کارشناسان آفلاین هستند. همواره می توانید با شماره تلگرام / واتساپ 09010005000 به صورت آنلاین با ما در ارتباط باشید. جهت ورود به واتساپ کلیک کنید
0 پیام جدید
پشتیبان در حال تایپ ...
ارسال تصویر ضبط صدا
0 کارشناسان آنلاین می باشند
این گفت و گو توسط پشتیبان به اتمام رسید