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

استفاده از جاوا اسکریپت

دسته بندی : آموزش HTML سطح مقاله : متوسط زمان مطالعه : 2 دقیقه 28 آبان 1399
استفاده از جاوا اسکرپت

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

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

چگونه JavaScript را به HTML پیوند دهیم؟

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

همراه با HTML ، JavaScript می تواند به شما کمک کند پویایی و تعاملی را به وب سایت خود اضافه کنید یا اعتبار سنجی داده ها را انجام دهید. به طور خلاصه ، JavaScript به شما امکان می دهد عناصر HTML را دستکاری کنید:

<script>
function smile(sw) {
    if (sw == 0) {
        document.getElementById("learn").innerHTML = "SAD!";
    } else {
        document.getElementById("learn").innerHTML = "HAPPY!";
    }
    
}
</script>

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

<script type="application/javascript">
  document.getElementById("p").innerHTML = "It works!";
</script>

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

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

برای جاوا اسکریپت درون خطی ، شما به راحتی اسکریپت خود را بین تگ ها قرار می دهید:

<script>
function myExample() { 
    document.getElementById("learn").innerHTML = "Wow, I can use JavaScript!";
}
</script>

برای پیوند دادن یک اسکریپت JS خارجی به HTML ، باید از ویژگی src استفاده کنید و پیوندی به پرونده به عنوان مقدار آن اضافه کنید:

<script src="scripts-tag-example.js"></script>

قرار دادن تگ در JS

تگ های <script> را می توان در بخش <head> یا <body> سند قرار داد. گزینه اول ممکن است رایج تر باشد ، زیرا بیشتر توسعه دهندگان دوست دارند اسکریپت را از محتوا جدا نگه دارند. اگر قرار است بعداً محتوای JS بارگیری شود ، قرار دادن آن ها در <body> هوشمند است:

<script>
function myExample() {
    document.getElementById("learn").style.fontSize = "30px"; 
    document.getElementById("learn").style.color = "white";
    document.getElementById("learn").style.backgroundColor = "indianred";        
}
</script>

گزینه Fallback: استفاده از noscript

هنگام افزودن جاوا اسکریپت به HTML ، به خاطر داشته باشید که ممکن است مرورگر کاربر نتواند از اسکریپت JS پشتیبانی کند. برای چنین موردی ، توصیه می کنیم عنصر <noscript> را اضافه کنید. اگر JavaScript توسط مرورگر پشتیبانی نشود ، محتوای آن نمایش داده می شود:

<noscript>JavaScript is not supported by your browser.</noscript>

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

  • اگر هم جاوا اسکریپت داخلی و هم یک اسکریپت خارجی داشته باشید ، کد خارجی کد تعبیه شده را لغو می کند. با این حال ، این ممکن است باعث بروز مشکلات و رفتار غیرمنتظره مرورگر شود.
  • هنگامی که نیاز دارید از اسکریپت مشابه در چندین سند HTML استفاده مجدد کنید ، استفاده از یک فایل خارجی بهترین گزینه است.

دوره رایگان html را در دویکس دنبال کنید.

چه امتیازی به این مقاله می دید؟

5 / 0
[ 0 رای ]
مطالب مشابه

Related Posts