blog
blog copied to clipboard
diamont1001
博主太懒了，有时间都在玩游戏，就不爱写博客
不作普及，不作教程，只记录平时使用过的刚学的而且容易忘记的用法。 ## 查询所有的 `name` 和它的的重复次数，并查出重复次数大于 `2` 的记录 ```sql SELECT name, COUNT(*) as A FROM tb_demo WHERE status = 1 GROUP BY name HAVING A>1; ```
在 Javascript 的学习中，this 的重要性不言而喻，而且容易被人误解，之前遇到过一位同学，在函数体内大量使用 `this.xxx = xxx` 的方式来定义变量，错误的以为 `this` 指代的是函数体内的命名空间，最后全部的变量都挂在 `window` 下而导致变量冲突。 这里就通过简单的方式来重点说明一下 `this` 的用法，当然，与之相关的两个也容易被忽略的方法 `call` 和 `apply` 也一同介绍一下。 ## this 要说 `this`，必须先从「函数」说起，在 《Javascript 权威指南》里的「函数」那一节，有给 `this` 做了一翻解释，简单来说，可以这么理解：「this 关键字，是函数调用的上下文」 怎么去理解它呢，"一般" 来说，是酱紫的：...
最近发现，挺多同学对 CSS 的优先级（权重）都了解不深，或者在学习的过程中比较容易忽略，一般也只知道「后来优先」这一原则，这里就整理一下做个扫盲贴吧！ - 给目标元素直接添加样式，永远比继承的优先级高 - 后来优先（覆盖原则） - 无视 DOM 树中的距离（`body header` 跟 `html header` 是一样的） ## 权重表 通用选择器（`*`）< 标签元素（`div`） < 类（`.`） < 属性 < 伪类 < ID（`#`） < 内联...
## 栅格与坐标 Canvas 的画面栅格以及坐标空间跟 css 的不一样，它是以左上角为原点，横向为 X 轴，纵向为 Y 轴，如图。所有元素的位置都相对于原点定位。  ## 图形 首先实例化个 `canvas` 和 `ctx`： ```js var canvas = document.createElement('canvas'); // canvas.width = 320; // canvas.height = 240;...
早上有位同学找我求救，说她朋友的一个网站有点奇怪，如下： 站点：[http://www.dzxtx.com/](http://www.dzxtx.com/) - 在浏览器直接访问链接，没问题 - 百度搜索 “徳智行天下”，搜索结果点击进去会打开另外一个赌博网站 如图： 【1. 网站直接访问，页面正常】  【2. 百度搜索，排在前三都是（这个 SEO 做的可以啊）】  【点击前三的任意一个，意外发生，进去的是一个赌博网站】  好吧，不得不说，这站点的 SEO 做的还是不错的，起码搜索关键词，前三都是他们的，这么好的流量入口，就这么被硬生生的被别人给劫走了，关键还是一个害人的赌博网站（这些网站还真是春风吹又生啊）。 其实一看就知道被劫持了。但是劫持的方式有很多种：[参考这里](https://www.cloudxns.net/Support/detail/id/2803.html) 今天难得遇到一个现成的劫持的案例，不去分析下感觉有点对不起自己的好奇心！ 好吧，开搞！ 首先，打开 Chrome Dev Tools，看下网络请求的情况！ 【复制百度搜索出来的第一个链接：[首页-德智行天下](https://www.baidu.com/link?url=-t-SszLWyED5fH-aS2rABds4a4YXgdLE_RKu6a8-PUC&wd=&eqid=f217d6fb0000343b000000065994f69e)，可以看到其中的网络请求如下】 ...
> 大概写于 2010 年 12 月 30 号，上传于 [CSDN](http://download.csdn.net/download/diamont1001/2949837) vi 编辑器是所有 Unix 及 Linux 系统下标准的编辑器，它的强大不逊色于任何最新的文本编辑器，这里只是简单地介绍一下它的用法和一小部分指令。由于对 Unix 及 Linux 系统的任何版本，vi 编辑器是完全相同的，因此您可以在其他任何介绍 vi 的地方进一步了解它。vi 也是 Linux 中最基本的文本编辑器，学会它后，您将在 Linux 的世界里畅行无阻。 ## 1、vi 的基本概念...
作为一名有逼格的程序猿，Google 可以说是标配，每天不上它几次都不好意思下班。 Google 搜索引擎页面非常简单，只有一个输入框和两个按钮（起码看起来是），然而，外表单纯的它，其实隐藏了好多高级技能，要用好它还是需要花点时间去学习的。 下面，让我们来由浅至深的慢慢把它的隐藏技能给刷出来吧！ ## 基本搜索 ### 1. 空格 空格，在搜索引擎来看就是一个分隔符，它会把输入的搜索词以 “空格” 来切分，分成多个搜索词。比如你输入的是 `the best programming language` ，那么 Google 返回的文章里既有 “programming”，也有 “language” 存在，还有 “best”，但不一定有 “the best programming language” 存在。 另外，机智的...
# 前端模块化管理 # ## 一、模块化思想 ## [webpack](https://diamont1001.github.io/webpack-summary/) 的出现把前端模块化推向了一个新的高度，在 webpack 的概念中，任何资源都可以当成模块来处理，再配合上 npm ，双剑合璧，天下无敌了。 之前跟天猪 @atian25 讨论的过程中，请教过他关于前端模块管理的事情，总结了下，核心思想是酱紫的：  - 底层库：职责单一、耦合性低，原子性的汇集到最底层，各司其职，达成互通。 - 中间模块（组件），业务层面的积累，对底层库的进一步聚合，通常是为了解决某个业务问题而存在。 - 上层框架，为中间模块的进一步聚合和优化，系统的解决某一类问题，比如 [egg](https://eggjs.org/) 等。 ## 二、模块开发规范 ##  - 模块基于...
# 前端动画 ## 技术选型 动画效果和场景不同，需要的技术实现方式也不同，让我们一起来探索下各需求场景下适合的技术实现方式吧（古人云：前端动画不只有 CSS3 的^_^） ### 一、播放式 播放式的动画场景，类似动画片一样的一播到底，一般交互会比较少，最多也就是在中途跳个按钮打断一下。 像这种场景，自然而然的我们会想到了视频，或者 canvas ，嗯没错，这里应该没人会说 CSS3 吧！ #### 方案1：[Animate](https://helpx.adobe.com/cn/animate.html?promoid=W6K8JWBB&mv=other) + [flash2x](http://web.flash2x.org/) + [AnnieJS](http://www.annie2x.com/) - Animate：制作动画 flash - Flash2x：把 flash 导出前端代码 - AnnieJs：组织导出来的代码，做二次开发...
> CSDN地址(2016-05-18): [http://blog.csdn.net/diamont1001/article/details/51444279](http://blog.csdn.net/diamont1001/article/details/51444279) 最近在项目中做到头像本地处理的时候发现一个问题，就是上传的头像源图如果比较大，会导致生成后的头像锯齿比较明显。 为了解决这个问题，网上搜了好多资料，很多都是说不断的缩小图片然后再放大图片，再渲染到canvas，这个方案试过了，但是无论从效率还是效果上都不太尽人意。 后来不小心在github上发现了一个小插件，还真好用，完美的把问题解决了。 这里要感谢一下插件作者，再帮他宣传一下。 插件地址：[https://github.com/sapics/scale.js](https://github.com/sapics/scale.js) ## 头像上传处理思路是这样的： 1.