js简介以及在html中的2种使用方式(hello world)

这篇具有很好参考价值的文章主要介绍了js简介以及在html中的2种使用方式(hello world)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

简介

javascript :是一个跨平台的脚本语言;是一种轻量级的编程语言。

JavaScript 是 Web 的编程语言。所有现代的 HTML 页面都使用 JavaScript。

HTML: 结构

css: 表现

JS: 行为

HTML+CSS 只能称之为静态网页,加入js网页则有了灵魂称之为动态网页

脚本语言的特点:

不能独立运行,要依赖网页;

可插入 HTML 页面的编程代码。

插入 HTML 页面后,可由所有的现代浏览器执行。

javascript 在网页中使用的两种方式:

方式1:直接在script标签中编写;

方式2:引用外部js代码

注意

1.可以有多个script标签,多个script标签都是自上而下顺序执行

2.alert()的作用:控制浏览器弹出一个警告对话框

方式1实例:直接在script标签中编写

1.新建一个html文件(如:demo.html),并将下述内容写入文件中

<!DOCTYPE HTML>
	<html>
	<title>hello world</title>
	<body>
	
	</body>
</html>

2.在html文件中插入一个script标签

<script>alert("hello world"); </script>
<script>alert("hello world-2"); </script>

 

3.将html文件用浏览器打开,即可看见hello world

js简介以及在html中的2种使用方式(hello world),前端(html+css+js)知识点杂烩,javascript,html,开发语言

点击确定后,可以看见hello world-2

js简介以及在html中的2种使用方式(hello world),前端(html+css+js)知识点杂烩,javascript,html,开发语言

demo.html完整文件内容如下:

<!DOCTYPE HTML>
<html>
    <title>hello world</title>
    <body>

        <script>alert("hello world"); </script>
        <script>alert("hello world-2"); </script>

    </body>
</html>

方式2实例:引用外部js代码

1.新建一个html文件(如:demo.html),并将下述内容写入文件中

<!DOCTYPE HTML>
	<html>
	<title>hello world</title>
	<body>
	
	</body>
</html>

2.在html文件(如:demo.html)同目录下新建一个js文件(如:demojs.js),并将下述内容写入文件中

alert("hello world");

3.在html文件中引用外部js代码(如:demojs.js)

<script src="./demojs.js">alert("hello world-2");</script>
<script>alert("hello world-3");</script>

 

4.将html文件用浏览器打开,即可看见hello world

js简介以及在html中的2种使用方式(hello world),前端(html+css+js)知识点杂烩,javascript,html,开发语言

点击确定后,可以看见hello world-3

js简介以及在html中的2种使用方式(hello world),前端(html+css+js)知识点杂烩,javascript,html,开发语言

demo.html完整文件内容如下:

<!DOCTYPE HTML>
<html>
    <title>hello world</title>
    <body>

        <script src="./demojs.js">alert("hello world-2");</script>
        <script>alert("hello world-3");</script>

    </body>
</html>

注意:script标签一旦引入外部文件,就不能编写代码了,即使写了浏览器也会自动忽略。

如果需要再创建一个script代码即可。文章来源地址https://www.toymoban.com/news/detail-660419.html

