<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[ApologizeError的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/ApologizeError</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; ApologizeError]]></copyright><item><title><![CDATA[20个提升效率的JS简写技巧，告别屎山！]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/133906633</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/133906633</guid><author>ApologizeError</author><pubDate>Wed, 18 Oct 2023 15:31:35 +0800</pubDate><description><![CDATA[然后，在函数 foo 的参数列表中，使用赋默认值的方式来将 bar 参数设置为 mandatory() 的调用结果，如果 bar 参数未被传入或者传入了假值，就会触发 mandatory() 函数的执行。= 的写法更加简洁和易读。单一的逻辑非操作符已经可以将值转换为布尔类型并对其进行取反，所以第二个逻辑非操作符会再次对其进行取反，从而将其恢复为原始含义，并保持为布尔类型。不过，这个优化有些争议，很多人认为这么写会影响代码的可读性，因为许多变量写到了一行，不如一个变量一行更清晰明了，所以可以选择性采用。]]></description><category></category></item><item><title><![CDATA[8个开源的Vue/React小游戏，个个经典]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/133905954</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/133905954</guid><author>ApologizeError</author><pubDate>Wed, 18 Oct 2023 14:48:57 +0800</pubDate><description><![CDATA[该项目使用的技术栈包括：TypeScript、Webpack、React、Redux、React Router。其功能包括：15个关卡、快速下落和硬下落、方块放置预览、音效和背景音乐、简化的得分系统等。使用 React、Redux Toolkit、ThreeJS、React Three Fiber、ChessJS 和 ChakraUI 构建的经典国际象棋游戏。本文来分享 8 个基于 Vue / React 的小游戏，包括俄罗斯方块、贪吃蛇、扫雷、国际象棋等，个个经典！]]></description><category></category></item><item><title><![CDATA[H5加水印]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/133811789</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/133811789</guid><author>ApologizeError</author><pubDate>Fri, 13 Oct 2023 15:28:40 +0800</pubDate><description><![CDATA[【代码】H5加水印。]]></description><category></category></item><item><title><![CDATA[sentry记录前端报错，也可主动发送消息]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/131962414</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/131962414</guid><author>ApologizeError</author><pubDate>Thu, 27 Jul 2023 16:02:16 +0800</pubDate><description><![CDATA[sentry记录前端报错，也可主动发送消息。以上方法引入后，js报错就会被记录。]]></description><category></category></item><item><title><![CDATA[js查看tif格式文件]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/121650624</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/121650624</guid><author>ApologizeError</author><pubDate>Wed, 01 Dec 2021 11:01:08 +0800</pubDate><description><![CDATA[js查看tif]]></description><category></category></item><item><title><![CDATA[clipboard.js第一次点击失效，事件绑定问题。]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/121230803</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/121230803</guid><author>ApologizeError</author><pubDate>Tue, 09 Nov 2021 16:30:19 +0800</pubDate><description><![CDATA[clipboard.js第一次点击失效
多数的点击不生效，都是没有处理好事件绑定。下图是https://clipboardjs.com/官网给出的高级选项。

以下是翻译后的。

很多人都遇到了这个问题，双层事件也没能解决本人遇到的问题，只因为第一次点击时才将复制事件绑定到元素上。
再以下是本人代码，古董级的angularJS编写（PS：没办法，老板给钱咱就得维护，还得维护好）。
&lt;div ng-show="item.copy" class="clipboard-class" style="width]]></description><category></category></item><item><title><![CDATA[抓取微信小程序源码并反编译（蓝叠模拟器）]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/113751571</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/113751571</guid><author>ApologizeError</author><pubDate>Mon, 08 Feb 2021 09:59:05 +0800</pubDate><description><![CDATA[我的电脑是win10系统，mac的没研究。（哎，穷逼买不起mac）
准备工作：
1.蓝叠手机模拟器（自带文件管理器----很重要）
2.微信apk安装包
3.nodeJS
4.npm
5.反编译工具
文本亲测有效系统为 win10  64位系统
第一步：安装蓝叠手机模拟器
安装好之后，完全可以当手机使用（既可以认为这就是手机）
蓝叠手机模拟器下载地址：https://www.bluestacks.cn/

由于此模拟器自带文件管理器，所以不需要再安装别的文件管理器。如果没有的，可以安装RE

第二步：将下载]]></description><category></category></item><item><title><![CDATA[js 数组相同属性值去重]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/109495443</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/109495443</guid><author>ApologizeError</author><pubDate>Wed, 04 Nov 2020 17:49:37 +0800</pubDate><description><![CDATA[两个数组按相同属性值去重
var polarr=[{name:"Tom",age:"8"},{name:"Marry",age:"9"}];
var pollist=[{name:"Tom",age:"8"}];
var result = [];
for(var i = 0; i &lt; pollist.length; i++){
   var obj = pollist[i];
   var num = obj.riskcode;
   var isExist = false;
   for(var j]]></description><category></category></item><item><title><![CDATA[JS session 多用于实时聊天]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/109495263</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/109495263</guid><author>ApologizeError</author><pubDate>Wed, 04 Nov 2020 17:40:32 +0800</pubDate><description><![CDATA[JS session 多用于实时聊天，首先我们先了解一下session机制和原理
session机制：
客户端第一次请求服务端时：服务端会产生一个session对象（用于保存该客户的信息）；并且每个session对象都会有一个唯一的sessionID(用于区分其他session)；
服务端又会产生一个cookie，并且该cookie的name=JSESSIONID，value=服务端sessionID的值；
然后服务端会在响应客户端的同时将该cookie发送给客户端，至此客户端就有了一个cook（JSESS]]></description><category></category></item><item><title><![CDATA[Html中meta标签详解]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/106078152</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/106078152</guid><author>ApologizeError</author><pubDate>Tue, 12 May 2020 15:54:21 +0800</pubDate><description><![CDATA[&lt;!-- charset 此特性声明当前文档所使用的字符编码，但该声明可以被任何一个元素的 lang 特性的值覆盖 --&gt;
&lt;meta charset="utf-8" /&gt;

&lt;!-- http-equiv 这个枚举属性定义了能改变服务器和用户引擎行为的编译。这个编译值使用content 来定义 --&gt;

------------------------------Content-Security-Policy-----------------------------
&]]></description><category></category></item><item><title><![CDATA[png、jpg、gif 这些图片格式解释一下，分别什么时候用。有没有了解过 webp？]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/106077308</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/106077308</guid><author>ApologizeError</author><pubDate>Tue, 12 May 2020 15:27:39 +0800</pubDate><description><![CDATA[（1）BMP，是无损的、既支持索引色也支持直接色的、点阵图。这种图片格式几乎没有对数据进行压缩，所以BMP格式的图片通常
具有较大的文件大小。
（2）GIF是无损的、采用索引色的、点阵图。采用LZW压缩算法进行编码。文件小，是GIF格式的优点，同时，GIF格式还具
有支持动画以及透明的优点。但，GIF格式仅支持8bit的索引色，所以GIF格式适用于对色彩要求不高同时需要文件体积
较小的场景。
（3）JPEG是有损的、采用直接色的、点阵图。JPEG的图片的优点，是采用了直接色，得益于更丰富的色彩，JPEG非常]]></description><category></category></item><item><title><![CDATA[layoutviewport、visualviewport 和 idealviewport 的区别]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/106077245</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/106077245</guid><author>ApologizeError</author><pubDate>Tue, 12 May 2020 15:25:58 +0800</pubDate><description><![CDATA[相关知识点：
如果把移动设备上浏览器的可视区域设为viewport的话，某些网站就会因为viewport太窄而显示错乱，所以这些浏览器就决定
默认情况下把viewport设为一个较宽的值，比如980px，这样的话即使是那些为桌面设计的网站也能在移动浏览器上正常显示了。
ppk把这个浏览器默认的viewport叫做layoutviewport。

layoutviewport的宽度是大于浏览器可视区域的宽度的，所以我们还需要一个viewport来代表浏览器可视区域的大小，ppk把
这个viewport叫做vi]]></description><category></category></item><item><title><![CDATA[margin 重叠问题的理解]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/106077128</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/106077128</guid><author>ApologizeError</author><pubDate>Tue, 12 May 2020 15:22:50 +0800</pubDate><description><![CDATA[作者：爱前端不爱恋爱
链接：https://zhuanlan.zhihu.com/p/114257330
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

块级元素的上外边距（margin-top）与下外边距（margin-bottom）有时会合并为单个外边距，这样的现象称为“margin合
并”。

产生折叠的必备条件：margin必须是邻接的!

而根据w3c规范，两个margin是邻接的必须满足以下条件：

•必须是处于常规文档流（非float和绝对定位）的块级盒子，]]></description><category></category></item><item><title><![CDATA['display'、'position'和'float'的相互关系]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/106077084</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/106077084</guid><author>ApologizeError</author><pubDate>Tue, 12 May 2020 15:20:14 +0800</pubDate><description><![CDATA[原文链接
（1）首先我们判断display属性是否为none，如果为none，则position和float属性的值不影响元素最后的表现。
（2）然后判断position的值是否为absolute或者fixed，如果是，则float属性失效，并且display的值应该被
设置为table或者block，具体转换需要看初始转换值。
（3）如果position的值不为absolute或者fixed，则判断float属性的值是否为none，如果不是，则display
的值则按上面的规则转换。注意，如果positi]]></description><category></category></item><item><title><![CDATA[使用图片 base64 编码的优点和缺点]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/106077003</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/106077003</guid><author>ApologizeError</author><pubDate>Tue, 12 May 2020 15:18:05 +0800</pubDate><description><![CDATA[base64编码是一种图片处理格式，通过特定的算法将图片编码成一长串字符串，在页面上显示的时候，可以用该字符串来代替图片的
url属性。
使用base64的优点是：
（1）减少一个图片的HTTP请求
使用base64的缺点是：
（1）根据base64的编码原理，编码后的大小会比原文件大小大1/3，如果把大图片编码到html/css中，不仅会造成文件体
积的增加，影响文件的加载速度，还会增加浏览器对html或css文件解析渲染的时间。
（2）使用base64无法直接缓存，要缓存只能缓存包含base64的文件，]]></description><category></category></item><item><title><![CDATA[前端css经常遇到的浏览器的兼容性有哪些？]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/106076897</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/106076897</guid><author>ApologizeError</author><pubDate>Tue, 12 May 2020 15:15:36 +0800</pubDate><description><![CDATA[（1）png24位的图片在iE6浏览器上出现背景
解决方案：做成PNG8，也可以引用一段脚本处理。
（2）浏览器默认的margin和padding不同
解决方案：加一个全局的*{margin:0;padding:0;}来统一。
（3）IE6双边距bug：在IE6下，如果对元素设置了浮动，同时又设置了margin-left或
margin-right，margin值会加倍。
#box{float:left;width:10px;margin:00010px;}
这种情况之下IE会产生20px的距离
解决方案：]]></description><category></category></item><item><title><![CDATA[CSS 清除默认样式]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/106076804</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/106076804</guid><author>ApologizeError</author><pubDate>Tue, 12 May 2020 15:11:43 +0800</pubDate><description><![CDATA[-因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对CSS初始化往往会出现浏览器之间的页面显示差异。
-当然，初始化样式会对SEO有一定的影响，但鱼和熊掌不可兼得，但力求影响最小的情况下初始化。
最简单的初始化方法：（强烈不建议）
*{padding:0;margin:0;}

淘宝的样式初始化代码：
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend
,button,input]]></description><category></category></item><item><title><![CDATA[Sublime常用插件详解]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/103294732</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/103294732</guid><author>ApologizeError</author><pubDate>Thu, 28 Nov 2019 16:01:02 +0800</pubDate><description><![CDATA[- Alignment
使用说明：Alignment是一个代码格式化插件，它可以使多行代码中的等号对齐，也可以调整多行代码为一个缩进级别。
快捷键：ctrl+shift+alt+a
- AutoFileName
使用说明：文件名自动补全，根据路径自动提示该路径下的文件
- BracketHighlighter
使用说明：BracketHighlighter插件是用来匹配相对的符号，然后高亮显示，比...]]></description><category></category></item><item><title><![CDATA[javascript监听并记录实时报错]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/103254993</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/103254993</guid><author>ApologizeError</author><pubDate>Tue, 26 Nov 2019 14:29:48 +0800</pubDate><description><![CDATA[及时发现Bug，提高Debug效率
demo

调用方式很简单

官方文档

]]></description><category></category></item><item><title><![CDATA[Cleave input输入框 自动格式化内容]]></title><link>https://blog.youkuaiyun.com/ApologizeError/article/details/103204513</link><guid>https://blog.youkuaiyun.com/ApologizeError/article/details/103204513</guid><author>ApologizeError</author><pubDate>Fri, 22 Nov 2019 17:55:01 +0800</pubDate><description><![CDATA[Cleave.js 有一个简单的目的：帮助你自动格式输入的文本内容。 这个想法是提供一个简单的方法来格式化您的输入数据以增加输入字段的可读性。通过使用这个库，您不需要编写任何正则表达式来控制输入文本的格式。
然而，这并不意味着取代任何验证或掩码库，你仍应在后端验证数据。它支持信用卡号码、电话号码格式（支持各个国家）、日期格式、数字格式、自定义分隔符，前缀和块模式等，提供 CommonJS/AMD ...]]></description><category></category></item></channel></rss>