JavaScript在html中的引用方式

     HTML是网页的结构,CSS是网页的外观,而JavaScript是页面的行为。

      JavaScript在HTML的引用共有4种:

  • (1)页头引入(head标签内);
  • (2)页中引入(body标签内);
  • (3)元素事件中引入(标签属性中引入);
  • (4)引入外部JS文件;

  • 一、页头引入JS

    在页头引入JS,指的就是在<head></head>标签内编写JavaScript。

    语法:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <head>
        <title></title>
        <script type="text/javascript">
            //这里编写JavaScript程序
        </script>
    </head>
    <body>
    </body>
    </html>

    二、页中引入JS

    在页中引入JS,指的就是在<body></body>标签内编写JavaScript。

    语法:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <head>
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            //这里编写JavaScript程序
        </script>
    </body>
    </html>

    三、元素事件中引入JS

    在元素事件中引入JS,就是指在元素的某一个属性中直接编写JavaScript程序或调用,这个属性指的是元素的“事件属性”。

    举例1:(在元素事件属性中直接编写JavaScript)

    1
    2
    3
    4
    5
    6
    7
    8
    <head>
        <title></title>
    </head>
    <body>
        <input type="button" onClick="alert('绿叶学习网')" value="按钮"/>
    </body>
    </html>

    举例2:(元素事件属性调用JavaScript函数)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    <head>
        <title></title>
        <script type="text/javascript">
            function alertMessage()
            {
                alert("绿叶学习网");
            }
        </script>
    </head>
    <body>
        <input type="button" onclick="alertMessage()" value="按钮"/>
    </body>
    </html>

    四、引入外部JS文件

    引入外部JS文件,说白了就是把JavaScript程序存放在一个后缀名为.js的文件中,然后使用link标签来引用。此外,引用外部JS文件的link标签必须放在<head></head>内。

    语法:<script src="js/index.js" type="text/javascript"></script>

  • 参考文献:http://www.lvyestudy.com/les_js/js_1.3.aspx


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章