zkq5168的专栏

可以看到LTS下的版本列表，我选择了18.19.1版本，执行如下命令进行安装。我本机安装了nvm管理工具，所以通过nvm去查询下node的版本信息。然后就静静等待安装结束，直到看到控制台输出如下信息，表示安装已经完成。百度了一下，是说版本不对，不是LTS版本，建议我更换Node版本。然后我们执行nvm use 18.19.1就可以生效该版本。安装完成后我们用如下命令查看一下。然后看到如下可以安装的版本信息。接下来就可以愉快的编码了。我在控制台运行如下命令。

百度过，网上也给了很多方案，结果验证后都是无效的，最后自己突然想到能不能关闭SSL验证呢，说干就干。最近研究前端的一些技术点，在使用npm安装依赖包的时候发现会卡住，时间超时后会报如下错误。执行完上述命令后，如果没有任何错误那就表示运行成功了。接下来运行npm install命令试试。

实际工作中往往使用较多的是JavaScript方式实现多文件的上传，因为除了上传文件外，还需要额外上传相关的文件元数据信息，所以使用JavaScript的方式更加实用。看下面的示例，基于vue的框架编写的文件上传组件。以上是使用html自带的标签元素实现的文件上传。// 这里添加文件上传的逻辑处理代码。属性，以下简单描述多文件上传的步骤。HTML中实现多文件上传是通过用。属性，以允许用户选择多个文件。* 监测文件上传控件变化。属性允许用户选择多个文件。HTML表单准备，使用。

这只是一个基本的HTML结构，实际上，要使文件上传功能更加完善，还需要使用后端技术来处理文件的接收和存储。另外单文件上传还可以结合JavaScript语言来实现，以下是一个简单的例子，演示如何使用JavaScript结合HTML实现文件上传，并通过Ajax发送文件到服务器。随着Web应用的普及，文件上传功能成为许多网站和应用不可或缺的一部分。在早期的html应用中，都是使用form标签中嵌套来实现文件上传的，具体代码如下。本人这里也提供一个基于Vue3的文件上传实现，代码如下。'% 上传中...'

接下来看看“\”，这个符号表示转移，就是说如果需要匹配类似[,],^,+等有特殊含义的字符，可以用"\"做转义。JavaScript的正则表达式有两种写法，一种是字面量模式的写法，一种是构造函数模式的写法。先后输入hi，this，what等字符串，发现hi和this可以匹配，what不能匹配。再来看比较类似的表达式“{x,y}”，表示前一模式可以被重复x到y次。接下来看另外一个表达式"{x}"，该表达式表示前一模式可以被重复x次。接下来看下"()"，这个表示可以指定一堆字符来匹配一个模式。

上述代码中变量x就是全局作用域，方法f1的作用域也是全局，f1方法中的变量y是局部的，y的作用范围仅限f1方法体内，离开了f1的方法体的作用范围，就无法获取到y的值，所以上述的例子中最后打印y的时候是undefined。上述代码能正常运行，首先全局变量a对于f1方法体是可见的，在f1方法体内对全局变量a进行赋值，修改为3，所以f1()方法执行完毕后输出a的值是3，上面这段代码相对大家应该都比较容易。这就是上面这段代码的预解析过程，只要把这段代码的预解析搞明白了，就能猜到他的结果输出了。

我们可以看到，运行结果为12，为什么会这样呢？这就牵扯到JS的预解析，首先Javascript会预解析代码中所有的变量和函数，因此在执行sum(2, 10)函数前已经将sum函数进行解析了，所以在调用sum函数的时候能正常输出。​ 为什么会讲到这个预解析呢，个人认为工作了很多年的前端可能都不一定搞清楚这个机制，所以还是将这个记录下来作为自己的学习比较，同时也分享给广大的其他爱学习的前端开发者们。我们看一下结果吧，会发现这段代码会抛出如下错误。运行结果如下，是不是跟你推测的结果一致呢。

返回一个新的数组，包含从start到end（不包含该元素）的数组。运行结果：red,blue,green以逗号分隔的字符串。将所有数组元素结合为一个字符串，可以自定义分隔符。删除数组首个元素，并把所有其他元素向前位移。从数组中删除最后一个元素。向数组的开头添加新元素。向数组末尾添加新元素。

合并两个对象的属性，返回合并后的对象，不改变原对象的值，如果对象的属性重复，后面对象属性的值覆盖前面对象的属性值。获取对象的每一项属性的键和值，包装成一个数组，并返回一个二维数组。如果对象存在该属性则返回true，否则返回false。获取对象的所有键并返回键的数组。获取对象的所有值并返回值的数组。检测对象是否拥有某个属性。为对象动态设置多个属性值。

看完上面的解释如果还是觉得难以理解的话，我们可以简单的认为在平面上的物体由于距离的远近而显示出不一样的效果，同时让人眼感觉是一个三维立体的存在。这里我们说明一下，transform属性的执行顺序是从右向左执行的，所以上述的执行顺序是先按y轴旋转90度，再向右侧移动150像素。至此，3d效果的正方体就制作完成了，当然还是有一些问题，比如3、4、5面的数值显示方向有误，主要是旋转方向的问题，我们调整一下。数值为2的div块，我们让他往屏幕右侧移动150像素，再沿着y轴旋转90度，设置值如下，

