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

JavaScript(一）

news 2026/2/9 16:35:33

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

[特殊字符] 智能合约中的数据是如何在区块链中保持一致的？

🧠 智能合约中的数据是如何在区块链中保持一致的？ 为什么所有区块链节点都能得出相同结果？合约调用这么复杂，状态真能保持一致吗？本篇带你从底层视角理解“状态一致性”的真相。一、智能合约的数据存储在哪里&#xf…...

编程新知 2025/10/25 17:23:41

P3 QT项目----记事本（3.8）

3.8 记事本项目总结项目源码 1.main.cpp #include "widget.h" #include <QApplication> int main(int argc, char *argv[]) {QApplication a(argc, argv);Widget w;w.show();return a.exec(); } 2.widget.cpp #include "widget.h" #include &q…...

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

GitHub 趋势日报 (2025年06月08日)

📊 由 TrendForge 系统生成 | 🌐 https://trendforge.devlive.org/ 🌐 本日报中的项目描述已自动翻译为中文 📈 今日获星趋势图今日获星趋势图 884 cognee 566 dify 414 HumanSystemOptimization 414 omni-tools 321 note-gen …...

编程新知 2025/12/13 1:32:15

MySQL中【正则表达式】用法

MySQL 中正则表达式通过 REGEXP 或 RLIKE 操作符实现（两者等价），用于在 WHERE 子句中进行复杂的字符串模式匹配。以下是核心用法和示例： 一、基础语法 SELECT column_name FROM table_name WHERE column_name REGEXP pattern; …...

编程新知 2025/11/21 22:02:37

微软PowerBI考试 PL300-在 Power BI 中清理、转换和加载数据

微软PowerBI考试 PL300-在 Power BI 中清理、转换和加载数据 Power Query 具有大量专门帮助您清理和准备数据以供分析的功能。您将了解如何简化复杂模型、更改数据类型、重命名对象和透视数据。您还将了解如何分析列，以便知晓哪些列包含有价值的数据，…...

编程新知 2026/1/30 9:51:12

Android第十三次面试总结（四大组件基础）

Activity生命周期和四大启动模式详解一、Activity 生命周期 Activity 的生命周期由一系列回调方法组成，用于管理其创建、可见性、焦点和销毁过程。以下是核心方法及其调用时机： onCreate() 调用时机：Activity 首次创建时调用。…...

编程新知 2025/10/15 15:07:34

Docker 本地安装 mysql 数据库

Docker: Accelerated Container Application Development 下载对应操作系统版本的 docker ；并安装。基础操作不再赘述。打开 macOS 终端，开始 docker 安装mysql之旅第一步 docker search mysql 》〉docker search mysql NAME DE…...

编程新知 2026/2/6 21:43:26

保姆级教程：在无网络无显卡的Windows电脑的vscode本地部署deepseek

文章目录 1 前言2 部署流程2.1 准备工作2.2 Ollama2.2.1 使用有网络的电脑下载Ollama2.2.2 安装Ollama（有网络的电脑）2.2.3 安装Ollama（无网络的电脑）2.2.4 安装验证2.2.5 修改大模型安装位置2.2.6 下载Deepseek模型 2.3 将deepse…...

编程新知 2026/2/6 16:59:24

NPOI Excel用OLE对象的形式插入文件附件以及插入图片

static void Main(string[] args) {XlsWithObjData();Console.WriteLine("输出完成"); }static void XlsWithObjData() {// 创建工作簿和单元格,只有HSSFWorkbook,XSSFWorkbook不可以HSSFWorkbook workbook new HSSFWorkbook();HSSFSheet sheet (HSSFSheet)workboo…...

编程新知 2025/10/6 2:06:51

淘宝扭蛋机小程序系统开发：打造互动性强的购物平台

淘宝扭蛋机小程序系统的开发，旨在打造一个互动性强的购物平台，让用户在购物的同时，能够享受到更多的乐趣和惊喜。淘宝扭蛋机小程序系统拥有丰富的互动功能。用户可以通过虚拟摇杆操作扭蛋机，实现旋转、抽拉等动作，增…...

编程新知 2026/1/31 7:11:11