JavaScript入门笔记（一）

差点意思的鸭鸭

已于 2022-11-06 10:23:12 修改

阅读量161

点赞数 2

分类专栏：笔记文章标签： xml javascript 前端

于 2022-11-06 10:06:43 首次发布

本文链接：https://blog.csdn.net/YIYIYAYA1124/article/details/127712582

版权

笔记专栏收录该内容

5 篇文章 0 订阅

订阅专栏

一、JavaScript

（一）特点

（二）作用

（三）网页中插入JavaScript脚本的方法

1.行内式

2.嵌入式

3.链接式

一、JavaScript

（一）特点

1.基于对象的语言：预定义对象、自定义对象

2.事件驱动的语言：事件响应程序

3.动态性：直接对用户输入作出反应

4.简单性：在浏览器中解释执行

5.节省交互时间：在客户端执行，无需流量

6.跨平台性：只依赖浏览器

7.安全性：沙箱机制

（二）作用

1. 校验用户输入的表单内容

2. 动态添加网页内容

3. 为静态网页增加一些特效（如动画效果）

4. 操纵 HTML元素（改变元素的属性和内容）

（三）网页中插入JavaScript脚本的方法

1.行内式

直接将脚本嵌入到HTML标记的事件中

格式：on 事件名 =" 代码段"

代码：

<!DOCTYPE html>
<html>
     <head>
     <meta charset="utf-8"/>
     <title>行内式插入脚本</title>
     </head>
     <body>
         <p onClick="alert('Hello, the WEB world!');">
         Click Here 
         </p>
     </body>
</html>

2.嵌入式

使用<script> 标记将脚本嵌入到 HTML 的 <head> 和 <body>中

格式：<script> 代码段</script>

代码：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"/>
        <title>嵌入式插入脚本</title>
        <script>
            function msg () { //单行注释:建立函数
             /*多行注释: 函数体，弹出消息警告框*/
            alert("Hello, the WEB world!"); 
            }
         </script>
    </head>
    <body>
         <p onClick="msg()">Click Here</p> <!-- 调用函数 -->
    </body>
</html>

3.链接式

通过 <script> 标记的 src属性链接外部脚本文件

格式： <script src=" 脚本文件名 "> 代码段</script>

代码：

JS.js

//在脚本文件里不需<script>标签
function msg () { //建立函数
    alert (“Hello,the WEB world!”);
}

main.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset=“utf=8”/>
        <title>链接式插入脚本文件</title>
        <script src="JS.js" ></script>
    </head>
    <body>
        <p onClick="msg()">Click Here</p>
    </body>
</html>