到了这里,关于js简介以及在html中的2种使用方式(hello world)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • MNIST手写数字辨识-cnn网路 (机器学习中的hello world,加油)

    用PyTorch实现MNIST手写数字识别(非常详细) - 知乎 (zhihu.com) 参考来源(这篇文章非常适合入门来看,每个细节都讲解得很到位) 一、模块函数用法-查漏补缺: 1.关于torch.nn.functional.max_pool2d()的用法: 上述示例中,输入张量 input 经过最大池化操作后,使用了 kernel_size=2 和 strid

    2024年02月09日
    浏览(26)
  • Visual Studio 2022 MASM x64汇编hello world以及调试(Console版 + Windows版)

    本文介绍使用Visual Studio 2022的MASM开发x64汇编程序hello world的环境配置和汇编代码,作为学习CPU指令的起点。分两个版本的hello world, 一个是console版本,另一个是windows版本。 首先安装visual studio community 2022,下载地址 https://visualstudio.microsoft.com/,安装时选择C++开发模块 安装好以

    2024年02月05日
    浏览(80)
  • 程序员的周末——硬件设计中的Hello World__STM32核心板绘制

    目录 1 原理图库的创建 1.1 原理图库创建过程中用到的操作或者快捷键 2 PCB封装库的创建 2.1 PCB封装库创建过程中用到的操作或者快捷键 3 原理图设计​​​​​​​ 3.1 原理图设计过程中使用到的功能菜单或者快捷键记录 4 PCB元器件布局 4.1 布局之后完整的PCB 4.2 PCB布局过程中

    2024年01月20日
    浏览(87)
  • 【JavaWeb】使用Servlet实现输出 hello world

    之前讲过如何使用IDEA创建Servlet项目. 因此创建项目这一步就不过多介绍了 有需要的可以看一下➡IDEA专业版和社区版创建Servlet项目 今天介绍如何使用Servlet输出一个\\\"hello world\\\". 示例: 解释一下 @WebServlet(\\\"/hello\\\") 这是什么意思 @WebServlet()会根据某些GET请求会生效, 然后里面写的

    2024年02月09日
    浏览(41)
  • Android中AIDL的简单使用(Hello world)

    AIDL:Android Interface Definition Language(Android接口定义语言) 作用:跨进程通讯。如A应用调用B应用提供的接口 A应用创建aidl接口,并且创建一个Service来实现这个接口(在onBind方法里面return我们这个接口的实例)。 把A应用创建的aidl文件原封不动的搬至B应用中(注意包名类名都

    2024年02月11日
    浏览(37)
  • windows下cmake的小白级入门使用教程(hello world)

    想学习cmake,基于惯性思维,想先跑通一个“hello world”的例子,奈何网上教程一大把,有用的教程破费功夫寻找。大部分教程都没有从新电脑(重装系统后的电脑)的角度讲述步骤。 为了得到干净的电脑环境,研究了一段时间VMware虚拟机,并写了几篇文章,感兴趣的读者可移步

    2024年02月14日
    浏览(28)
  • 使用 GNU 汇编语法编写 Hello World 程序的三种方法

    本篇我们使用汇编来写一个经典的  Hello world  程序。 运行环境: OS:Ubuntu 18.04.5 LTS x86-64 gcc:version 4.8.5 在用户空间编写汇编程序输出字符串,有三种方法: 调用C库函数  printf 使用软中断  int 0x80 使用  syscall 系统调用 下面对三种方法,分别进行说明。 为了更好的理解汇

    2024年02月06日
    浏览(40)
  • 编程笔记 Golang基础 007 第一个程序:hello world 使用Goland

    开始在Goland环境中编程go语言代码啦。 打开GoLand软件。 选择 “File”(文件)菜单,然后点击 “New Project”(新建项目)或使用快捷键 Ctrl+Shift+A 并搜索 “New Project”。 在新建项目向导中,选择 “Go” 并点击 “Next” 按钮。 配置项目设置: 为项目选择一个合适的保存位置。

    2024年02月20日
    浏览(33)
  • 使用Microsoft Visual Studio 2022创建C语言项目并打印Hello World

    安装Visual Studio 安装C++环境 创建新项目 选择C++语言 创建空项目 填入自己的项目名称 新建源文件 9. 添加新项 10. 选择C++文件 将创建的文件名后缀改为.C文件 11. 填入代码 运行调试 12. 输出结果到控制台

    2024年02月13日
    浏览(48)
  • 【小黑嵌入式系统第八课】初识PSoC Creator™开发——关于PSoC Creator&下载、创建项目、单片机中的hello world(点亮一个led)

    上一课: 【小黑嵌入式系统第七课】PSoC® 5LP 开发套件(CY8CKIT-050B )——PSoC® 5LP主芯片、I/O系统、GPIO控制LED流水灯的实现 下一课: 【小黑嵌入式系统第九课】PSoC 5LP第一个实验——LED、字符型LCD显示实验 本课程主要介绍了 PSoC® 5LP, 一个基于 ARM® Cortex®-M3 的可编程片上系

    2024年02月03日
    浏览(41)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包