我们会看到属性值的顺序会引起不一样的效果，这里我们总结一下，transform属性的执行顺序是从右到左依次执行，比如第一个组合就是先触发旋转动作，再触发位移动作，第二个是先触发位移动作，再触发旋转动作，所以最终的效果不同。另外transform属性的函数可以混合使用，让我们看一下把transform的属性改为如下。上述效果实现鼠标移入元素时触发元素的旋转，正数顺时针，负数逆时针。3d转换指在x轴、y轴和z轴组成的3维空间中发生的转换。上图效果实现鼠标移入元素时触发元素的缩放效果。转换分为2d和3d转换。

degree2：从degree2到100%的部分都用color2填充，跟color1没有有重叠的部分进行渐变，也就是degree1到degree2部分进行渐变，取值可以是百分比或具体的像素值。基础径向渐变：需设置两个及两个以上的颜色，颜色之间用","间隔，颜色会平均分配，根据设置颜色的顺序，进行渐变。上述的例子是基础线性渐变的例子，其实就是进阶渐变的默认模式，设置两个颜色，默认从起点色标渐变到终点色标。位置，表示渐变中心点的坐标。可以发现从0~70%都是纯色的红色，从70%到100%是红色到黑色的渐变。

table布局在早期是很流行的，因为使用table布局的表格结构清晰，易于理解，表格结构支持行列跨度，可以实现复杂的布局，但是他也有缺点，不利于SEO，复杂的页面代码也非常复杂，难以维护，不支持响应式布局，在移动端上不能很好的适配。浮动布局让程序员可以更加自由的去定制页面，他可以让元素浮动起来实现任意位置的布局，但是浮动布局也有一些场景使用起来不是很方便，比如横向浮动时经常会有空白间隙的问题，还有高度塌陷的问题等等。效果：可以看到就算项目合起来的宽度超过了父元素的宽度，也不会换行，会将项目的宽度进行压缩。

属性选择器专门用于通过元素的属性及其值匹配页面中的元素，当类，id和元素选择器无法区分元素时，就可用属性选择器按属性的差异来区分元素，属性选择器可用任何属性作为条件，且支持模糊匹配，所以应用及其广泛，格式如下。E[attribute |= val]选择器：选择属性attribute的值是用连字符“-”分隔的单词，并以val开头的E元素，主要用于lang属性，比如”en”、“en-us”、“en-gb”等。伪元素选择器专门匹配元素中的内容，而不是匹配元素，常见的如下。

可以发现文字不是在新的一行，而是紧跟着html元素，这就导致布局无法按照我们预期的方式展现，这就是接下来我们要说的高度塌陷问题，那这个问题该如何解决呢，以及解决方式都有哪些，接下来我将罗列目前已知的几种处理方式，大家可以根据实际情况选择使用。发现box1脱离了普通文档流，因box2还是属于普通文档流，所以直接顶上去，占据了box1元素原先的位置，接下来我们设置box1右浮动。可以看到效果一致，但是为了清除浮动，在html页面上增加一个元素，就显得多余，而且还会影响文档结构，也不推荐。

一、定位概念HTML的定位默认从上到下，垂直排列，也有水平排列的布局这就是普通的文档流采用的定位方式，块元素默认占满一行，块元素之间从上到下排列，垂直排列，块元素有div，p，h1等，如下图，6个div，每个div占满一行

如何将本地代码上传到github远程仓库打开本地的文件资源管理器，定位到具体的目录右键鼠标菜单打开如下界面输入如下命令ssh -T git@github.com经过上述步骤后，工程文件就可以直接push到远端的github仓库了...

安装Zookeeper1.下载Zookeeper官网地址：https://www.apache.org/dyn/closer.lua/zookeeper/zookeeper-3.6.3/apache-zookeeper-3.6.3-bin.tar.gz或者也可访问地址：http://archive.apache.org/dist/zookeeper/自行选择版本下载下载完Zookeeper的压缩包后，解压压缩包，目录结构如下：打开conf目录，拷贝该目录下的zoo_sample.cfg文件为z

索引库相关操作Overview索引库的总览，显示集合的信息和分片信息Analysis分析器：这个功能可以用来调试字段的分词效果左边部分是针对索引解析器的处理过程，右边部分是针对查询解析器的处理过程，我们来做一下测试，选择底部的字段或者字段类型，这里我们选择content字段，输入“I love you”，然后点击Analyse Values按钮，让我们来看一下索引解析器和查询解析器的处理结果从图中可以看出，左侧索引使用到的解析器如下：ST解析器（StandardTokenizer）-

1. 管理控制台介绍1.1 Dashboard（总览页）1.1.1 InstanceSolr的运行实例信息1.1.2 Version当前运行Solr的版本信息以及对应的Lucene版本信息1.1.3 JVM当前Solr运行的相关JVM的信息，包含JDK信息，CPU核数，Java启动参数信息1.1.4 System当前Solr运行环境的物理内存、交换空间、JVM内存空间的使用情况信息1.1.5 Security当前Solr运行的安全相关信息（目前没有涉及到这块）