JS三种书写位置

JS三种书写位置

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JS三种书写位置</title>
    <style></style>
    <!-- 2.内嵌式的JS -->
    <!-- <script>
        alert('沙漠骆驼');
    </script> -->
    <!-- 3.引入外部JS文件 -->
    <script src="my.js"></script>
</head>

<body>
    <!-- JS有三种书写位置:行内、内嵌和外部 -->
    <!-- 1.行内式的JS 直接写到元素的内部-->
    <!-- 鼠标单击按钮,弹出秋香姐三个字 -->
    <!-- <input type="button" value="唐伯虎" οnclick="alert('秋香姐')"> -->
    <h4>1.行内式JS</h4>
    <ul>
        <li>可以将单行或少量JS代码写在HTML标签的事件属性中(以on开头的属性),如onclick。</li>
        <li>注意单双引号的使用:在HTML中我们推荐使用双引号,JS中推荐使用单引号</li>
        <li>可读性差,在HTML中编写JS大量代码时,不方便阅读</li>
        <li>引号易错,引号多层嵌套匹配时,非常容易弄混</li>
        <li>特殊情况下使用</li>
    </ul>
    <h4>2.内嵌JS</h4>
    <ul>
        <li>可以将多行JS代码写到script标签中</li>
        <li>内嵌JS是学习时常用的方式</li>
    </ul>
    <h4>外部JS文件</h4>
    <!-- 引入JS文件写法 -->
    <!-- <script src="my.js"></script> -->
    <ul>
        <li>利用HTML页面代码结构化,把大段JS代码独立到HTML页面之外,既美观又方便文件级别的复用</li>
        <li>引用外部JS文件的script标签中间不可以写代码</li>
        <li>适合于JS代码量比较大的情况</li>
    </ul>
</body>

</html>

my.js文件

alert('如果我是DJ,你会爱我吗?');

效果展示

在这里插入图片描述
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值