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

花半垄(深圳)精品旅舍管理有限公司 2026/09/09 19:10:41

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:

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

南昌网站建设四川网站建设

深夜的图书馆灯火通明,电脑屏幕上闪烁的光标仿佛在嘲笑你,又过去了一小时,论文字数只增加了不到200字。“还有三天就要交初稿了…”小李揉了揉布满血丝的眼睛&#x

2026/06/30 13:31:06

旅游网站建设株洲网站建设

Excalidraw水印功能开启方式在远程协作日益深入的今天,可视化工具早已不只是“画图”那么简单。像 Excalidraw 这样以手绘风格著称的开源白板,正被越来越多的技

2026/06/30 11:25:25

网站建设中图片凯里网站建设

CellProfiler终极指南:5步掌握生物图像自动分析技术【免费下载链接】CellProfilerAn open-source application for biological

2026/06/30 12:00:29

咸阳网站建设荥阳网站建设

5分钟快速上手!Umi-OCR免费PDF处理工具实战指南【免费下载链接】Umi-OCRUmi-OCR: 这是一个免费、开源、可批量处理的离线OCR软件,适用于Windows

2026/06/30 11:52:28

门户网站建设杭州营销型网站建设

第一章:智谱清言Open-AutoGLM概述智谱清言Open-AutoGLM是基于AutoGLM技术构建的开放语言模型平台,旨在为开发者与研究者提供高效、灵活的大模型应用能

2026/06/30 10:39:21

唐山网站建设公司网站建设的

第一章:量子并行计算与C++的融合前景量子计算凭借其叠加态与纠缠特性,能够在特定问题上实现指数级加速。随着量子硬件逐步迈向实用化,如何将经典编

2026/06/30 10:38:21

渭南网站建设句容网站建设

安卓VCAM虚拟相机终极教程:3步实现完美摄像头替换【免费下载链接】com.example.vcam虚拟摄像头 virtual camera项目地址: https://gitcode.c

2026/06/30 13:25:05

网站建设广告深圳外贸网站建设

背景与意义大数据旅游数据分析与推荐系统基于Django框架开发,结合大数据技术,旨在解决传统旅游行业信息过载、个性化服务不足等问题。通过整合海量旅游数据(如用

2026/06/30 13:05:04

网站建设论文网站建设运营

GPS信号模拟器终极指南:快速搭建SDR软件定义卫星导航测试环境【免费下载链接】gps-sdr-simSoftware-Defined GPS Signal Simulator项目地址:

2026/06/30 11:53:28

湘潭网站建设内蒙古网站建设

终极指南:如何在macOS上激活第三方鼠标侧键功能【免费下载链接】sensible-side-buttonsA macOS menu bar app that enables syste

2026/06/30 13:40:07