محل نوشتن کدهای جاوا اسکریپت - آموزش جاوا اسکریپت

در این شرایط در کنارتون هستیم 💚 آواسام

لیست محتوای این بخش

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

در مورد محل نوشتن کدهای جاوا اسکریپت انعطاف پذیری بالائی وجود دارد و تقریبا شما در هر جایی از سند html میتوانید کدهای جاوا اسکریپت را بنویسید و اجرا کنید .

هرچند لیست زیر شامل روش های ترجیحی قرارگیری کدهای جاوا اسکریپت درون سند html میباشد :

درون تگ <head>...</head>
درون تگ <body>...</body>
درون هر دو تگ <body>...</body> و <head>...</head>
کدنویسی کردن درون یک فایل جدا و لود کردن در تگ <head>...</head>

در ادامه ، شیوه های اضافه کردن کدهای جاوا اسکریپت به سند html را بصورت مفصل یاد میگیریم

نوشتن کدهای جاوا اسکریپت در بخش <head>...</head> :

اگر شما بخواهید کدهای جاوا اسکریپت خود را درون تگ head در سند html قرار دهید . قبل از لود شدن تگ body کدهای جاوا اسکریپت شما لود میشود و برای اینکه یک متن ساده را به کاربر نشان دهید باید به شکل زیر کدنویسی کنید :

<html>
   <head>      
      <script type = "text/javascript">
         <!--
            function sayHello() {
               alert("Hello World")
            }
         //-->
      </script>     
   </head>
   
   <body>
      <input type = "button" onclick = "sayHello()" value = "Say Hello" />
   </body>  
</html>

در مثال بالا میبینید که تگ script درون تگ head قرار گرفته است و کدهای جاوا اسکریپت به این شکل درون تگ head نوشته میشود .

نوشتن کدهای جاوا اسکریپت در بخش <body>...</body> :

شما میتوانید کدهای جاوا اسکریپت خود را درون تگ body و لابه لای کدهای html بنویسید . در این حالت همزمان با لود شدن body کدهای جاوا اسکریپت هم لود میشود

مثال :

<html>
   <head>
   </head>
   
   <body>
      <script type = "text/javascript">
         <!--
            document.write("Hello World")
         //-->
      </script>
      
      <p>This is web page body </p>
   </body

نوشتن کدهای جاوا اسکریپت هم در تگ head و هم تگ body :

شما میتوانید کدهای جاوا اسکریپت را هم درون تگ head که در بخش اول بالا مشاهده کردید بنویسید هم در تگ body که در بخش دوم مشاهده کردید .

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

مثال :

<html>
   <head>
      <script type = "text/javascript">
         <!--
            function sayHello() {
               alert("Hello World")
            }
         //-->
      </script>
   </head>
   
   <body>
      <script type = "text/javascript">
         <!--
            document.write("Hello World")
         //-->
      </script>
      
      <input type = "button" onclick = "sayHello()" value = "Say Hello" />
   </body>
</html>

نوشتن کدهای جاوا اسکریپت در فایل مجزا :

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

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

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

در مثالی که برای شما آورده ایم شما مشاهده میکنید که در تگ head ما یک تگ script تعریف کردیم که خاصیت src دارد و در خاصیت src مسیر قرار گیری فایل جاوا اسکریپت را معرفی میکنیم

<html>
   <head>
      <script type = "text/javascript" src = "filename.js" ></script>
   </head>
   
   <body>
      .......
   </body>
</html>

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

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

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

function sayHello() {
   alert("Hello World")
}

اتمام

محصولات برگزیده مناسب شما

دوره ی آموزش ویوجی اس ( Vuejs 3) پروژه محور به همراه Nuxt js دوره ی آموزش جاوااسکریپت-صفرتاصد کارگاه آموزشی کار با Grunt js

آواسام ، با کیفیت ترین پلتفرم آموزشی برنامه نویسی

هزاران نفر با استفاده از دوره های آموزشی آواسام در طول سالهای گذشته توانسته اند وارد دنیای برنامه نویسی و کسب و کار آنلاین و اینترنتی شوند ، هدف آواسام تولید دوره های آموزشی منحصر به فرد با تمرکز روی پروژه های واقعی هست تا شما بتوانید یادگیری مباحث تخصصی را درون پروژه های واقعی یاد بگیرید

آواسام دارای نماد اعتماد الکترونیکی و مجوزهای لازم می باشد برای ارتباط با آواسام میتوانید از طریق لینک ارتباط با ما در فوتر سایت با ما ارتباط برقرار کنید

ثبت نام دوره های آواسام

پرمخاطب ترین و باکیفیت ترین پلتفرم آموزش برنامه نویسی

دوره های آموزشی

ساخته شده با عشق در آواسام

تمام حقوق محفوظ است