boy快快长大

JavaScript笔记

1. 前端知识体系(学习路线)
2.前端三要素
3.行为层 JavaScript
4.UI框架
5.JavaScript构建工具
6. JavaScript引入方式
7. JavaScript语法
- 7.1数据类型:
- 7.2 变量声明和赋值
- 7.3运算符
- 7.4 方法声明
- 7.5 和页面相关的方法
- 7.6 JavaScript对象分类
- - 7.6.1 BOM相关对象
  - 7.6.2操作DOM对象（重要）
  - JavaScript HTML DOM - 改变 HTML
  - JavaScript HTML DOM - 改变CSS
  - JavaScript HTML DOM 事件

1. 前端知识体系(学习路线)

学习路线

2.前端三要素

HTML（结构）：超文本标记语言（Hyper Text Markup Language），决定网页的结构和内容。

CSS（表现）：层叠样式表（Cascading Style Sheets），设定网页的表现样式。

JavaScript（行为）：是一种弱类型脚本语言，其源码不需经过编译，而是由浏览器解释运行，用于控制网页的行为

3.行为层 JavaScript

JavaScript一门弱类型脚本语言，其源代码在发往客户端运行之前不需要经过编译，而是将文本格式的字符代码发送给浏览器，由浏览器解释运行。

JavaScript框架：

JQuery：大家熟知的JavaScript库，优点就是简化了DOM操作，缺点就是DOM操作太频繁，影响前端性能；在前端眼里使用它仅仅是为了兼容IE6，7，8；
Angular：Google收购的前端框架，由一群Java程序员开发，其特点是将后台的MVC模式搬到了前端并增加了模块化开发的理念，与微软合作，采用了TypeScript语法开发；对后台程序员友好，对前端程序员不太友好；最大的缺点是版本迭代不合理（如1代–>2 代，除了名字，基本就是两个东西；截止发表博客时已推出了Angular6）；
React：Facebook 出品，一款高性能的JS前端框架；特点是提出了新概念【虚拟DOM】用于减少真实 DOM 操作，在内存中模拟 DOM操作，有效的提升了前端渲染效率；缺点是使用复杂，因为需要额外学习一门【JSX】语言；
Vue：一款渐进式 JavaScript 框架，所谓渐进式就是逐步实现新特性的意思，如实现模块化开发、路由、状态管理等新特性。其特点是综合了 Angular（模块化）和React(虚拟 DOM) 的优点；
Axios：前端通信框架；因为 Vue 的边界很明确，就是为了处理 DOM，所以并不具备通信能力，此时就需要额外使用一个通信框架与服务器交互；当然也可以直接选择使用jQuery 提供的AJAX 通信功能。

4.UI框架

UI框架：

Ant-Design：阿里巴巴出品，基于React的UI框架；
ElementUI、iview、ice：饿了么出品，基于Vue的UI框架；
BootStrap：Teitter推出的一个用于前端开发的开源工具包；
AmazeUI：又叫“妹子UI”，一款HTML5跨屏前端框架。

5.JavaScript构建工具

Babel：JS编译工具，主要用于浏览器不支持的ES新特性，比如用于编译TypeScript。
WebPack：模块打包器，主要作用就是打包、压缩、合并及按序加载。

6. JavaScript引入方式

内联: 在标签的事件属性中添加js代码,当事件触发时执行js代码

<input type="button" value="按钮" onclick="alert('按钮点击了!')">

内部: 在html页面的任意位置添加script标签,在标签内部写js代码,推荐写在的上面

<script type="text/javascript"> alert("内部引入成功!"); script>

外部: 把代码写在单独的js文件中,通过script标签的src属性引入js文件

<script type="text/javascript" src="first.js">script>

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>
    
    <input type="button" value="按钮" onclick="alert('按钮点击了')">

    
    <script type="text/javascript"> alert("内部引入成功") script>

    
    <script type="text/javascript" src="first.js">script>
body>
html>

alert("没想到吧")

7. JavaScript语法

数据类型变量运算符语句方法声明面向对象

7.1数据类型:

js中只有对象类型
1.数值类型：number var x = 10
2.字符串类型：string var s = “abc”/‘abc’;
3.布尔类型：boolean var b = true/false;
4.未定义类型：undefined var u; 只声明不赋值就是未定义类型
5.自定义类型object

7.2 变量声明和赋值

js语言属于弱类型的语言
java: int x = 10; x= "abc" 报错
js var x = 10; x="abc" 允许因为JS弱化了类型的概念

7.3运算符

+ - * / % > < >= <= = == !=

==和===, ==是先统一类型再比较值,===是先比较类型再比较值
"666"==666  true     "666"===666  false

除法运算,会自动转换整数和小数     
java: int x = 5; int y = 2;  x/y=?  2
js: var x = 5; var y = 2;   x/y=2.5

语句 if else while do while for switch case
和Java大体相同
for循环中的 int i 改成 var i

for(var i=0;i<10;i++){
   console.log(i);
}

7.4 方法声明

java: public void 方法名(参数列表){方法体}
js: function 方法名(参数列表){方法体}
声明常见的四种方法:
1. 无参无返回值
2. 无参有返回值
3. 有参无返回值
4. 有参有返回值
JS中方法声明有三种方式:
1. function 方法名(参数列表){方法体}
2. var 方法名 = function(参数列表){方法体}
3. var 方法名 = new Function(“参数1”,“参数2”,“方法体”);

DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"> 
<title>Insert title heretitle>
head>
<body>
<input type="button" value="按钮" 
  onclick="fn1()">

<script type="text/javascript">
//无参无返回值
	function fn1(){
	//每行结束的;  可以省略 
		alert("fn1执行!");
	}
//调用 和java一样调用
//	fn1();
//有参无返回值
function fn2(name,age){
	alert(name+":"+age);
}
//调用
// fn2("孙尚香",60);
//无参有返回值
function fn3(){
	return "ABC";
	
}
//调用
//var s = fn3();
//alert(s);
//有参有返回值
function fn4(x,y){
	return x*y;
}
//调用
//var result = fn4(3,8);
//alert(result);
//第二种声明方法的方式:
	var fn5 = function(name,age){
	alert(name+":"+age);
}
//调用 
//	fn5("刘备",20);
//第三种声明方法的方式:
	var fn6 = new Function("name","age"
			,"alert(name+':'+age)");
//	fn6("吕布",18);
	 
script>
body>
html>

7.5 和页面相关的方法

通过id查找页面中的元素

div1

var d = document.getElementById("abc");

获取和修改元素的文本内容

d.innerText    获取
d.innerText = "xxx";  修改

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Documenttitle>
head>
<body>
    <div id = "d1">一个divdiv>

    <script>
        var d = document.getElementById("d1");
        alert(d.innerText);
        d.innerText="haha"; 
        alert(d.innerText);
    script>
body>
html>

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Documenttitle>
head>
<body>
    
    <div id="d1">div1div>

    <script type="text/javascript" >
        function fn1(){
            var d = document.getElementById("d1");
            alert(d.textContent)
            d.innerText = "xxx";
            alert(d.textContent)
        }
    script>

    <input type="button" value="按钮" onclick="fn1()">
body>
html>

获取和修改文本框的文本内容

<input type="text" id="i1">
var i1 = document.getElementById("i1");
i1.value  获取
i1.value="xxx"; 修改

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Documenttitle>
head>
<body>
    <input type="text" id="i1">
    <script>
        var i1 = document.getElementById("i1");
        alert(i1.value);
        i1.value="xxx"; 
        alert(i1.value)
    script>
body>
html>

DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Insert title heretitle>
  head>
  <body>
    <input type="text" id="i1" />
    <div id="d1">这是一个divdiv>

    <input type="button" value="获取" onclick="fn1()" />
    <input type="button" value="修改" onclick="fn2()" />
    <input type="button" value="按钮" onclick="fn3()" />

    <script type="text/javascript">
      function fn3() {
        //取出文本框的内容 给到 div显示
        d1.innerText = i1.value;
      }

      function fn1() {
        var d = document.getElementById("d1");
        alert(d.innerText);
      }
      
      function fn2() {
        //获取id为d1的元素
        //var d1 = document.getElementById("d1");
        //修改
        d1.innerText = "xxx";
      }
    script>
  body>
html>

Not a Number: 不是一个数.
isNaN(x) 判断x是否是NaN 返回值true代表是NaN(不是数) 返回值false代表不是NaN(是数)

7.6 JavaScript对象分类

内置对象: 包括number、string、boolean等
浏览器相关对象: BOM Browser Object Model(浏览器对象模型)
页面相关对象: DOM Document Object Model(文档对象模型)

7.6.1 BOM相关对象

window: window里面的属性称为全局属性,方法称为全局方法,调用window里面的属性或方法的时候可以将window省略掉

window中常见属性
1. location位置
  location.href 获取和修改浏览器当前的请求地址
  location.hash 返回URL中的hash（#号后跟零或多个字符）
  location.host 返回服务器名称和端口号
  location.port 返回服务器端口号
  location.pathname 返回URL中的目录和文件名
  location.hostname 返回不带端口号的服务器名称
  location.protocol 返回页面使用的协议（http://或https://)
  location.search 返回URL的查询字符串，字符串以问号开头
2. history历史当前窗口的历史记录
  history.length() 获取历史页面的数量
  history.back() 返回上一页面
  history.forward() 前往下一页面
3. navigator 导航/帮助
  navigator.userAgent 获取浏览器的版本信息
  window.navigator.platform：通过platform可以判断浏览器所在的系统平台类型
  window.navigator.online：判断是否联网
window中常见的方法
1. alert() 弹出提示框
2. confirm() 弹出确认框
3. prompt() 弹出文本输入框
4. parseInt()/parseFloat()
  parseInt(2.38) 2
  parseInt(“20”) 20
  parseInt(“20asdf”) 20
  parseInt(“a20”) NaN
  parseFloat(“3.8”) 3.8
  window.open() ：打开一个新的浏览器窗口，接受四个参数（URL/打开方式/窗口参数/是否取代当前页面历史记录的布尔值）。
  window.close() ：关闭新打开的窗口（仅限open（）打开的窗口）。
  window.moveTo()：移动当前窗口。
  window.resizeTo()：调整当前窗口的尺寸。
5. isNaN() 判断一个变量是否是数
6. 定时器
  开启:var timer = setInterval(方法,时间间隔);
  停止: clearInterval(timer);

