js学习总结

这里写目录标题

  • 前情提要
  • JavaScript书写位置
    • 1. 内部javaScript ==(不常用)==
    • 2. 外部javaScript ==(常用)==
    • 3.内联javaScript ==(常用)==
  • js中的输入和输出
    • 输出语法
      • 1. document.write('')
      • 2. alert('')
      • 3. console.log('')
    • 输入语法
      • prompt('')

前情提要

1. 在javaScript中的 分号 是可以省略的

JavaScript书写位置

1. 内部javaScript (不常用)

直接写在html文件里 , 用script标签包住
通常放在html文件中的底部—>文件是按顺序加载的 , 要先加载完上面的代码 , 再执行js的代码

<script type="text/javascript">
	console.log('hello word!');
</script>
  • 全部 .html 文件
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
    <script type="text/javascript">
      console.log('hello word!');
    </script>
	</head>
	<body>
	</body>
</html>

  • 运行结果
    在这里插入图片描述

2. 外部javaScript (常用)

<script type="text/javascript" src="js/js01.js"></script>
  • html文件代码
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
    <script type="text/javascript" src="js/js01.js"></script>
	</head>
	<body>
	</body>
</html>

  • js文件代码
console.log('hello wwwww');
  • 运行结果
    在这里插入图片描述

  • 创建一个 .js文件 (用来书写js代码)
    在这里插入图片描述

3.内联javaScript (常用)

代码写在标签内部

<button onclick="alert('啊哈哈哈')">点一下</button>
  • 完整 .html
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
	
    <button onclick="alert('啊哈哈哈')">点一下</button>
    
	</body>
</html>

  • 运行结果
    在这里插入图片描述

js中的输入和输出

输出语法

1. document.write(‘’)

作用 : 向body内输出内容
注意 : 如果输出的内容写的是标签 , 也会被解析成网页元素(也就是说 , 可以在write中直接写 标签)

  • .js 文件
document.write('这是document.write');
document.write('<h1>这是一个h1的标签</h1>');

上面的js代码相当于 在html中这么写

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
	
    这是documen.write
    <h1>这是一个h1标签</h1>
    
	</body>
</html>

  • 运行结果
    在这里插入图片描述

2. alert(‘’)

  • 作用 : 页面弹出警告对话框

3. console.log(‘’)

  • 作用 : 在控制台输出内容 (一般是程序员调试用的)

这两个在上面的js书写位置中用到了 , 就不做过多赘述了

输入语法

prompt(‘’)

  • 作用 : 显示一个对话框 , 对话框中包含一条文字信息 , 用来提示用户输入文字

  • js代码

prompt('请输入一个信息');
  • 运行结果
    在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/543760.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

rocketmq面试

broker主从复制机制 同步复制&#xff1a; 等Master和Slave均写成功后&#xff0c;才反馈给客户端写成功状态&#xff1b; 如果Master出故障&#xff0c; Slave上有全部的备份数据&#xff0c;容易恢复&#xff0c;但是同步复制会增大数据写入延迟&#xff0c;降低系统吞吐量。…

SMS垃圾短信识别项目

注意&#xff1a;本文引用自专业人工智能社区Venus AI 更多AI知识请参考原站 &#xff08;[www.aideeplearning.cn]&#xff09; 项目背景 随着数字通信的快速发展&#xff0c;垃圾短信成为了一个普遍而烦人的问题。这些不请自来的消息不仅打扰了我们的日常生活&#xff0c;…

视频基础学习六——视频编码基础三(h264框架配合图文+具体抓包分析 万字)

系列文章目录 视频基础学习一——色立体、三原色以及像素 视频基础学习二——图像深度与格式&#xff08;RGB与YUV&#xff09; 视频基础学习三——视频帧率、码率与分辨率 视频基础学习四——视频编码基础一&#xff08;冗余信息&#xff09; 视频基础学习五——视频编码基础…

Redis漏洞利用

未授权 可以利用超级弱口令工具来判断redis是否能未授权登录 telnet #尝试登录info #查看redis信息 RCE方法 写shell 需要写权限需要知道web网站路径 config set dir /var/www/html config set dbfilename redis.php set test "<?php phpinfo(); ?>" sa…

低成本,高效能:探索物联网新宠LoRa

LoRa是什么&#xff1f; LoRa是一种物联网无线传输技术&#xff0c;利用调制解调器实现低功耗远距离数据传输。其基本工作原理是通过基站发送数据到特定终端设备&#xff0c;实现双向数据传输。 LoRa无线传输技术是一种为低功耗和低成本设计的无线技术&#xff0c;用于实现远距…

mybatis的使用技巧7——mysql中in,exists,join的用法和区别

在实际项目开发中&#xff0c;sql查询中的连表查询和子查询用的是最多的&#xff0c;但是很多人对于in&#xff0c;exists&#xff0c;join的用法认识不足&#xff0c;随意运用&#xff0c;这种情况如果在大数据量查询时&#xff0c;会存在很大的隐患。 一.子查询&#xff08;…

transformer入门知识解析——新手必看

