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

JavaScript(一）

news 2026/2/7 13:36:51

1.JavaScript 基本使用

2.JavaScript简单事件

3.JavaScript修改样式

4.JavaScript数据类型

JavaScript和Java有什么关系

知识点一 JavaScript基本使用

JS写在哪

还有一种写在中间的，也就是<head>里面

JS一些注意事项

JS修改元素内容

#JS获取对象<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><div class="box" id="box1">你好，世界</div><div class="box">捡起大王</div><input type="text" name="hello" placeholder="在坐的都是弟弟"><script>// 变量Idvar Id = document.getElementById('box1');console.log(Id);Id.innerText = 'hello world';//classvar Class = document.getElementsByClassName('box')[1];console.log(Class);Class.innerText = '捡起大王666';// 标签var None = document.getElementsByTagName('div')[0];console.log(None);//namevar Myname = document.getElementsByName('hello');console.log(Myname)//css选择器//取到直接返回，不会往下取var Select = document.querySelector('.box');console.log(Select);//取全部var Select = document.querySelectorAll('.box');console.log(Select);var Select = document.querySelectorAll('#box1');console.log(Select);</script>
</body>
</html>

知识点二 JS简单事件

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>div{width: 200px;height: 200px;background: purple;}</style>
</head>
<body><div id="box"></div><select name="" id=""><option value="nj">南京</option><option value="sj">苏州</option><option value="cz">常州</option></select><script>/*事件 是指JavaScript 捕获到用户的操作，并作出正确的响应。在事件的数中，有一个关键字this,代表当前触发事件的这个元素事件  用户操作元素  事件=函致鼠标事件:左键单击  onclick左键双击  ondblclick鼠标移入  onmouseover/onmouseenter ***鼠标移出  onmouseout/onnouseleave  ****/var oBox = document.getElementById('box');oBox.onclick = function (){this.innerHTML = '我被点击了'};oBox.ondblclick = function (){this.innerHTML = '我被双击了'};oBox.onmouseover = function (){this.innerHTML = '鼠标移入'this.style.backgroundColor = 'blue'};oBox.onmouseout = function (){this.innerHTML = '鼠标移出'this.style.backgroundColor = 'red'};window.onresize = function (){console.log('我在变化')}var sel = document.querySelector('select');sel.onchange = function (){console.log('下拉选择在变化')}</script>
</body>
</html>

知识点三修改样式

修改样式

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><input type="text" id="box1" value="捡起"><div id="box" style="width: 100px;height: 100px;background: red"></div><script>var oBox = document.getElementById('box')// oBox.style.width = '50px';oBox.onclick = function (){// oBox.style.width = '400px';// oBox.style.height = '400px';// oBox.style.background = 'blue'oBox.style.cssText = 'width:400px;height:400px;background:yellow'};oBox.style.marginLeft = '100px';oBox.style['margin-left'] = '50px';oBox.style['width'] = '400px';var a = 'width';var b = '300px';oBox.style['a'] = 'b';var In = document.getElementById('box1').valuealert(In)</script>
</body>
</html>

JS操作标签属性

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><a href="http://baidu.com" id="box" xy = 'jianqi' target="_blank" class="wrap">去百度</a>
<script>/*js操作元素的标签属性:input 标签 value规范的标签属性:. 符号直接操作 (可读可写)不规范(自定义)的标签属性获取.getAttribute()设置.setAttribute()移除.removeAttribute()注意:所有的 路径 颜色 获取 的结果不一定是你写的内容通过Id获取的元素赋值给变量后，假设修改了Id，这个变量还是表示这个元素自定义标签属性的操作方式，同样可以操作符合规范的属性*/var oA = document.getElementById('box');oA.target = "_self";// oA.href = 'http://vip.com';// alert(oA.id)// alert(oA.className)alert(oA.getAttribute('xy'));oA.setAttribute('xy','fufu');alert(oA.getAttribute('xy'));oA.removeAttribute('xy');alert(oA.getAttribute('xy'));
</script>
</body>
</html>

知识点四 JavaScript数据类型

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><script>// stringconsole.log(typeof'8');// numberconsole.log(typeof 1234.11);// booleanconsole.log(typeof true);// objectconsole.log(typeof [1,2,3,4,5]);console.log(typeof {name:'jianqi'});console.log(typeof []);console.log(typeof null);function f() {}console.log(typeof f);// undefinedvar y;console.log(typeof y);var v = Symbol(1234);console.log(typeof v);</script>
</body>
</html>

JavaScript(一）

1.JavaScript 基本使用 2.JavaScript简单事件 3.JavaScript修改样式 4.JavaScript数据类型 JavaScript和Java有什么关系知识点一 JavaScript基本使用 JS写在哪还有一种写在中间的，也就是<head>里面 JS一些注意事项 JS修改元素内容 #JS获取对象<…...

编程日记 2024/12/4 19:02:44

Day 32 动态规划part01

今天正式开始动态规划！理论基础无论大家之前对动态规划学到什么程度，一定要先看我讲的动态规划理论基础。如果没做过动态规划的题目，看我讲的理论基础，会有感觉是不是简单题想复杂了？其实并没有，我讲的理论基础内容，在动规章节所有题目都有运用，所以很重要！…...

编程日记 2024/12/4 19:01:43

winform跨线程更新界面

前言： 大家好，我是上位机马工，硕士毕业4年年入40万，目前在一家自动化公司担任软件经理，从事C#上位机软件开发8年以上！我们在开发C#程序的时候，有时候需要在非Ui主线程更新界面，为了…...

编程日记 2024/12/4 18:58:39

【合作原创】使用Termux搭建可以使用的生产力环境（二）

前言上期文章没看的可以先从上期文章开始看起【合作原创】使用Termux搭建可以使用的生产力环境（一）-CSDN博客目前我们已经完成了FinalShell ssh连接手机Termux的功能了，这期我们继续朝我们的目标前进。今天早上有读者进群以为生成环境指…...

编程日记 2024/12/4 18:57:39

微积分复习笔记 Calculus Volume 2 - 3.3 Trigonometric Substitution

3.3 Trigonometric Substitution - Calculus Volume 2 | OpenStax...

编程日记 2024/12/4 18:56:38

vue2+svg+elementui实现花瓣图自定义el-select回显色卡图片

项目需要实现花瓣图，但是改图表在echarts，highCharts等案例中均未出现，有类似的韦恩图，但是和需求有所差距； 为实现该效果，静态图表上采取svg来手动绘制花瓣： 确定中心点，以该点为中…...

编程日记 2024/12/4 18:54:35

记录一次网关异常

记一次网关异常网关时不时就会出现下面的异常。关键是不知道什么时候就会报错，并且有时候就算什么都不操作，也会导致这个异常。 ERROR org.springframework.scheduling.support.TaskUtils$LoggingErrorHandler - Unexpected error occurred in schedul…...

编程日记 2024/12/4 18:52:33

计算机网络——不同版本的 HTTP 协议

介绍 HTTP，即超文本传输协议（HyperText Transfer Protocol），是应用层的一个简单的请求-响应协议，它指定了客户端可能发送给服务器什么样的消息以及得到什么样的响应。本文将介绍 HTTP 协议各个版本。 HTTP/1.0 HTTP/1…...

编程日记 2024/12/4 18:49:30

git clone https://github.com/hiyouga/LLaMA-Factory.git cd LLaMA-Factory pip install -e . pip install tf-keras[dataset_info.json](dataset_info.json) 包含了所有可用的数据集。如果您希望使用自定义数据集，请**务必**在 dataset_info.json 文件中添加*数据…...

编程日记 2024/12/4 18:46:27

vue2 虚拟DOM 和真实DOM （概念、作用、Diff 算法）

虚拟 DOM 和真实DOM（概念、作用、Diff 算法） 1.1 概念真实 DOM（Document Object Model）：是浏览器中用于表示文档结构的树形结构。 <h2>你好</h2>虚拟DOM：用 JavaScript 对象来模拟真实 DOM…...

编程日记 2024/12/4 18:44:25

GEOBench-VLM:专为地理空间任务设计的视觉-语言模型基准测试数据集

2024-11-29 ,由穆罕默德本扎耶德人工智能大学等机构创建了GEOBench-VLM数据集，目的评估视觉-语言模型（VLM）在地理空间任务中的表现。该数据集的推出填补了现有基准测试在地理空间应用中的空白，提供了超过10,000个经过人工验证的指…...

编程日记 2024/12/4 18:39:18

说说Elasticsearch查询语句如何提升权重？

大家好，我是锋哥。今天分享关于【说说Elasticsearch查询语句如何提升权重？】面试题。希望对大家有帮助； 说说Elasticsearch查询语句如何提升权重？ 1000道互联网大厂Java工程师精选面试题-Java资源分享网在 Elasticsearch 中&…...

编程日记 2024/12/4 18:35:15

2-2-18-9 QNX系统架构之文件系统（一）

阅读前言本文以QNX系统官方的文档英文原版资料为参考，翻译和逐句校对后，对QNX操作系统的相关概念进行了深度整理，旨在帮助想要了解QNX的读者及开发者可以快速阅读，而不必查看晦涩难懂的英文原文，这些文章将会作为一个…...

编程日记 2024/12/4 18:33:12

Unity类银河战士恶魔城学习总结（P156 Audio Settings音频设置）

【Unity教程】从0编程制作类银河恶魔城游戏_哔哩哔哩_bilibili 教程源地址：https://www.udemy.com/course/2d-rpg-alexdev/ 本章节实现了音频的大小设置与保存加载音频管理器 UI_VolumeSlider.cs 定义了 UI_VolumeSlider 类，用于处理与音频设置相关的…...

编程日记 2024/12/4 18:32:10

springboot vue 会员收银系统 (12)购物车关联服务人员订单计算提成开源

前言完整版演示 http://120.26.95.195/ 开发版演示 http://120.26.95.195:8889/ 在之前的开发进程中，我们完成订单的挂单和取单功能，今天我们完成购物车关联服务人员，用户计算门店服务人员的提成。 1.商品关联服务人员服务人员可以选择一…...

编程日记 2024/12/4 18:31:09

P3916 图的遍历(Tarjan缩点和反向建边）

P3916 图的遍历 - 洛谷 | 计算机科学教育新生态写法一：Tarjan 思路：先运用Tarjan算法得到每个连通块中最大的编号，然后对每个连通块进行缩点重新建图，进行dfs，得到缩点后的连通块能够达到的最大编号。 Code: conste…...

编程日记 2024/12/4 18:28:07

Android13 允许桌面自动旋转

一）需求-场景 Android13 实现允许桌面自动旋转 Android13 版本开始后，支持屏幕自动旋转，优化体验和兼容性，适配不同屏幕主界面可自动旋转二）参考资料 android framework13-launcher3【06手机旋转问题】 Launcher默…...

编程日记 2024/12/4 18:27:05

cocotb value cocotb—基础语法对照篇

cocotb—基础语法对照篇 import cocotb from cocotb.triggers import Timer from adder_model import adder_model from cocotb.clock import Clock from cocotb.triggers import RisingEdge import randomcocotb.test() async def adder_basic_test(dut):"""Te…...

编程日记 2024/12/4 18:26:02

001-SpringBoot整合日志

SpringBoot整合日志一、引入依赖二、配置 application.yml三、配置文件 logback.xml四、配置文件 WebConfigurerAdapter五、配置常量文件六、配置拦截器七、效果展示一、引入依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId&…...

编程日记 2024/12/4 18:22:59

【Java基础面试题011】什么是Java中的自动装箱和拆箱？

相关知识补充：《Java从入门到精通(JDK17版)》_尚硅谷电子书.pdf Autism_Btkrsr/Blog_md_to_pdf - 码云 - 开源中国 (gitee.com) 回答重点自动装箱：Java编译器自动将基本数据类型转换为包装类型自动拆箱：Java编译器自动将包装类转换为基…...

编程日记 2024/12/4 18:21:54

conda相比python好处

Conda 作为 Python 的环境和包管理工具，相比原生 Python 生态（如 pip 虚拟环境）有许多独特优势，尤其在多项目管理、依赖处理和跨平台兼容性等方面表现更优。以下是 Conda 的核心好处： 一、一站式环境管理&#xff1a…...

编程新知 2025/11/29 6:54:19

【解密LSTM、GRU如何解决传统RNN梯度消失问题】

解密LSTM与GRU：如何让RNN变得更聪明？ 在深度学习的世界里，循环神经网络（RNN）以其卓越的序列数据处理能力广泛应用于自然语言处理、时间序列预测等领域。然而，传统RNN存在的一个严重问题——梯度消失&#…...

编程新知 2025/12/24 1:45:14

ffmpeg（四）：滤镜命令

FFmpeg 的滤镜命令是用于音视频处理中的强大工具，可以完成剪裁、缩放、加水印、调色、合成、旋转、模糊、叠加字幕等复杂的操作。其核心语法格式一般如下： ffmpeg -i input.mp4 -vf "滤镜参数" output.mp4或者带音频滤镜： ffmpeg…...

编程新知 2026/2/4 23:47:47

IT供电系统绝缘监测及故障定位解决方案

随着新能源的快速发展，光伏电站、储能系统及充电设备已广泛应用于现代能源网络。在光伏领域，IT供电系统凭借其持续供电性好、安全性高等优势成为光伏首选，但在长期运行中，例如老化、潮湿、隐裂、机械损伤等问题会影响光伏板绝缘层…...

编程新知 2026/2/1 6:36:36

SpringCloudGateway 自定义局部过滤器

场景： 将所有请求转化为同一路径请求（方便穿网配置）在请求头内标识原来路径，然后在将请求分发给不同服务 AllToOneGatewayFilterFactory import lombok.Getter; import lombok.Setter; import lombok.extern.slf4j.Slf4j; impor…...

编程新知 2026/2/1 4:53:36

A2A JS SDK 完整教程：快速入门指南

目录什么是 A2A JS SDK?A2A JS 安装与设置A2A JS 核心概念创建你的第一个 A2A JS 代理A2A JS 服务端开发A2A JS 客户端使用A2A JS 高级特性A2A JS 最佳实践A2A JS 故障排除什么是 A2A JS SDK? A2A JS SDK 是一个专为 JavaScript/TypeScript 开发者设计的强大库&#xff…...

编程新知 2025/12/12 8:42:24

多模态图像修复系统：基于深度学习的图片修复实现

多模态图像修复系统：基于深度学习的图片修复实现 1. 系统概述本系统使用多模态大模型（Stable Diffusion Inpainting）实现图像修复功能，结合文本描述和图片输入，对指定区域进行内容修复。系统包含完整的数据处理、模型训练、推理部署流程。 import torch import numpy …...

编程新知 2025/9/9 21:28:16