永康网站建设南京网站建设公司

潮州市湘桥区南春索菲亚婚纱摄影中心 2026/09/09 19:30:55

1、JS

(1)核心语法

(a)引入方法

首先是内部脚本:

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>JS学习</title> <script> // 弹窗 alert("hello"); </script> </head> <body> <script> // 弹窗 alert("hello world"); </script> </body> <script> // 弹窗 alert("world"); </script> </html>

会弹出3次!

外部引入:

创建一个后缀为js的文件:

alert("hello world");

以下是全部代码:

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>JS学习</title> </head> <body> <!--<script>--> <!-- // 弹窗--> <!-- alert("hello world");--> <!--</script>--> <script src="js/learn.js"></script> </body> </html>

结果如下:

总结:

(b)变量

(c)数据类型

(d)函数

(e)自定义对象

<script> let user={ name:'张三', age: 18, sex:'男', sing(){ alert(this.name+'会唱歌'); } } user.sing(); </script>

(f)JSON

将js对象转换成json字符串: <script> let person={ name:'张三', age: 18, sex:'男', } alert(JSON.stringify(person)); </script>

同理,如果想获取JSON下某个属性对应的值时,应该先将其转换成js对象,之后获取

(g)DOM

querySelector获取到的是匹配到的第一个对象:

<body> <h1 id="test1">111</h1> <h1>222</h1> <h1>333</h1> <script> let h1=document.querySelector('#test1'); // innerHTML:设置或返回元素的内容 alert(h1.innerHTML); // 将上述id=test1的输入111改为了下面的内容 h1.innerHTML="输入111"; </script> </body>

返回h1此时的内容

返回修改后的内容

使用querySelectorAll时表示选取的是数组,在下面调用的时候要用数组的格式

(h)事件监听

因此第二种方法不推荐,绑定同一事件容易被覆盖

习题:

<script> let d=document.querySelectorAll('tr'); //为每一个tr标签添加鼠标滑入事件 for(let i=0;i<d.length;i++){ d[i].addEventListener('mouseover',function (){ d[i].style.backgroundColor='#f2e2e2'; }); //为每一个tr标签添加鼠标滑出事件 d[i].addEventListener('mouseout',function (){ d[i].style.backgroundColor='#fff'; }); } </script>

结果和上图一样,鼠标到那一行哪一行就变为红色!

从js文件引入另一个js文件:

将引入的文件先要“暴露”

在要用的文件中进行引入

之后在html引入js时,需要将以上声明为模块化js:

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

房产网站建设莆田网站建设

如何让 ESP32 真正“永不掉线”?深度实现 Wi-Fi 自动重连机制在开发物联网设备时,你是否遇到过这样的场景:设备部署到客户现场后,某天突

2026/06/30 12:13:30

装饰网站建设山西网站建设

第一章:Docker MCP 网关负载均衡的核心概述在现代微服务架构中,Docker 容器化技术与 MCP(Management Control Plane&

2026/06/30 13:10:34

怎么建设网站广州网站建设

A站视频下载终极神器:AcFunDown新手完全指南【免费下载链接】AcFunDown包含PC端UI界面的A站 视频下载器。支持收藏夹、UP主视频批量下载 😳仅供交流学习

2026/06/30 10:19:20

胶州网站建设湖北网站建设

快速体验打开 InsCode(快马)平台 https://www.inscode.net输入框内输入如下内容:在快马平台设计一个用于智能手环的LDO电路。要求:1. 输入电

2026/06/30 11:54:58

甘肃网站建设仙桃网站建设

如何免费获取《暮光之城》完整高清电子书:终极收藏指南【免费下载链接】Twilight-暮光之城中英文全集PDF下载介绍探索《暮光之城》的奇幻世界,体验贝拉与爱德华跨越生死的

2026/06/30 12:21:30

网站建设价格潜江网站建设

容器存储技术:Flocker、GlusterFS、Ceph、NFS及Docker卷的深入解析1. Flocker数据持久化与迁移Flocker是一个强大的工具,可实现容器数据的持久化和迁移。下面将介绍

2026/06/30 13:42:37

安徽网站建设网站建设平台

1.2 揭秘 OpenAI Function Calling 内部原理,手写第一个文件搜索工具导语:在上一章中,我们了解了 Function Calling

2026/06/30 11:20:25

网站建设流程asp网站建设

大麦网抢票神器:5分钟快速上手Python自动化购票指南【免费下载链接】DamaiHelper大麦网演唱会演出抢票脚本。项目地址: https://gitcode.com/gh_mirr

2026/06/30 11:07:23

济南营销型网站建设网站建设信息

angChain4j 和 Solon AI 是 Java 生态中实现大模型应用开发的重要框架,但二者的区别是啥?生产级别又该使用哪种框架?令很多人犯了难&#x

2026/06/30 10:41:21

关于网站的建设上海公司网站建设

Dify平台在商业AI应用中的核心优势分析在企业竞相拥抱AI的今天,一个现实问题摆在面前:如何让大语言模型(LLM)真正落地到业务场景中

2026/06/30 13:00:04