o0o0o0o0o0oo的博客

原创 cenos7安装docker&docker-compose

null

原创 mac安装yarn

mac安装yarnhttps://www.csdn.net/tags/Ntzakg4sMDM5NDItYmxvZwO0O0OO0O0O.html

原创 mac安装yarn

mac安装yarnhttps://www.csdn.net/tags/Ntzakg4sMDM5NDItYmxvZwO0O0OO0O0O.html

原创 css transform

一、transform1.旋转rotate2D平面旋转transform: rotate(25deg); [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ozMF3f62-1629103984314)(/Users/wuhaoxin/Library/Application Support/typora-user-images/image-20210816164259371.png)]2.移动translate水平偏移150px 数值偏移50pxtrans

原创 webpack笔记

1. webpack ./src/main.js ./dist/boundle.js 源文件 目标文件（打包后存放的地方） 打包之后会生成一个boundle.js的文件，直接引入使用2. npm init 初始化项目，生成一个package.json文件 3. webpack (1).先创建webpack.config.js的文件 (2).写入以下代码 const path = require('path

原创 前端渲染与后端渲染

转载 寻找2020

【问题描述】小蓝有一个数字矩阵，里面只包含数字 0 和 2。小蓝很喜欢 2020，他想找到这个数字矩阵中有多少个 2020 。小蓝只关注三种构成 2020 的方式：• 同一行里面连续四个字符从左到右构成 2020。• 同一列里面连续四个字符从上到下构成 2020。• 在一条从左上到右下的斜线上连续四个字符，从左上到右下构成 2020。例如，对于下面的矩阵：220000000000002202000000000022002020一共有 5 个 2020。其中 1 个是在同一行里的，

原创 01背包问题

有n个物品，它们有各自的体积和价值，现有给定容量的背包，如何让背包里装入的物品具有最大的价值总和？为方便讲解和理解，下面讲述的例子均先用具体的数字代入，即：eg：number＝4，capacity＝8public class test { public static void main(String[] args) { int[][] f = new int[5][9];//最大收意 int w[] = {0,2,3,4,5};//4块物品 每块物品所对应的重量 int v[] = {

转载 解密（indexof，charAt）

小明设计了一种文章加密的方法：对于每个字母 c，将它变成某个另外的字符 Tc。下表给出了字符变换的规则：例如，将字符串 YeRi 加密可得字符串 EaFn。小明有一个随机的字符串，加密后为EaFnjISplhFviDhwFbEjRjfIBBkRyY（由 30 个大小写英文字母组成，不包含换行符），请问原字符串是多少？（如果你把以上字符串和表格复制到文本文件中，请务必检查复制的内容是否与文档中的一致。在试题目录下有一个文件 str.txt，第一行为上面的字符串，后面 52 行依次为表格中的内容。）

原创 花园灌溉（bfs）

问题描述小蓝负责花园的灌溉工作。　　花园可以看成一个 n 行 m 列的方格图形。中间有一部分位置上安装有出水管。　　小蓝可以控制一个按钮同时打开所有的出水管，打开时，有出水管的位置可以被认为已经灌溉好。　　每经过一分钟，水就会向四面扩展一个方格，被扩展到的方格可以被认为已经灌溉好。即如果前一分钟某一个方格被灌溉好，则下一分钟它上下左右的四个方格也被灌溉好。　　给定花园水管的位置，请问 k 分钟后，有多少个方格被灌溉好？输入格式输入的第一行包含两个整数 n, m。　　第二行包含一个整数 t，表

原创 蛇形填数

【问题描述】如下图所示，小明用从 1 开始的正整数“蛇形”填充无限大的矩阵。1 2 6 7 15 …3 5 8 14 …4 9 13 …10 12 …11 ……(1)容易看出矩阵第二行第二列中的数是 5。请你计算矩阵中第 20 行第 20 列的数是多少？【答案提交】这是一道结果填空的题，你只需要算出结果后提交即可。本题的结果为一个整数，在提交答案时只填写这个整数，填写多余的内容将无法得分。import javax.security.auth.x500.X500Principal;

原创 高精度除以低精度

b站视频：https://www.bilibili.com/video/BV1LA411v7mt?p=4洛谷：https://www.luogu.com.cn/problem/P1480题目描述输入两个整数 a,ba,b，输出它们的商。输入格式两行，第一行是被除数，第二行是除数。输出格式一行，商的整数部分。输入输出样例输入102输出5import java.util.Scanner;public class Main { public static void main(

原创 高精度乘法

b站视频：https://www.bilibili.com/video/BV1LA411v7mt?t=420&p=3信息学奥赛一本通：1174：大整数乘法http://ybt.ssoier.cn:8088/problem_show.php?pid=1174【题目描述】求两个不超过200位的非负整数的积。【输入】有两行，每行是一个不超过200位的非负整数，没有多余的前导0。【输出】一行，即相乘后的结果。结果里不能有多余的前导0，即如果结果是342，那么就不能输出为0342。【输入样例】

原创 洛谷：P2142 高精度减法

b站视频：https://www.bilibili.com/video/BV1LA411v7mt?t=348&p=2洛谷测题：https://www.luogu.com.cn/problem/P2142题目描述高精度减法。输入格式两个整数 a,ba,b（第二个可能比第一个大）。输出格式结果（是负数要输出负号）。输入输出样例输入 #121输出 #11import java.util.Scanner;public class Main { //将输入得两个字符串s1

原创 减法

import java.util.Scanner;public class jianfa { static boolean isOk(String s1, String s2) { int s1_high = (int)s1.charAt(0); int s2_high = (int)s2.charAt(0); if(s2_high > s1_high) return true; return false; } public static void main(S

原创 洛谷P1601 A+B Problem（高精）

b站视频：https://www.bilibili.com/video/BV1LA411v7mt?t=805洛谷测评网址：https://www.luogu.com.cn/problem/P1601题目描述高精度加法，相当于a+b problem，不用考虑负数.输入格式分两行输入。a,b≤10^500，a,b≤10500输出格式输出只有一行，代表a+b的值输入输出样例输入 #111输出 #12输入 #210019099输出 #210100import java.u

原创 深搜：最短路径

b站视频：https://www.bilibili.com/video/BV16C4y1s7EF?t=1458https://www.bilibili.com/video/BV1bK4y1C7W2?p=1dfs：最短路径求从起点走到终点的最短路径输入：行 列地图（ 1代表可走，2代表障碍物 ）起点坐标x，y终点坐标x，y样例：输入5 41 1 2 11 1 1 11 1 2 11 2 1 11 1 1 21 1 4 3输出：7import java.util.Sca

原创 广搜：最短路径

b站视频：https://www.bilibili.com/video/BV16C4y1s7EF?t=1458题目：求从起点走到终点的最短路径输入：行 列地图（ 1代表可走，2代表障碍物 ）起点坐标x，y终点坐标x，y样例：输入5 41 1 2 11 1 1 11 1 2 11 2 1 11 1 1 21 1 4 3输出：7import java.awt.List;import java.util.LinkedList;import java.util.Scanne

原创 Java 中int、String的类型转换

来源：https://www.cnblogs.com/bluestorm/p/3698810.htmlint -> Stringint i=12345;String s="";第一种方法：s=i+"";第二种方法：s=String.valueOf(i);这两种方法有什么区别呢？作用是不是一样的呢？是不是在任何下都能互换呢？第一种方法：s=i+""; //会产生两个String对象第二种方法：s=String.valueOf(i); //直接使用String类的静态方法，只产生一个

原创 正则表达式

RegExp对象JS风格——new RegExp(“a”, “i”)perl风格——/a/i<script>var re=new RegExp('b', 'i');var str='abcdef';alert(str.search(re));</script><script>var re=/a/i;var str='abcdef';alert(str.search(re));</script>字符串操作search

原创 COOKIE基础与应用

什么是cookie页面用来保存信息比如：自动登录、记住用户名cookie的特性同一个网站中所有页面共享一套cookie数量、大小有限过期时间JS中使用cookiedocument.cookieDate函数的使用<script>var oDate=new Date();oDate.setDate(oDate.getDate()+100);//计算当前日期+100天alert(oDate.getFullYear()+'-'+(oDate.getMon..

原创 BOM

打开、关闭窗口write<body><input type="button" value="write" onclick="document.write('abc')" /></body>open：打开一个新窗口<input type="button" value="打开窗口" onclick="window.open('http://www.zhinengshe.com/');" />close：关闭浏览器打开的新窗口<

原创 JS面向对象：json的对象、命名空间、call、继承、拖拽的继承

Json方式的面向对象把方法包在一个Json里有人管他叫——命名空间在公司里，把同一类方法，包在一起<script>var json={ name: 'blue', qq: '258248832', showName: function () { alert('我的名字叫：'+this.name); }, showQQ: function () { alert('我的QQ号是：'+this.qq); }};json.showName();json

原创 面向对象实例：选项卡

面向对象的选项卡把面向过程的程序，改写成面向对象的形式原则：不能有函数套函数、但可以有全局变量过程onload → 构造函数全局变量 → 属性函数 → 方法改错this、事件、闭包、传参对象与闭包通过闭包传递this原始选项卡：<style>#div1 input {background:white;}#div1 input.active {background:yellow;}#div1 div {width:200px; height:20

原创 面向对象、原型——prototype、用混合方式构造对象

什么是对象对象是一个整体，对外提供一些操作什么是面向对象使用对象时，只关注对象提供的功能，不关注其内部细节比如JQuery面向对象是一种通用思想，并非只有编程中能用，任何事情都可以用面向对象编程(OOP)的特点抽象：抓住核心问题封装：不考虑内部实现，只考虑功能使用继承：从已有对象上，继承出新的对象-多重继承-多态对象的组成方法——函数：过程、动态的属性——变量：状态、静态的原型——prototype什么是原型原型是class，修改他可以影响一类元..

原创 编写Ajax

变量和属性用没有定义的变量——报错用没有定义的属性——undefinedalert(window.a);编写Ajax创建Ajax对象XMLHttpRequest()连接服务器open(方法, 文件名, 异步传输)同步和异步同步：事情一件一件来异步：多个事件一起做发送请求send()请求状态监控onreadystatechange事件readyState属性：请求状态0 （未初始化）还没有调用open()方法1 （载入）已调用send()方

原创 Ajax基础

什么是Ajax无刷新数据读取用户注册、在线聊天室使用Ajax缓存、阻止缓存（new Date().getTime()）<script>window.onload=function (){ var oBtn=document.getElementById('btn1'); oBtn.onclick=function () { ajax('arr2.txt?t='+new Date().getTime(), function (str){ var arr=

原创 js高级事件：事件绑定、拖拽---带框、在div块内拖、事件捕获

事件绑定IE方式attachEvent(事件名称, 函数)，绑定事件处理函数detachEvent(事件名称, 函数)，解除绑定 //attachEvent(事件名， 函数) //IE object.attachEvent('onclick', function () { alert('a'); });DOM方式addEventListener(事件名称,函数, 捕获)removeEventListener(事件名称, 函数, 捕获) //FF //addEventL

原创 默认行为：右键菜单、拖拽

默认行为oncontextmenu 右键菜单例子1:屏蔽右键菜单<script>document.oncontextmenu=function (){ return false; //阻止默认事件};</script>例子2:自建右键菜单<style>* {margin:0; padding:0; list-style:none;}#div1 {position:absolute; width:80px; background:#CCC;

原创 js事件基础：event对象、事件冒泡、鼠标事件、键盘事件

document的本质window.onload=function (){ alert(document.childNodes[0].tagName);//undefined alert(document.childNodes[1].tagName);//HTML};点击获取坐标clientXclientYvar oEvent=ev||event;（兼容性写法）window.onload=function (){ document.onclick=function (ev)

原创 完美运动框架（JS运动中级）

json<script>var json={a: 12, b: 5};for(var i in json){ alert(i+'='+json[i]);}</script>框架1（先后）bug：不能同时发生。move.jsfunction getStyle(obj, name){ if(obj.currentStyle) { return obj.currentStyle[name]; } else { return getCompute

原创 多物体运动框架

Math.round(x) 将x四舍五入obj.style 获取的是内联样式（行间样式）obj.currentStyle 获取外部（使用）和内部样式表中的样式。注意：只有 IE 和 Opera 支持使用 currentStyle 获取 HTMLElement的计算后的样式，其他浏览器中不支持。标准浏览器中使用getComputedStyle，IE9也支持getComputedStyle。...

原创 JS运动基础：分享到、侧边栏、淡入淡出、悬浮窗

运动框架在开始运动时，关闭已有定时器把运动和停止隔开(if/else)缓冲运动逐渐变慢，最后停止距离越远速度越大速度由距离决定速度=(目标值-当前值)/缩放系数运动框架实例例子1：“分享到”侧边栏—通过目标点，计算速度值例子2：淡入淡出的图片------用变量存储透明度运动终止条件匀速运动：距离足够近缓冲运动：两点重合分享到：匀速运动<!DOCTYPE HTML><html><head><meta charset=

原创 定时器的应用：无缝滚动

<!DOCTYPE HTML><html><head><meta charset="utf-8"><title>无标题文档</title><style>* {margin:0; padding:0;}#div1 {width:712px; height:108px; margin:100px auto; position:relative; background:red; overflow:hidden;}#

原创 DOM操作应用高级：表格、表单、split拆分字符串、search查找字符串中的位置

表单应用获取：tBodies、tHead、tFoot、rows、cells var oTab=document.getElementById('tab1'); //下面两个alert等价 //alert(oTab.getElementsByTagName('tbody')[0].getElementsByTagName('tr')[1].getElementsByTagName('td')[1].innerHTML); alert(oTab.tBodies[0].rows[1].cells[1

原创 DOM操作：创建、插入、删除DOM元素，文档碎片

创建DOM元素createElement(标签名) 创建一个节点appendChild(节点) 追加一个节点eg：为ul插入li插入元素insertBefore(节点, 原有节点) 在已有元素前插入eg：倒序插入li删除DOM元素removeChild(节点) 删除一个节点eg：删除li文档碎片文档碎片可以提高DOM操作性能(理论上)文档碎片原理document.createDocumentFragment()<!DOCTYPE html>&lt.

原创 DOM基础

DOM (Document Object Model) 译为文档对象模型，是 HTML 和 XML 文档的编程接口。HTML DOM 定义了访问和操作 HTML 文档的标准方法。DOM节点childNodes nodeType获取子节点children parentNode- 例子：点击链接，隐藏整个lioffsetParent- 例子：获取元素在页面上的实际位置首尾子节点（有兼容性问题）- firstChild、firstElementChild- last

原创 用className选择元素并封装成函数

步骤：选出所有元素通过className条件筛选eg：将 class=“box” 的元素的 background 改为 red<!DOCTYPE HTML><html><head><meta charset="utf-8"><title>无标题文档</title><script>window.onload=function (){ var oUl=document.getElementById('

原创 JS基础：定时器

开启定时器setInterval 间隔型setTimeout 延时型停止定时器clearIntervalclearTimeout当点击开始时，每隔1000毫秒弹出提示框：a；当点击关闭时，弹窗消失。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"><script> window.onload=function() {

原创 JS基础：延时提示框

开启定时器setInterval 间隔型setTimeout 延时型停止定时器clearIntervalclearTimeout<!DOCTYPE html><html lang="en"><head> <title>Document</title><script>window.onload=function(){ var oDiv1 = document.getElementById('d