了解Web前端4-JavaScript动态脚本语言

2023-05-16

JavaScript 动态脚本语言

    • 1.页面中直接嵌入JavaScript代码
    • 2.连接外部JavaScript文件

JavaScript 是 web 开发人员必须学习的 3 门语言中的一门:

  1. HTML 定义了网页的内容
  2. CSS 描述了网页的布局
  3. JavaScript 控制了网页的行为

JavaScript是一种可以嵌入在HTML代码中由客户端浏览器运行的脚本语言。在网页中使用JavaScript代码,不仅可以实现网页特效,还可以响应用户请求实现动态交互功能。

通常,在Web页面中使用JavaScript有以下两种方法,一种是在页面中直接嵌入JavaScript代码,另一种是连接外部JavaScript文件。

1.页面中直接嵌入JavaScript代码

如需在 HTML 页面中插入 JavaScript,请使用 <script> 标签。

<script></script> 会告诉 JavaScript 在何处开始和结束。

<script></script> 之间的代码行包含了 JavaScript:

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>测试(runoob.com)</title> 
</head>
<body>
	
<h1>我的第一个 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
<script>
function myFunction(){
	document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
</body>
</html>

2.连接外部JavaScript文件

也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。

外部 JavaScript 文件的文件扩展名是 .js。

如需使用外部文件,请在 <script> 标签的 “src” 属性中设置该 .js 文件:

外部脚本不能包含 <script> 标签。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>测试(runoob.com)</title> 
</head>
<body>

<h1>我的 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
<p><b>注释:</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p>
<script src="myScript.js"></script>

</body>
</html>

myScript.js 文件代码如下:

function myFunction() { 
   document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数"; 
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

了解Web前端4-JavaScript动态脚本语言 的相关文章

  • Modbus Slave学习笔记

    第一章 初识Modbus 1 1什么是Modbus 简而言之 xff0c Modbus通信协议是工业领域通信协议的业界标准 xff0c 并且是当前工业电子设备之间相当常用的连接方式之一 Modbus 协议是应用于电子控制器上的一种通用语言
  • command 'gcc' failed with exit status 1错误问题的解决办法

    在写Python代码的时候 xff0c 需要用到psutil模块 xff0c 需要安装 在安装psutil 模块的时候出现的问题 xff0c 重新安装了gcc等各种我能想到的 xff0c 不过还是不行 网上说是其实安装一个对应的devel环
  • Ubuntu 18.04 配置Ros melodic

    更新时间2021 04 09 ROS简介 1 添加ROS软件源 你可能对源的概念理解不深 xff0c 没关系 xff0c 先简单理解为系统获取资源的地址 xff0c 跟着做即可 设置软件源 xff1a 国外 xff1a sudo sh c
  • Linux进程管理(一) Linux进程的基本概念

    Linux进程的基本概念 最后更新时间2020 04 09 Ubuntu linux的所有任务都是在操作系统内核的调度下由CPU执行 xff0c 很多时候 xff0c Linux是将任务和进程的概念合在一起 进程的标准定义 xff1a 进程
  • Ubuntu wifi适配器未找到

    先蓝牙共享手机网络或在usb共享打开 软件与更新 xff0c 进入 附加驱动 选项卡 xff0c 如果网络正常 xff0c 且源设置正常 xff0c 一般能搜到对应的无线网卡驱动 xff0c 安装之后再重启电脑就可以了 要注意你的bois是
  • ROS简介

    1 什么是 ROS 机器人是一个系统工程 xff0c 它涉及机械 电子 控制 通信 软件等诸多学科 以前 xff0c 开发一个机器人需要设计机械 画电路板 写驱动程序 设计通信架构 组装集成 调试 以及编写各种感知决策和控制算法 xff0c
  • Linux用户及权限管理(一)用户和组

    更新时间2020 04 09 1 ubuntu 用户系统概述 ubuntu linux 是一个多用户多任务的分时操作系统 任何一个要使用系统资源的用户 xff0c 都必须先要向系统管理员申请一个账号 xff0c 然后以这个账号的身份进入系统
  • Linux用户及权限管理(二)用户和组管理命令

    更新时间2020 05 12 在第一节中将了图形界面的用户管理 xff0c 本节讲解与用户和组管理相关的shell命令 1 配置文件 第一节中讲到 etc passwd文件 xff0c 它记录了当前操作系统中所有用户的基本信息 xff1a
  • Linux用户及权限管理(三)权限管理

    更新时间2020 05 13 在使用windows的时候关于权限管理的操作不多 xff0c 大家遇到比较多的应该是 xff1a 使用管理员身份才能正常运行某个程序 xff0c 或者删除某个文件 xff1b hosts文件无法修改 xff0c
  • C# 快速入门笔记

    最后更新时间2020 04 10 C 快速入门精简笔记 Chapter 0 前言Chapter 1 基础1 1 简介1 2 环境1 3 程序结构1 4 基本语法1 5 数据类型1 5 1 value types1 5 2 Reference
  • MATLAB的一点小tips

    更新时间2020 04 15 目录 1 matlab运算符2 matlab特殊变量和常量3 matlab保存工作区4 who 和whos5 长任务6 format 1 matlab运算符 运算符目的 43 加 xff1b 加法运算符 减 x
  • MATLAB矩阵和数组相关函数解析

    更新时间2020 04 15 未完结 目录 1 总表2 简单示例2 1 zeros2 2 ones2 3 rand2 4 true and false2 5 eye 1 总表 点击表中函数名可以跳转至官方网站查看精确英文解析 xff0c 也
  • HTTPS、SSL、TLS三者之间的联系和区别

    SSL Secure Socket Layer 安全套接层 是基于HTTPS下的一个协议加密层 xff0c 最初是由网景公司 xff08 Netscape xff09 研发 xff0c 后被IETF xff08 The Internet E
  • Word论文公式的两个格式问题

    更新时间2020 04 16 1 公式居中 xff0c 编号右对齐 solution xff1a 编写一个样式 xff0c 一劳永逸 你要居中 xff0c 你要右对齐 xff0c 先要有个参考 即你居中的 中 是哪里 xff0c 右对齐的
  • HTML- markdown版 江城子·乙卯正月二十日夜记梦

    江城子 乙卯正月二十日夜记梦 宋 苏轼 十年生死两茫茫 xff0c 不思量 xff0c 自难忘 千里孤坟 xff0c 无处话凄凉 纵使相逢应不识 xff0c 尘满面 xff0c 鬓如霜 夜来幽梦忽还乡 xff0c 小轩窗 xff0c 正梳妆
  • Keil μvision已停止工作?

    今天以及几周前我都遇到了这个问题 xff0c 提示消息都是一样的 xff0c Keil vision已停止工作 xff0c 接着keil就自己关闭了 我两次的原因不一样 1 第一次 用的是F407的板子 xff0c 排查了半天错误 xff0
  • 负数取余,取余和取模

    1 圆整 就是把一个小数或者说浮点数按某种规律近似为一个它左边或右边最近的一个整数 比如 xff1a 向负无穷圆整 span class token number 1 8 span span class token operator gt
  • [joint_state_publisher-3] process has died

    我是ROS melodic xff0c 其他版本应该一样的解决方法 去掉urdf xacro launch文件中的中文注释 xff0c 或者改为英文 xff0c 而且第一行不能有中文
  • Ubuntu 18.04安装N卡驱动

    1 原来 xff0c 是英特尔的集显 2 添加N卡驱动 检查是否有GPU显卡 xff0c 我电脑一张集显 xff0c 一张独显 xff0c 很清楚 如果不清楚的可以用 lspci grep i nvidia查看 xff1a linux202
  • ROS Melodic Arbotix报错

    ImportError dynamic module does not define module export function PyInit tf2 xff09 这是我做的内容 xff1a 1 创建一个四轮小车URDF模型 xff0c

随机推荐

  • Matlab画线性规划可行域

    线性规划什么的应该是运筹学的内容 xff0c 虽然数学建模比赛不会考这个 xff0c 但大家日常学习还是会遇到相关的问题 除了用单纯型法 xff0c 也可以用传统的画图法 xff0c 画出可行域 xff0c 再寻求可行解 可行域一般手画更快
  • 浅谈论文目录制作

    先来看咱们CSDN的目录 Markdown语句 xff1a 一级标题 二级标题 三级标题 四级标题 五级标题 六级标题 效果如下 一级标题 二级标题 三级标题 四级标题 五级标题 六级标题 我们论文中的目录道理也是一样 xff0c 无非就是
  • Linux文件系统(一)文件系统基本概念

    文件系统基本概念 1 文件系统概述2 文件系统的类型 xff08 1 xff09 ext系列 xff08 2 xff09 Reiserfs 3 Ubuntu文件系统的结构 xff08 1 xff09 概述 xff08 2 xff09 路径
  • 47、基于51单片机万年历温度闹钟农历阳历LCD 12864显示系统设计

    摘要 本文介绍了基于STC89C52单片机的多功能电子万年历的硬件结构和软硬件设计方法 本设计由数据显示模块 温度采集模块 时间处理模块和调整设置模块四个模块组成 系统以STC89C52单片机为控制器 xff0c 以串行时钟日历芯片DS13
  • Linux文件系统(二)交换分区

    1 交换分区的概念 2 交换分区的管理
  • Linux文件系统(三)文档压缩及解压缩

    1 文档压缩概述 2 图形化归档工具 3 命令行工具
  • Linux文件系统(四)文件系统管理命令

    1 文件系统的基本操作 2 目录的基本操作 3 查看文件内容 4 文件类型 5 查询文件 6 其他管理命令
  • EndNote文献管理(一)雾里看花

    简介
  • EndNote文献管理(二)基操勿六

    1 创建文献数据库并添加文献1 1创建文献数据库1 2在线检索1 3批量导入1 4导入知网文献 2 文献管理2 1文献标记与排序2 2文献速览与下载全文2 3文献阅读与批注 3 编辑参考文献格式 1 创建文献数据库并添加文献 1 1创建文献
  • SQL Server(2019) 实验一 数据库和表的建立

    数据库和表的建立 一 实验目的二 实验内容和要求2 1 数据库的创建 2 2 表的创建 查看 修改和删除 2 2 1 xff0e 表的创建 2 2 2 xff0e 向创建的表中添加数据记录 2 2 3 xff0e 修改表结构 xff08 找
  • SQL Server 中时间的几种表示

    在SQL Server中 xff0c 点开数据类型 xff0c 单单是时间这一类变量都有着多重数据类型 datetimetimestampdatetimedatetime2datetimeoffset 他们的显示效果如下 xff1a spa
  • SQL Server(2019) 实验二 单表查询

    单表查询 一 实验目的二 实验内容和要求2 1 表结构修改2 1 1 xff0e 在实验三的所建立的数据库中增加Teacher表 xff0c 结构如下 xff1a 2 1 2 xff0e 在实验三的所建立的数据库中增加Teaching表 x
  • SQL Server(2019)导入excel数据

    要导入的excel文件如图所示 xff0c 600个记录 操作步骤 xff1a 1 在要导入的数据库上右键 xff0c 任务 xff0c 导入数据 2 选择数据源为excel xff0c 选择相应excel文件 xff0c 选择excel版
  • SQL Server(2019)导出excel数据

    目标 xff1a 将Grademanager数据库中的test表导出为excel test表内容 xff1a 如图 xff0c 600条记录 操作步骤 xff1a 1 在相应数据库上右键 xff0c 任务 xff0c 导出数据 2 选择数据
  • 机器视觉特征提取介绍:HOG、SIFT、SURF、ORB、LBP、HAAR

    一 概述 这里主要记录自己的一些感悟 xff0c 不是很系统 想要详细系统的理论 xff0c 请参考文末的 图像处理之特征提取 个人不是专业cv工程师 xff0c 很多细节没有深究 xff0c 描述可能不严谨 在总结物体检测算法之前先把基础
  • ROS低调复习总结

    ROS复习 一 考试时间 形式 日期二 题型三 不知道随便写四 课程知识点 难点1 1 3章课后复习题1 1 单元测试一1 2 单元测试二1 3 单元测试三 2 第二章 ROS系统架构2 1 比较Topic与Service通信2 2 关闭一
  • 了解Web前端-1 Http基本原理

    HTTP基本原理 1 HTTP协议2 HTTP与Web服务器3 浏览器中的请求和响应1xx 信息2xx 成功3xx 重定向4xx 客户端错误5xx 服务器错误 1 HTTP协议 Hyper Text Transfer Protocol xf
  • 了解Web前端2-HTML语言

    HTML语言 1 什么是HTML2 了解HTML结构4 HTML的基本标签4 1 不是标签4 2 文件开始标签 96 96 4 3文件头部标签 96 96 4 4文件标题标签 96 96 4 5元信息标签 96 96 4 6页面的主体标签
  • 了解Web前端3-CSS层叠样式表

    CSS样式层叠表 1 CSS 概述2 属性选择器2 1属性选择器2 2属性和值选择器2 3属性和值的选择器 多值 3 类和ID选择器3 1ID选择器3 2类选择器3 3为特定元素使用class 1 CSS 概述 CSS是一种标记语言 xff
  • 了解Web前端4-JavaScript动态脚本语言

    JavaScript 动态脚本语言 1 页面中直接嵌入JavaScript代码2 连接外部JavaScript文件 JavaScript 是 web 开发人员必须学习的 3 门语言中的一门 xff1a HTML 定义了网页的内容CSS 描述