当前位置: 首页 > news >正文

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('请输入一个信息');
  • 运行结果
    在这里插入图片描述
http://www.lryc.cn/news/338703.html

相关文章:

  • MES实施优势有哪些?MES制造执行系统的主要内容
  • ChatGPT 和 Elasticsearch:使用 Elastic 数据创建自定义 GPT
  • 废品回收 小程序+APP
  • 下载好了annaconda,但是在创建一个新的Conda虚拟环境报错
  • 如何安装MacOS的虚拟机?mac安装虚拟机的步骤 虚拟机安装MacOS VMware Fusion和Parallels Desktop19
  • Flutter 中 AutomaticKeepAliveClientMixin 的介绍及使用
  • 注意力机制篇 | YOLOv8改进之清华开源ACmix:自注意力和CNN的融合 | 性能速度全面提升
  • Go语言支持重载吗?如何实现重写?
  • Spring中基于事件监听驱动 和 线程池的异步任务
  • C++ 优先级队列用法详解与模拟实现
  • Linux进阶之旅:深入探索Linux的高级功能
  • 【Java】内存可见性问题是什么?
  • Guava里一些比较常用的工具
  • 在windows系统中【.gz.tar】和【.whl】文件分别应该怎么下载到conda的某个虚拟环境中
  • Rust - 数据类型
  • 基于springboot实现洗衣店订单管理系统项目【项目源码+论文说明】计算机毕业设计
  • Java基础知识总结(53)
  • 196算法之谜在 JSP 中使用内置对象 request 获取 form 表单的文本框 text 提交的数据。
  • 初识责任链模式--一起学习吧之数据库
  • 解决Xshell登录云服务器的免密码和云服务器生成子用户问题
  • webRtc生产环境实用方法
  • Java String、StringBuffer
  • LangChain调用tool集的原理剖析(包懂)
  • 如何正确使用数字化仪前端信号调理?(一)
  • 实验5 流程图和盒图ns图
  • [Java、Android面试]_18_详解Handler机制 常见handler面试题(非常重要,非常高频!!)
  • 国内开通gpt会员方法
  • 使用 Meltano 将数据从 Snowflake 导入到 Elasticsearch:开发者之旅
  • 第24次修改了可删除可持久保存的前端html备忘录:文本编辑框不再隐藏,又增加了哔哩哔哩搜索和必应搜索
  • 二极管分类及用途