القائمة الرئيسية

الصفحات

JavaScript - Placement


 There is a flexibility given to include JavaScript code anywhere in an HTML document. However the most preferred ways to include JavaScript in an HTML file are as follows −

  • Script in <head>...</head> section.

  • Script in <body>...</body> section.

  • Script in <body>...</body> and <head>...</head> sections.

  • Script in an external file and then include in <head>...</head> section.

In the following section, we will see how we can place JavaScript in an HTML file in different ways.

هناك مرونة في تضمين كود JavaScript في أي مكان في مستند HTML. ومع ذلك ، فإن أكثر الطرق المفضلة لتضمين JavaScript في ملف HTML هي كما يلي - البرنامج النصي في <head> ... <رئيس> أقسام. برنامج نصي في ملف خارجي ثم تضمينه في <head> 

JavaScript in <head>...</head> section

If you want to have a script run on some event, such as when a user clicks somewhere, then you will place that script in the head as follows −


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

This code will produce the following results −

JavaScript in <body>...</body> section

If you need a script to run as the page loads so that the script generates content in the page, then the script goes in the <body> portion of the document. In this case, you would not have any function defined using JavaScript. Take a look at the following code.

إذا كنت بحاجة إلى برنامج نصي ليتم تشغيله أثناء تحميل الصفحة بحيث يقوم البرنامج النصي بإنشاء محتوى في الصفحة ، فإن النص البرمجي ينتقل إلى جزء <النص الأساسي> من المستند. في هذه الحالة ، لن يكون لديك أي وظيفة محددة باستخدام JavaScript. ألق نظرة على الكود التالي.


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

This code will produce the following results −

JavaScript in <body> and <head> Sections

You can put your JavaScript code in <head> and <body> section altogether as follows −


<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>

This code will produce the following result −

JavaScript in External File

As you begin to work more extensively with JavaScript, you will be likely to find that there are cases where you are reusing identical JavaScript code on multiple pages of a site.

You are not restricted to be maintaining identical code in multiple HTML files. The script tag provides a mechanism to allow you to store JavaScript in an external file and then include it into your HTML files.

Here is an example to show how you can include an external JavaScript file in your HTML code using script tag and its src attribute.

عندما تبدأ في العمل بشكل مكثف مع JavaScript ، فمن المحتمل أن تجد أن هناك حالات تقوم فيها بإعادة استخدام كود JavaScript متطابق في صفحات متعددة من الموقع. لست مقيدًا بالحفاظ على رمز متطابق في ملفات HTML متعددة. توفر علامة البرنامج النصي آلية للسماح لك بتخزين JavaScript في ملف خارجي ثم تضمينه في ملفات HTML الخاصة بك. فيما يلي مثال لإظهار كيف يمكنك تضمين ملف JavaScript خارجي في كود HTML الخاص بك باستخدام علامة البرنامج النصي وسمة src الخاصة به.

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

To use JavaScript from an external file source, you need to write all your JavaScript source code in a simple text file with the extension ".js" and then include that file as shown above.

For example, you can keep the following content in filename.js file and then you can use sayHello function in your HTML file after including the filename.js file.

لاستخدام JavaScript من مصدر ملف خارجي ، تحتاج إلى كتابة كل شفرة مصدر JavaScript في ملف نصي بسيط بامتداد ".js" ثم تضمين هذا الملف كما هو موضح أعلاه. على سبيل المثال ، يمكنك الاحتفاظ بالمحتوى التالي في ملف filename.js ثم يمكنك استخدام وظيفة sayHello في ملف HTML بعد تضمين ملف filename.js.

function sayHello() {
   alert("Hello World")
}
هل اعجبك الموضوع :

تعليقات