7.6.2操作DOM对象（重要）

DOM Document Object Model(文档对象模型)

更新：更新Dom节点
遍历Dom节点：得到Dom节点
删除：删除一个Dom节点
添加：添加一个新的节点

JavaScript 能够改变页面中的所有 HTML 元素
JavaScript 能够改变页面中的所有 HTML 属性
JavaScript 能够改变页面中的所有 CSS 样式
JavaScript 能够对页面中的所有事件做出反应

查找HTML元素
通常，通过 JavaScript，您需要操作 HTML 元素。

为了做到这件事情，您必须首先找到该元素。有三种方法来做这件事：

通过 id 找到 HTML 元素
var x = document.getElementById("intro");
通过标签名找到 HTML 元素
var x=document.getElementById("main");
var y=x.getElementsByTagName("p");

DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)title>
head>
<body>

<p>你好世界!p>
<div id="main">
<p> DOM 是非常有用的。p>
<p>该实例展示了  <b>getElementsByTagNameb> 方法p>
div>
<script>
var x=document.getElementById("main");
var y=x.getElementsByTagName("p");
document.write('id="main"元素中的第一个段落为：' + y[0].innerHTML);
script>

body>
html>

通过类名找到 HTML 元素

DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)title>
head>
<body>

<p class="intro">你好世界!p>
<p>该实例展示了 <b>getElementsByClassNameb> 方法!p>
<script>
x=document.getElementsByClassName("intro");
document.write("文本来自 class 为 intro 段落: " + x[0].innerHTML + "
");
script>
<p><b>注意：b>Internet Explorer 8 及更早 IE 版本不支持 getElementsByClassName() 方法。p>
body>
html>

JavaScript HTML DOM - 改变 HTML

改变HTML输出流

DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)title>
head>
<body>

<script>
	document.write(Date());
script>

body>
html>

改变HTML内容
document.getElementById(id).innerHTML=新的 HTML

<html>
<body>

<p id="p1">Hello World!p>

<script>
	document.getElementById("p1").innerHTML="新文本!";
script>

body>
html>

DOCTYPE html>
<html>
<body>

<h1 id="header">Old Headerh1>

<script>
var element=document.getElementById("header");
element.innerHTML="新标题";
script>

body>
html>

改变HTML属性
document.getElementById(id).attribute=新属性值

DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)title>
head>
<body>

<img id="image" src="smiley.gif" width="160" height="120">
<script>
document.getElementById("image").src="landscape.jpg";
script>
<p>原图片为 smiley.gif,脚本将图片修改为 landscape.jpgp>

body>
html>

JavaScript HTML DOM - 改变CSS

改变HTML样式

DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)title>
head>
<body>

<p id="p1">Hello World!p>
<p id="p2">Hello World!p>
<script>
	document.getElementById("p2").style.color="blue";
	document.getElementById("p2").style.fontFamily="Arial";
	document.getElementById("p2").style.fontSize="larger";
script>
<p>以上段落通过脚本修改。p>

body>
html>

使用事件
HTML DOM 允许我们通过触发事件来执行代码。
比如以下事件：
元素被点击。
页面加载完成。
输入框被修改。

DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)title>
head>
<body>

<h1 id="id1">我的标题 1h1>
<button type="button" onclick="document.getElementById('id1').style.color='red'">
点我!button>

body>
html>

JavaScript HTML DOM 事件

HTML DOM 使 JavaScript 有能力对 HTML 事件做出反应。
对事件做出反应

当用户点击鼠标时
当网页已加载时
当图像已加载时
当鼠标移动到元素上时
当输入字段被改变时
当提交 HTML 表单时
当用户触发按键时

例子1：

DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)title>
head>
<body>

<h1 onclick="this.innerHTML='Ooops!'">点击文本!h1>

body>
html>

// TODO 时间有限后续会继续补充