对应课程&#xff1a;Transformer简明教程, 从理论到代码实现到项目实战, NLP进阶必知必会._哔哩哔哩_bilibili 1.初识transformer结构 transformer的结构&#xff1a; 编码器解码器的内部结构&#xff1a; Self Attention 表示自注意力机制 Feed Forward 表示全连接层 2.计算…

45.HarmonyOS鸿蒙系统 App(ArkUI)创建列表(List)

列表是一种复杂的容器&#xff0c;当列表项达到一定数量&#xff0c;内容超过屏幕大小时&#xff0c;可以自动提供滚动功能。它适合用于呈现同类数据类型或数据类型集&#xff0c;例如图片和文本。在列表中显示数据集合是许多应用程序中的常见要求&#xff08;如通讯录、音乐列…

springBoot+vue编程中使用mybatis-plus遇到的问题

mybatis-plus中遇到的问题Code Companion Servlet.service() for servlet [dispatcherServlet] in context with path [] threw exception [Request processing failed; nested exception is org.apache.ibatis.binding.BindingException: Invalid bound statement (not found)…

如何正确使用数字化仪前端信号调理?(一)

一、前言 板卡式的数字转换器和类似测量仪器&#xff0c;比如图1所示的德思特TS-M4i系列&#xff0c;都需要为各种各样的特性信号与内部模数转换器&#xff08;ADC&#xff09;的固定输入范围做匹配。 图1&#xff1a;德思特TS-M4i系列高速数字化仪&#xff0c;包括2或4通道版…

大模型项目整体规划、技术选型和案例分析经验分享

1 项目整体规划 1.1 明确场景 toB or toC&#xff08;面向企业还是面向消费者&#xff09; toB&#xff08;面向企业&#xff09;&#xff1a;指的是产品或服务主要面向其他企业或组织。这类产品通常需要解决特定的商业问题&#xff0c;强调效率和集成性&#xff0c;并且可能需…

机器学习-随机森林温度预测模型优化

文章目录 前言旧模型训练新模型训练参数查看组合参数训练学习模型评估 前言 在机器学习-随机森林算法预测温度一文中&#xff0c;通过增大模型训练数据集和训练特征的方式去优化模型的性能&#xff0c;本文将记录第三方种优化方式&#xff0c;通过调整随机森林创建模型参数的方…

10.哀家要长脑子了!

1. 704. 二分查找 - 力扣&#xff08;LeetCode&#xff09; 哎哟 我去 我还以为你都搞懂了 呵呵 当时问题出现在右边界初始化 左闭右开 右边界是取不到的 int left 0, right nums.size() ; while(left < right) { int mid left (right - left) / 2; if( target > …

数据可视化高级技术Echarts(堆叠柱状图)

目录 一.如何实现 二.代码展示 1.stack名称相同&#xff08;直接堆叠&#xff09; 2. stack名称不相同&#xff08;相同的堆叠&#xff0c;不同的新生成一列&#xff09; 一.如何实现 数据堆叠&#xff0c;同个类目轴上系列配置相同的 stack 值可以堆叠放置。即在series中…

前端三件套学习笔记(持更)

目录 1、HTML,CSS,JS区别 2、HTML结构 1、HTML,CSS,JS区别 结构写到 HTML 文件中&#xff0c; 表现写到 CSS 文件中&#xff0c; 行为写到 JavaScript文件中。 2、HTML结构 <!DOCTYPE html> <html><head><title>我的第一个页面</title><…

城市选择器小程序实现

1.效果图 2.使用方法 # 城市选择器&#xff0c; 城市数据库可自己导出 ##后台数据API 由HotApp小程序统计提供并维护&#xff0c;如果需要导出并部署在公司的生产环境&#xff0c;最后有SQL导出下载地址 ## 使用方法 - 复制pages/district到你的项目目录 - 把样式文件distr…

4/11 QT_day5

服务器端 头文件 #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QTcpServer> #include <QMessageBox> #include <QTcpSocket> #include <QList> QT_BEGIN_NAMESPACE namespace Ui { class Widget; } QT_END_NAMESPACEclass …

Java应用CPU飙升和死锁排查实战教程

引言 在日常开发中&#xff0c;我们可能会遇到Java应用CPU飙升和死锁的问题。本文将通过实际案例&#xff0c;为大家介绍如何排查这些问题 Java应用CPU飙升和死锁排查步骤 先执行top命令&#xff0c;找到CPU占用比较高的进程再执行jstack 进程id > dump.txt找到进程中CPU…

[GDC24]TheFInals的破坏系统

GDC24上TheFinals的开发工作室–EmbarkStudios带来; TheFinals把实时破坏在主流游戏上提升到了新的高度,可以说是新的标杆,达成了: 可以出现大规模的任意破坏破坏之后充分影响gameplay,可以把建筑任意炸毁之后,坍塌的建筑继续保留&物理正确(有正确的网络同步),可以废墟中继…

2024HW --> 安全产品 Powershell无文件落地攻击

在HW中&#xff0c;除了了解中间件&#xff0c;web漏洞&#xff0c;这些攻击的手法&#xff0c;还得了解应急响应&#xff0c;安全产品&#xff0c;入侵排查&#xff0c;溯源反制...... 那么今天&#xff0c;就来说一下安全产品&#xff08;安全公司我就不说了&#xff0c;这个…