Hot For Coding
Linux du命令使用

使用Win平台习惯后在Linux下查看目录列表时希望能看到实际文件的大小,我们可以使用du命令查看

命令格式

du [options] [path]

常用参数有

  • -a or -all 为每个指定文件显示磁盘使用情况,或者为目录中每个文件显示各自磁盘使用情况。
  • -b or -bytes 显示目录或文件大小时,以byte为单位。
  • -c or -total 除了显示目录或文件的大小外,同时也显示所有目录或文件的总和。
  • -D or -dereference-args 显示指定符号连接的源文件大小。
  • -h or -human-readable 以K,M,G为单位,提高信息的可读性。
  • -H or -si-h参数相同,但是K,M,G是以1000为换算单位,而不是以1024为换算单位。
  • -k or -kilobytes 以1024 bytes为单位。
  • -l or -count-links 重复计算硬件连接的文件。
  • -L<符号连接> or -dereference<符号连接> 显示选项中所指定符号连接的源文件大小。
  • -m or -megabytes 以1MB为单位。
  • -s or -summarize 仅显示总计,即当前目录的大小。
  • -S or -separate-dirs 显示每个目录的大小时,并不含其子目录的大小。
  • -x or -one-file-xystem 以一开始处理时的文件系统为准,若遇上其它不同的文件系统目录则略过。
  • -X<文件> or -exclude-from=<文件> 在<文件>指定目录或文件。
  • --exclude=<目录或文件> 略过指定的目录或文件。
  • --max-depth=<目录层数> 超过指定层数的目录后,予以忽略。
  • --help 显示帮助。
  • --version 显示版本信息。

...

READ ALL

input的onchange事件实际触发条件与解决方法

input中onchange事件特别常用,现在同onclick一样使用频率很高,然而onchange的机制实际上有很多童鞋并不清楚,我们通过实例来分析这个事件的特征。

触发onchange

首先页面有一个input标签,并且已绑定onchange事件,如

<input type="text" onchange="console.log(this.value);" />

这个事件要做的动作很简单,只是把input的值在控制台上打印出来就好。效果

full

...

READ ALL

一些让我悲催编程经历

rm命令

有一次,项目出了点问题,为了图方便就直接ssh上去了。问题解决后准备delete测试文件,结果不小心直接使用rm -rf命令把项目整个程序删除了,而备份文件不是最新的程序。结果花了将近一周才把程序重新部署到线上,恢复访问。从那以后,我每次登陆服务器时,不轻易敲rm这个命令,心里有恐惧感。

升级程序版本

我一直喜欢把软件升级到最新的版本,有一次我发现MySQL又出新版本了,我于是赶紧下载,解压,编译,安装。但总是在某个地方出错安装始终进行不下去,而每一次编译MySQL都需要十多分钟特别耗时。最终我是放弃了最新版本的安装,而站点也因为我的升级操作停止运行了将近一天的时间。其实因为升级程序导致站点不能访问的状况已经有好几次,升级服务器软件的操作要谨慎,因为极有可能不兼容导致环境出问题。

...

READ ALL

关于Web服务器头部的Server与X-Powered-By信息

通过工具可以查询到站点服务器信息与程序信息及版本,其实这是通过服务器响应头信息里返回的,如果把这些信息暴露出去对站点不安全,我们可以通过隐藏或修改头信息的方法来阻止这些信息暴露

头信息包含服务器信息与程序信息

有些查询工具在我们输入某个站点的URL后就能判断这个站点的WebServer与程序类型

例如在站长工具下guofei.me站点

full

查询豆瓣的

full

...

READ ALL

Chrome可以其它浏览器拖拽图片

Chrome永远都是走在技术前线,总会有些惊人的表现,最近我在做一个拖拽上传图片功能时发现Chrome竟然可以直接从其它浏览器拖拽图片。

普通拖拽事件,各个浏览器都识别从本地磁盘拖拽的文件

HTML5的拖拽drop事件让Web应用看到了两点,然而在普通的drop事件里,多数浏览器只支持从本机电脑磁盘上拖拽到浏览器,例如:

JavaScript代码

// 获取要触发drop事件的DIV
var du = $('dragUpload'); 
 
// 根据ID获取对像
function $(id) {
  return document.getElementById(id);
}
 
// 把拖拽到网页上的图片显示到页面上
function displayImage (container,dataURL) {
  var img = document.createElement('img');
  img.src = dataURL;
  container.appendChild(img);
}
 
// 拖放释放主要处理函数
du.addEventListener('drop', function (e) {
  e.stopPropagation();
  e.preventDefault();
  du.className = du.className.replace('drag-over','');

  // 获取拖放文件 一个数组
  var files = e.dataTransfer.files;  
  handleFiles(files);  
}, false);

...

READ ALL

JavaScript判断一个变量是对象还是数组

typeof都返回object

在JavaScript中所有数据类型严格意义上都是对象,但实际使用中我们还是有类型之分,如果要判断一个变量是数组还是对象使用typeof搞不定,因为它全都返回object

var o = {name: 'Nicholas Lee'};
var a = ['reg', 'blue'];
 
console.log( ' o typeof is ' + typeof o);
console.log( ' a typeof is ' + typeof a);

Output

o typeof is object
a typeof is object   

...

READ ALL

JavaScript使用eval将字符转换为程序代码

首先声明,不推荐使用eval,这是非常危险且不稳定因素太多的做法

近期项目有这样一个需求,从服务器端返回的JSON里有一段JavaScript代码,需要在浏览器端执行它,把结果填充到一个数组里,最后toString回一个字符串,然后再提交到服务器保存。

首先,已有一个列表:

var list = [
  {
    name: '张三',
    fun: function () {
      console.log(this.name);
    }
  }
];

而服务器可能读取某个js文件,内容格式如下:

{
  name: '李四',
  fun: function () {
    console.log(this.name);
  }
}

...

READ ALL

JavaScript声明对象时属性名加引号与不加引号的区别

这个问题很好有人关注,但我每一次在声明一个对象属性的时候都要想想要不要给属性加引号?加引号与不加引号有什么区别?

其实在JavaScript中,加引号与不加引号都是一样用,都是有效的。如

var obj = {
  name: 'Nicholas Lee',
  'age': 18,
};
 
console.log('name: ' + obj.name);
console.log('age: ' + obj.age);

Output:

name: Nicholas Lee
age: 18

哪在什么时候有区别呢?在你使用一些非合法命名规则的时候,就显的有必要了,比如

...

READ ALL

jQuery对象与JSON互相转换

JSON串的方便以及通用性逐渐成为一种规范。jQuery有一个插件jquery-json可以轻易的实现对象与JSON互相转换。

对象转JSON

主要使用toJSON()方法

var obj = {
  name: '琼台博客',
  url: 'www.qttc.net',
  desc: '个人技术日志',
  author: 'Nicholas Lee'
};
 
var json = $.toJSON(obj);
console.log(json);

Output:

{"name":"琼台博客","url":"www.qttc.net","desc":"个人技术日志","author":"Nicholas Lee"}

...

READ ALL