UniApp + UniCloud 实现微信小程序静默登录九情丶 uni-app 微信小程序 notepad++
UniApp+UniCloud实现微信小程序静默登录目录1.项目准备2.UniCloud配置3.前端实现4.云函数实现5.完整示例1.项目准备1.1环境要求HBuilderX3.0+微信开发者工具UniCloud已开通微信小程序已注册1.2项目配置在manifest.json中配置微信小程序AppID：{"mp-weixin":{"appid":"你的小程序AppID","setting":{"u
微信 PC 版 4.0：新架构，新升级创意锦囊微信架构
探索微信PC版4.0：新架构带来的革命性升级微信在2023年底推出了PC客户端4.0测试版，引入了全新的QT+C++原生跨平台架构。这次架构重构标志着微信在桌面端从传统的WebView技术迈向更现代化、高性能的原生技术基础，带来了显著的功能升级和用户体验优化。从旧到新：架构大变革旧架构：WebView+JavaScript微信旧版PC客户端主要依赖WebView技术，通过HTML、CSS和Java
射频框架 YOYO--小天计算机硬件
版权声明：本文为博主原创文章，遵循CC4.0BY-SA版权协议，转载请附上原文出处链接和本声明。本文链接：关于射频————————————————版权声明：本文为CSDN博主「gecko001」的原创文章，遵循CC4.0BY-SA版权协议，转载请附上原文出处链接及本声明。原文链接：https://blog.csdn.net/gecko001/article/details/86569912RF前端
实现音乐播放器实现:前端HTML，CSS，JavaScript综合大项目（java实战）用心去追梦前端 html css
创建一个音乐播放器项目，使用HTML、CSS和JavaScript作为前端技术栈，并结合Java后端（如果需要），可以是一个很好的实战项目。这个项目不仅能够帮助你掌握前端开发技能，还能让你了解如何与后端交互来获取数据。下面是实现这样一个音乐播放器项目的步骤指南，包括了从规划到部署的各个方面。1.项目规划规划功能基本功能播放/暂停按钮。音量控制。进度条。歌曲列表显示。高级功能随机播放。列表循环。搜索
盘点原生JavaScript中直接触发事件的方式 javascript
JavaScript提供了多种方式来直接触发事件，无论是在用户交互、程序逻辑处理或是数据更新时。本文将全面探讨原生JavaScript中各种事件触发方式，并通过深入的技术案例分析，帮助开发者掌握这些方法在实际开发中的应用。使用dispatchEvent原生JavaScript中触发事件的核心方法是dispatchEvent。这个方法允许开发者为任何DOM元素触发几乎任何类型的事件，包括但不限于点击
圈子系统如何实现生成海报功能，前后端协同工作前端
圈子系统通常指的是社交平台或论坛中的一种功能模块，用于创建和管理兴趣小组或讨论群组。以下是对圈子系统的详细解释：一、前端实现前端主要负责海报的生成和展示。这通常通过HTML5的CanvasAPI或类似的图形库来实现。创建Canvas元素：在HTML中创建一个Canvas元素，用于绘制海报。获取Canvas上下文：使用getContext('2d')方法获取Canvas的2D绘图上下文，以便进行绘制
2025年个人博客网站-零成搭建-终极指南 Ktovoz 经验分享前端 react
作者:KTO原文:《零成本博客建站终极指南》如果你需要站立自己的博客网可以参考本文。背景故事在接触前端领域之前,我和许多刚入门前端的新手一样，面对纷繁复杂的技术栈选择陷入迷茫,不知道从何下手。最初雄心勃勃想用Next.js从零搭建博客，却在实战中屡屡碰壁。最终找到「模板先行，逐步精进」的破局之道："先有后优"原则：通过成熟模板快速搭建可运行版本➡️持续迭代优化➡️渐进式学习技术细节本文将分享这一方
Python爬虫天气预报（小白入门）(1) 2401_84009993 程序员 python 爬虫开发语言
首先来到目标数据的网页http://www.weather.com.cn/weather40d/101280701.shtml中国天气网我们可以看到，我们需要的天气数据都是放在图表上的，在切换月份的时候，发现只有部分页面刷新了，就是天气数据的那块，而URL没有变化。这是因为网页前端使用了JS异步加载的技术，更新时不用加载整个页面，从而提升了网页的加载速度。对于这种非静态页面，我们在请求数据时，就不
安装 Kong Gateway 及其基本配置指南张声录1 kong kong gateway
KongGateway是一款轻量级、快速且灵活的云原生API网关，它位于您的服务应用程序前，动态控制、分析和路由请求与响应。KongGateway通过插件化、低代码的方式实现API流量的管理策略。本篇文章将带领您通过一系列简单步骤，安装并配置KongGateway，以便快速上手并进行常见的API管理任务。1.安装KongGatewayKongGateway是一款高效的API网关，它在前端充当路由器
前端框架vue和react 前端虫 #前端提升 vue.js javascript 前端 react 学习
vueVue能力的提升是一个综合性的过程，涉及多个方面的学习和实践。以下是一些具体的例子和策略，可以帮助你提升Vue开发能力：1.深入理解Vue的核心概念1.1响应式系统：深入理解Vue的响应式原理，包括数据绑定、依赖追踪和视图更新机制。Vue的响应式系统是其核心，它允许Vue组件响应数据的变化。这是通过Vue的内部机制实现的，包括使用ES5的Object.defineProperty（Vue2.
Vue：现代前端开发的首选框架-【应用篇】行动π技术博客 vue.js 前端 javascript
引言在现代前端开发中，Vue.js以其轻量、灵活和易学的特性成为开发者的热门选择。本文将深入探讨Vue.js的核心优势，与React和Angular的比较，前端工程化的最佳实践，性能优化的关键策略，测试驱动开发（TDD）的实施方法，以及Vue.js生态系统的强大工具和资源。Vue.js与React和Angular的深度比较Vue.js的核心优势学习曲线：Vue.js的设计哲学使得新手能够快速上手，
Web前端学习重点笔记 HeHolly 前端学习笔记
第一章：Web前端开发技术综述第二章：HTML基础第三章：格式化文本与段落标记：标题字标记：大——小字体标记：水平线标记：段落缩进标记：默认5个字符位置拼音标记：何(he)原样显示标记：特殊符号：显示结果说明符号代码空格 >大于号>加粗倾斜删除线下划线上标下标加粗倾斜变小字号变大字号第四章：列表有序列表……type="1(默认)|A|a|i|I"无序列表……type="disc(默
解决ERROR: This version of pnpm requires at least Node.js xxx 的问题互联网全栈开发实战前端开发技术解决方法 vue.js javascript node.js 前端 npm 前端框架
1.复现错误今天从gitee下载某项目，用来学习前端开发，在执行npmi-gpnpm命令时，虽然没有报错，但出现不分警告，暂忽略这些警告，执行如下命令时，却报出错误：PSC:\test>pnpmiERROR:ThisversionofpnpmrequiresatleastNode.jsv18.12ThecurrentversionofNode.jsisv16.0.0Visithttps://r.p
Node.js超详细教程！刘大本尊前端技术 node.js
0.基础概念Node.js是一个基于ChromeV8引擎的JavaScript运行环境，使用了一个事件驱动、非阻塞式I/O模型，让JavaScript运行在服务端的开发平台。官方地址：https://nodejs.org/en中文地址：https://nodejs.org/zh-cn代码初体验：console.log("helloNodeJS")//1.进入到对应js文件的目录下//2.执行nod
Sui Bridge激励计划更新，一周后结束 Sui_Network Sui 重要公告 web3 大数据区块链网络云计算
SuiBridge的激励测试网阶段将于7月8日结束，这是最后一周参与的机会。在这一关键阶段，社区反馈和全面测试对于确保SuiBridge在主网上线时的顺利运行至关重要。为了确保你的操作符合奖励条件，请确保遵守以下要求：完成完整的桥接循环，从以太坊转移到Sui，再从Sui转回以太坊。仅通过官方的SuiBridge前端发起桥接交易。对于提供反馈的人，请确保你的Sui地址与Discord上的反馈相关联。
多种vue前端框架介绍灵魂清零其他前端 javascript
学如逆水行舟，不进则退。在现今的软件开发领域，Vue.js凭借其高效、灵活和易于上手的特性，成为了前端开发的热门选择。对于需要快速搭建企业级后台管理系统的开发者而言，使用现成的Vue后台管理系统模板无疑是一个明智之举。本文我为大家分享几款开源、免费开源、开箱即用的开源免费的Vue3开源管理后台，它们可以帮助你在项目中快速起步！专注于业务逻辑的开发。01.vue-element-adminGithu
2018年年度总结 weixin_30514745 前端后端 php ViewUI
首先先看2017年定下的小目标：PHP基础知识的再次学习。（今年在工作的时候也发现了这个问题，所以将PHP基础知识再学习了一遍，对一些容易混淆的概念进行了学习。这个目标算是实现了80%吧）对前端新特性的了解。（因为之前在太原工作的时候，前端后端都干，所以当时觉得前端和后台都很重要，今年在北京主要干的是后端的工作，所以这个并没有去进行了解）python的学习。（这个也没有进行学习，了解了也没有用，今
钉钉小程序、文件上传（excel、ppt、word等） xluo1715 钉钉（小程序和 H5）钉钉小程序 excel ppt pdf word
钉钉小程序上传下载（反显）文件（如excelpptworld等文件）前端处理（需要后端配合加上传下载的权限）要上传excelpptworld等文件还需要借助钉盘实现，我就不废话了，直接上代码axml结构,红框中的为钉盘文件上传和预览其余的是兼容图片上传和PC端上传的文件，这里提一嘴，如果是PC端上传到自己服务器的文件要想在小程序里显示，需要后端把服务器的文件先传到钉盘，前端再通过钉盘下载，如果是小
JavaScript中通过array.map(）实现数据转换、创建派生数组、异步数据流处理、复杂API请求、DOM操作、搜索和过滤等，array.map(）的使用详解（附实际应用代码） watermelo37 前端 #数据结构 javascript vue.js 前端算法数据分析数据挖掘
目录JavaScript中通过array.map(）实现数据转换、创建派生数组、异步数据流处理、复杂API请求、DOM操作、搜索和过滤等，array.map（）的使用详解（附实际应用代码）一、什么时候该使用Array.map()，与forEach()的区别是什么？1、什么时候该用Array.map()2、Array.map()与Array.forEach()的区别二、Array.map(）的使用与
零售业的AI赋能与前端开发效率革命：ScriptEcho 的助力前端
零售业正经历着前所未有的数字化转型，但同时也面临着巨大的挑战。库存管理混乱、个性化客户体验不足等问题，严重制约着零售企业的盈利能力。而人工智能（AI）的兴起，为解决这些问题提供了新的思路。通过AI驱动的实时库存管理和客户行为分析，零售企业可以显著提升运营效率和客户满意度。然而，构建这些AI赋能的零售应用，需要强大的前端开发能力，这正是AI代码生成器ScriptEcho能够发挥关键作用的地方。AI赋
前端大文件OSS上传注意事项前端
大文件上传是一个比较重要的交互场景，如上传入库比较大的Excel表格数据、上传影音文件等。如果文件体积比较大，或者网络条件不好时，上传的时间会比较长（要传输更多的报文，丢包重传的概率也更大），用户不能刷新页面，只能耐心等待请求完成。1.利用上传控件inputtype="file"绑定一个change事件，在回调中通过事件对象的e.target.files拿到这个文件对象，进行文件对象的slice方
JS工程化集锦
项目工具模块化JS模块规范CommonJS·AMD·CMD·UMD·ES6NPM版本NPM版本介绍打包构建polyfill工程化篇-JS兼容方案项目管理LintCodeReview效率工具ESLint方案官方：https://cn.eslint.org/docs/user-guide/configuringairbnb:https://github.com/airbnb/javascriptsta
深入理解视图的创建与删除：数据库管理中的高级功能
title:深入理解视图的创建与删除：数据库管理中的高级功能date:2025/1/21updated:2025/1/21author:cmdragonexcerpt:在现代数据库管理系统中，视图是一个重要的高级功能，可以为用户提供定制化的数据视图以满足特定需求。视图不仅能够简化复杂的查询，还能增强数据安全性和访问效率。categories:前端开发tags:数据库视图创建视图删除视图数据库管理数
百度AI战略与2025年AI应用井喷：AI代码生成器ScriptEcho如何助力前端开发前端
2025年，百度创始人李彦宏在百度25周年全员信中预言：AI应用将在2025年井喷式增长。这预示着AI技术将迎来一个新的发展高峰，同时也为前端开发者带来了前所未有的机遇和挑战。面对AI应用的快速发展，如何提升前端开发效率，降低开发成本，成为摆在开发者面前的难题。本文将探讨百度AI战略下前端开发面临的挑战，并重点介绍AI代码生成器ScriptEcho如何助力开发者迎接2025年AI应用井喷的浪潮。百
[前端算法]动态规划摇光93 算法算法动态规划
最优子结构,重叠子问题爬楼梯递归+记忆化搜索自顶向下varclimbStairs=function(n){letmap=[]functiondfs(n){if(n=coins[j]){dp[i]=Math.min(dp[i],dp[i-coins[j]]+1);}}}if(dp[amount]===Infinity){return-1;}returndp[amount];}01背包问题functi
【2024年华为OD机试】(C/D卷,200分)- 5G网络建设（JavaScript&Java & Python&C/C++）妄北y 算法汇集笔记总结(保姆级)华为od c语言 5G python javascript java 网络
一、问题描述题目描述现需要在某城市进行5G网络建设，已经选取N个地点设置5G基站，编号固定为1到N。接下来需要各个基站之间使用光纤进行连接以确保基站能互联互通。不同基站之间假设光纤的成本各不相同，且有些节点之间已经存在光纤相连。请你设计算法，计算出能联通这些基站的最小成本是多少。注意：基站的联通具有传递性，比如基站A与基站B架设了光纤，基站B与基站C也架设了光纤，则基站A与基站C视为可以互相联通。
使用Python进行后端开发 code_welike python 开发语言后端
在现代的Web应用程序中，后端开发扮演着至关重要的角色。后端是负责处理数据、逻辑和业务规则的部分，它与前端交互并提供必要的功能和服务。Python是一种广泛使用的编程语言，具有丰富的库和框架，非常适合用于后端开发。本文将介绍如何使用Python进行后端开发，并提供一些示例代码。安装Python和相关工具首先，我们需要安装Python和一些常用的后端开发工具。你可以从Python官方网站（https
JS中const有没有变量提升 lvbb66 javascript 前端开发语言
在JavaScript中，const关键字用于声明一个只读的常量，其值在初始化后不能被重新赋值。关于变量提升（Hoisting），它是JavaScript中一个重要的概念，指的是无论变量或函数声明在何处，它们都会被“提升”到其所在作用域的最顶部。但是，这个规则不完全适用于const和let声明的变量。变量提升（Hoisting）的传统理解在ES6之前，JavaScript只有var关键字用于声明变
一比一实现ChatGPT流式接口前端显示效果（打字机效果）【对比几种不同的流式实现方案】吉吉安前端 java python GPT chatgpt
前端实现GPT或者其他大模型的流式推送的数据接收可以通过EventSource、Axios、或者基于EventSource实现的@microsoft/fetch-event-source插件库；GPT官方是基于原生EventSource实现的流式数据接收，我们作为个人开发使用可以使用Axios或者使用@microsoft/fetch-event-source插件库，后两种可以携带header并且操
软件生命周期管理的智能化转型：AI写代码工具赋能前端开发前端
软件开发行业正经历着前所未有的变革。传统的软件生命周期管理模式，常常面临效率低下、成本居高不下、团队沟通不畅以及错误率高等诸多挑战。为了应对这些挑战，智能化转型已成为大势所趋。本文将探讨如何利用先进技术，例如AI写代码工具，来提升软件开发效率，最终实现软件生命周期管理的智能化转型。智能化转型：提升软件开发效率的关键软件生命周期管理涵盖需求分析、设计、编码、测试、部署和维护等多个阶段。每个阶段都可能
C/C++Win32编程基础详解视频下载择善Zach 编程 C++Win32
课题视频：C/C++Win32编程基础详解视频知识：win32窗口的创建 windows事件机制主讲：择善Uncle老师学习交流群：386620625 验证码：625 --
Guava Cache使用笔记 bylijinnan java guava cache
1.Guava Cache的get/getIfPresent方法当参数为null时会抛空指针异常我刚开始使用时还以为Guava Cache跟HashMap一样，get(null)返回null。实际上Guava整体设计思想就是拒绝null的，很多地方都会执行com.google.common.base.Preconditions.checkNotNull的检查。 2.Guava
解决ora-01652无法通过128（在temp表空间中） 0624chenhong oracle
解决ora-01652无法通过128（在temp表空间中）扩展temp段的过程一个sql语句后，大约花了10分钟，好不容易有一个结果，但是报了一个ora-01652错误，查阅了oracle的错误代码说明：意思是指temp表空间无法自动扩展temp段。这种问题一般有两种原因：一是临时表空间空间太小，二是不能自动扩展。分析过程：既然是temp表空间有问题，那当
Struct在jsp标签不懂事的小屁孩 struct
非UI标签介绍：控制类标签： 1：程序流程控制标签 if elseif else <s:if test="isUsed"> <span class="label label-success">True</span> </
按对象属性排序换个号韩国红果果 JavaScript 对象排序
利用JavaScript进行对象排序，根据用户的年龄排序展示 <script> var bob={ name;bob, age:30 } var peter={ name;peter, age:30 } var amy={ name;amy, age:24 } var mike={ name;mike, age:29 } var john={
大数据分析让个性化的客户体验不再遥远蓝儿唯美数据分析
顾客通过多种渠道制造大量数据，企业则热衷于利用这些信息来实现更为个性化的体验。分析公司Gartner表示，高级分析会成为客户服务的关键，但是大数据分析的采用目前仅局限于不到一成的企业。挑战在于企业还在努力适应结构化数据，疲于根据自身的客户关系管理（CRM）系统部署有效的分析框架，以及集成不同的内外部信息源。然而，面对顾客通过数字技术参与而产生的快速变化的信息，企业需要及时作出反应。要想实
java笔记4 a-john java
操作符 1，使用java操作符操作符接受一个或多个参数，并生成一个新值。参数的形式与普通的方法调用不用，但是效果是相同的。加号和一元的正号（+）、减号和一元的负号（-）、乘号（*）、除号（/）以及赋值号（=）的用法与其他编程语言类似。操作符作用于操作数，生成一个新值。另外，有些操作符可能会改变操作数自身的
从裸机编程到嵌入式Linux编程思想的转变------分而治之：驱动和应用程序 aijuans 嵌入式学习
笔者学习嵌入式Linux也有一段时间了，很奇怪的是很多书讲驱动编程方面的知识，也有很多书将ARM9方面的知识，但是从以前51形式的（对寄存器直接操作，初始化芯片的功能模块）编程方法，和思维模式，变换为基于Linux操作系统编程，讲这个思想转变的书几乎没有，让初学者走了很多弯路，撞了很多难墙。笔者因此写上自己的学习心得，希望能给和我一样转变
在springmvc中解决FastJson循环引用的问题 asialee 循环引用 fastjson
我们先来看一个例子： package com.elong.bms; import java.io.OutputStream; import java.util.HashMap; import java.util.Map; import co
ArrayAdapter和SimpleAdapter技术总结百合不是茶 android SimpleAdapter ArrayAdapter 高级组件基础
ArrayAdapter比较简单，但它只能用于显示文字。而SimpleAdapter则有很强的扩展性，可以自定义出各种效果 ArrayAdapter;的数据可以是数组或者是队列 // 获得下拉框对象 AutoCompleteTextView textview = (AutoCompleteTextView) this
九封信 bijian1013 人生励志
有时候，莫名的心情不好，不想和任何人说话，只想一个人静静的发呆。有时候，想一个人躲起来脆弱，不愿别人看到自己的伤口。有时候，走过熟悉的街角，看到熟悉的背影，突然想起一个人的脸。有时候，发现自己一夜之间就长大了。 2014，写给人
Linux下安装MySQL Web 管理工具phpMyAdmin sunjing PHP Install phpMyAdmin
PHP http://php.net/ phpMyAdmin http://www.phpmyadmin.net Error compiling PHP on CentOS x64 一、安装Apache 请参阅http://billben.iteye.com/admin/blogs/1985244 二、安装依赖包 sudo yum install gd
分布式系统理论 bit1129 分布式
FLP One famous theory in distributed computing, known as FLP after the authors Fischer, Lynch, and Patterson, proved that in a distributed system with asynchronous communication and process crashes,
ssh2整合(spring+struts2+hibernate)-附源码白糖_ eclipse spring Hibernate mysql 项目管理
最近抽空又整理了一套ssh2框架，主要使用的技术如下： spring做容器，管理了三层(dao,service,actioin)的对象 struts2实现与页面交互(MVC)，自己做了一个异常拦截器，能拦截Action层抛出的异常 hibernate与数据库交互 BoneCp数据库连接池，据说比其它数据库连接池快20倍，仅仅是据说 MySql数据库项目用eclipse
treetable bug记录 braveCS table
// 插入子节点删除再插入时不能正常显示。修改： //不知改后有没有错，先做个备忘 Tree.prototype.removeNode = function(node) { // Recursively remove all descendants of +node+ this.unloadBranch(node); // Remove
编程之美-电话号码对应英语单词 bylijinnan java 算法编程之美
import java.util.Arrays; public class NumberToWord { /** * 编程之美电话号码对应英语单词 * 题目： * 手机上的拨号盘，每个数字都对应一些字母，比如2对应ABC，3对应DEF.........，8对应TUV，9对应WXYZ， * 要求对一段数字，输出其代表的所有可能的字母组合
jquery ajax读书笔记 chengxuyuancsdn jQuery ajax
1、jsp页面 <%@ page language="java" import="java.util.*" pageEncoding="GBK"%> <% String path = request.getContextPath(); String basePath = request.getScheme()
JWFD工作流拓扑结构解析伪码描述算法 comsci 数据结构算法工作活动 J#
对工作流拓扑结构解析感兴趣的朋友可以下载附件，或者下载JWFD的全部代码进行分析 /* 流程图拓扑结构解析伪码描述算法 public java.util.ArrayList DFS(String graphid, String stepid, int j)
oracle I/O 从属进程 daizj oracle
I/O 从属进程　　I/O从属进程用于为不支持异步I/O的系统或设备模拟异步I/O.例如，磁带设备(相当慢)就不支持异步I/O.通过使用I/O 从属进程，可以让磁带机模仿通常只为磁盘驱动器提供的功能。就好像支持真正的异步I/O 一样，写设备的进程(调用者)会收集大量数据，并交由写入器写出。数据成功地写出时，写入器(此时写入器是I/O 从属进程，而不是操作系统)会通知原来的调用者，调用者则会
高级排序:希尔排序 dieslrae 希尔排序
public void shellSort(int[] array){ int limit = 1; int temp; int index; while(limit <= array.length/3){ limit = limit * 3 + 1;
初二下学期难记忆单词 dcj3sjt126com english word
kitchen 厨房 cupboard 厨柜 salt 盐 sugar 糖 oil 油 fork 叉；餐叉 spoon 匙；调羹 chopsticks 筷子 cabbage 卷心菜；洋白菜 soup 汤 Italian 意大利的 Indian 印度的 workplace 工作场所 even 甚至；更 Italy 意大利 laugh 笑 m
Go语言使用MySQL数据库进行增删改查 dcj3sjt126com mysql
目前Internet上流行的网站构架方式是LAMP，其中的M即MySQL, 作为数据库，MySQL以免费、开源、使用方便为优势成为了很多Web开发的后端数据库存储引擎。MySQL驱动Go中支持MySQL的驱动目前比较多，有如下几种，有些是支持database/sql标准，而有些是采用了自己的实现接口,常用的有如下几种: http://code.google.c...o-mysql-dri
git命令 shuizhaosi888 git
---------------设置全局用户名： git config --global user.name "HanShuliang" //设置用户名 git config --global user.email "[email protected]" //设置邮箱 ---------------查看环境配置 git config --li
qemu-kvm 网络 nat模式 (四) haoningabc kvm qemu
qemu-ifup-NAT #!/bin/bash BRIDGE=virbr0 NETWORK=192.168.122.0 GATEWAY=192.168.122.1 NETMASK=255.255.255.0 DHCPRANGE=192.168.122.2,192.168.122.254 TFTPROOT= BOOTP= function check_bridge()
不要让未来的你，讨厌现在的自己 jingjing0907 生活奋斗工作梦想
故事one 　23岁，他大学毕业，放弃了父母安排的稳定工作，独闯京城，在家小公司混个小职位，工作还算顺手，月薪三千，混了混，混走了一年的光阴。　　　　24岁，有了女朋友，从二环12人的集体宿舍搬到香山民居，一间平房，二人世界，爱爱爱。偶然约三朋四友，打扑克搓麻将，日子快乐似神仙；　　　　25岁，出了几次差，调了两次岗，薪水涨了不过百，生猛狂飙的物价让现实血淋淋，无力为心爱银儿购件大牌
枚举类型详解一路欢笑一路走 enum 枚举详解 enumset enumMap
枚举类型详解一.Enum详解 1.1枚举类型的介绍 JDK1.5加入了一个全新的类型的”类”—枚举类型，为此JDK1.5引入了一个新的关键字enum,我们可以这样定义一个枚举类型。 Demo:一个最简单的枚举类 public enum ColorType { RED
第11章动画效果（上） onestopweb 动画
index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/
Eclipse中jsp、js文件编辑时，卡死现象解决汇总 ljf_home eclipse jsp卡死 js卡死
使用Eclipse编辑jsp、js文件时，经常出现卡死现象，在网上百度了N次，经过N次优化调整后，卡死现象逐步好转，具体那个方法起到作用，不太好讲。将所有用过的方法罗列如下： 1、取消验证 windows–>perferences–>validation 把除了manual 下面的全部点掉，build下只留 classpath dependency Valida
MySQL编程中的6个重要的实用技巧 tomcat_oracle mysql
每一行命令都是用分号(;)作为结束对于MySQL，第一件你必须牢记的是它的每一行命令都是用分号(;)作为结束的，但当一行MySQL被插入在PHP代码中时，最好把后面的分号省略掉，例如： mysql_query("INSERT INTO tablename(first_name,last_name)VALUES('$first_name',$last_name')");
zoj 3820 Building Fire Stations(二分+bfs) 阿尔萨斯 Build
题目链接：zoj 3820 Building Fire Stations 题目大意：给定一棵树，选取两个建立加油站，问说所有点距离加油站距离的最大值的最小值是多少，并且任意输出一种建立加油站的方式。解题思路：二分距离判断，判断函数的复杂度是o(n)，这样的复杂度应该是o(nlogn)，即使常数系数偏大，但是居然跑了4.5s，也是醉了。判断函数里面做了3次bfs，但是每次bfs节点最多

JavaScript笔记