【CSS】伪类清除浮动

Posted on 2019-05-10 |

clearfix:after{
    display:block;
    content: "";
    clear: both;
    height:0;
}

如果你的网站只需要兼容webkit、firefox、opera等浏览器，建议对于伪元素采用双冒号的写法，如果不得不兼容IE浏览器，还是用CSS2的单冒号写法比较安全。

【建站】端口号介绍

Posted on 2019-05-09 |

常用端口号：

代理服务器常用以下端口：

（1）. HTTP协议代理服务器常用端口号：80/8080/3128/8081/9080

（2）. SOCKS代理协议服务器常用端口号：1080

（3）. FTP（文件传输）协议代理服务器常用端口号：21

（4）. Telnet（远程登录）协议代理服务器常用端口：23

（5）. HTTP服务器，默认的端口号为80/tcp（木马Executor开放此端口）；

（6）. HTTPS（securely transferring web pages）服务器，默认的端口号为443/tcp 443/udp；

（7）. Telnet（不安全的文本传送），默认端口号为23/tcp（木马Tiny Telnet Server所开放的端口）；

（8）. FTP，默认的端口号为21/tcp（木马Doly Trojan、Fore、Invisible FTP、WebEx、WinCrash和Blade Runner所开放的端口）；

（9）. TFTP（Trivial File Transfer Protocol ），默认的端口号为69/udp；

（10）. SSH（安全登录）、SCP（文件传输）、端口重定向，默认的端口号为22/tcp；

（11）. SMTP Simple Mail Transfer Protocol (E-mail)，默认的端口号为25/tcp（木马Antigen、Email Password Sender、Haebu Coceda、Shtrilitz Stealth、WinPC、WinSpy都开放这个端口）；

（12）. POP3 Post Office Protocol (E-mail) ，默认的端口号为110/tcp；

（13）. WebLogic，默认的端口号为7001；

（14）. WebSphere应用程序，默认的端口号为9080；

（15）. WebSphere管理工具，默认的端口号为9090；

（16）. JBOSS，默认的端口号为8080；

（17）. TOMCAT，默认的端口号为8080；

（18）. WIN2003远程登陆，默认的端口号为3389；

（19）. Symantec AV/Filter for MSE ,默认端口号为 8081；

（20）. Oracle 数据库，默认的端口号为1521；

（21）. ORACLE EMCTL，默认的端口号为1158；

（22）. Oracle XDB（ XML 数据库），默认的端口号为8080；

（23）. Oracle XDB FTP服务，默认的端口号为2100；

（24）. MS SQL*SERVER数据库server，默认的端口号为1433/tcp 1433/udp；

（25）. MS SQL*SERVER数据库monitor，默认的端口号为1434/tcp 1434/udp；

（26）. QQ，默认的端口号为1080/udp

【VUE】模仿去哪儿app源码

Posted on 2019-05-08 |

使用Vue CLI构建

下载地址：https://github.com/lgengbo/whereapp

下载后进行依赖安装
npm install

启动
npm run dev

打包
npm run build

实现效果

【JS】日期时间格式化

Posted on 2019-05-08 |

时间格式化yyyy-MM-dd HH:mm:ss 与 yyyy-MM-dd

获取当前时间函数

1
2
3

function mounthShort() {
  return new Date();
};

时间格式化函数

function dateFormate(dateTime, timeflag) {
    const date = new Date(Date.parse(dateTime));
    const y = date.getFullYear();
    let m = date.getMonth() + 1;
    m = m < 10 ? (`0${m}`) : m;
    let d = date.getDate();
    d = d < 10 ? (`0${d}`) : d;
    let h = date.getHours();
    h = h < 10 ? (`0${h}`) : h;
    let minute = date.getMinutes();
    minute = minute < 10 ? (`0${minute}`) : minute;
    let seconds = date.getSeconds();
    seconds = seconds < 10 ? (`0${seconds}`) : seconds;
    let result = '';
    if (timeflag) {
      result = `${y}-${m}-${d} ${h}:${minute}:${seconds}`;
    } else {
      result = `${y}-${m}-${d}`;
    }
    return result;
  };

调用并格式化

var time = mounthShort(); // 返回的值 Wed May 08 2019 09:46:57 GMT+0800 (中国标准时间)
var timeFormat = dateFormate(time,true); // 格式 yyyy-MM-dd HH:mm:ss
var timeFormats = dateFormate(time,false); // 格式 yyyy-MM-dd
console.log(timeFormat); // 2019-05-08 09:46:57
console.log(timeFormats); // 2019-05-08

完整代码

function mounthShort() {
  return new Date();
};

function dateFormate(dateTime, timeflag) {
    const date = new Date(Date.parse(dateTime));
    const y = date.getFullYear();
    let m = date.getMonth() + 1;
    m = m < 10 ? (`0${m}`) : m;
    let d = date.getDate();
    d = d < 10 ? (`0${d}`) : d;
    let h = date.getHours();
    h = h < 10 ? (`0${h}`) : h;
    let minute = date.getMinutes();
    minute = minute < 10 ? (`0${minute}`) : minute;
    let seconds = date.getSeconds();
    seconds = seconds < 10 ? (`0${seconds}`) : seconds;
    let result = '';
    if (timeflag) {
      result = `${y}-${m}-${d} ${h}:${minute}:${seconds}`;
    } else {
      result = `${y}-${m}-${d}`;
    }
    return result;
  };

var time = mounthShort(); // 返回的值 Wed May 08 2019 09:46:57 GMT+0800 (中国标准时间)
var timeFormat = dateFormate(time,true); // 格式 yyyy-MM-dd HH:mm:ss
var timeFormats = dateFormate(time,false); // 格式 yyyy-MM-dd
console.log(timeFormat); // 2019-05-08 09:46:57
console.log(timeFormats); // 2019-05-08

【JS】时间格式化

Posted on 2019-05-08 |

时间格式化yyyy-MM-dd HH:mm:ss 与 yyyy-MM-dd

获取当前时间函数

1
2
3

function mounthShort() {
  return new Date();
};

时间格式化函数

function dateFormate(dateTime, timeflag) {
    const date = new Date(Date.parse(dateTime));
    const y = date.getFullYear();
    let m = date.getMonth() + 1;
    m = m < 10 ? (`0${m}`) : m;
    let d = date.getDate();
    d = d < 10 ? (`0${d}`) : d;
    let h = date.getHours();
    h = h < 10 ? (`0${h}`) : h;
    let minute = date.getMinutes();
    minute = minute < 10 ? (`0${minute}`) : minute;
    let seconds = date.getSeconds();
    seconds = seconds < 10 ? (`0${seconds}`) : seconds;
    let result = '';
    if (timeflag) {
      result = `${y}-${m}-${d} ${h}:${minute}:${seconds}`;
    } else {
      result = `${y}-${m}-${d}`;
    }
    return result;
  };

调用并格式化

var time = mounthShort(); // 返回的值 Wed May 08 2019 09:46:57 GMT+0800 (中国标准时间)
var timeFormat = dateFormate(time,true); // 格式 yyyy-MM-dd HH:mm:ss
var timeFormats = dateFormate(time,false); // 格式 yyyy-MM-dd
console.log(timeFormat); // 2019-05-08 09:46:57
console.log(timeFormats); // 2019-05-08

完整代码

function mounthShort() {
  return new Date();
};

function dateFormate(dateTime, timeflag) {
    const date = new Date(Date.parse(dateTime));
    const y = date.getFullYear();
    let m = date.getMonth() + 1;
    m = m < 10 ? (`0${m}`) : m;
    let d = date.getDate();
    d = d < 10 ? (`0${d}`) : d;
    let h = date.getHours();
    h = h < 10 ? (`0${h}`) : h;
    let minute = date.getMinutes();
    minute = minute < 10 ? (`0${minute}`) : minute;
    let seconds = date.getSeconds();
    seconds = seconds < 10 ? (`0${seconds}`) : seconds;
    let result = '';
    if (timeflag) {
      result = `${y}-${m}-${d} ${h}:${minute}:${seconds}`;
    } else {
      result = `${y}-${m}-${d}`;
    }
    return result;
  };

var time = mounthShort(); // 返回的值 Wed May 08 2019 09:46:57 GMT+0800 (中国标准时间)
var timeFormat = dateFormate(time,true); // 格式 yyyy-MM-dd HH:mm:ss
var timeFormats = dateFormate(time,false); // 格式 yyyy-MM-dd
console.log(timeFormat); // 2019-05-08 09:46:57
console.log(timeFormats); // 2019-05-08

【HTML】Html引用公用的JS、CSS文件

Posted on 2019-05-07 |

在实际过程中，尝尝会遇到一大堆外部的js和css文件，有经验的人会将其分类，分门别类的引入各页面中，但是相对于初学者或者没有良好的代码规范的人会时常将其弄的乱七八糟，比如这样

1
2
3

<script src="js/test1.js"></script>
<script src="js/test2.js"></script>
<script src="js/test3.js"></script>

如何让一些常用的js封装成只引入一个js文件呢，其实很简单，新建一个commonJs.js文件，然后在里面引入公共的外部js文件

1
2
3

document.write('<script src="js/test1.js"></script>');
document.write('<script src="js/test2.js"></script>');
document.write('<script src="js/test3.js"></script>');

这样咱们就算是提取出了公共的外部文件，然后再在每个页面引入这这个js文件即可

1	<script src="js/commonJs.js"></script>

那么有人会问了，居然js可以做到，那么css文件呢。其实也是可以的。一样新建一个commonCss.js文件，然后在里面引入公共的外部css文件

1
2
3

document.write('<script src="css/test1.css"></script>');
document.write('<script src="css/test2.css"></script>');
document.write('<script src="css/test3.css"></script>');

这样咱们就算是提取出了公共的外部文件，然后再在每个页面引入这这个js文件即可

1	<script src="css/commonCss.js"></script>

【HTML】html input file accept上传文件限制文件类型

Posted on 2019-05-06 |

html input file accept,上传文件限制文件类型

在上传文件的时候，需要限制指定的文件类型。

1	<input type="file" accept="image/*" />

accept表示可以上传文件类型，image表示图片，*表示所有支持的格式。

application/envoy   					evy
application/fractals    				fif
application/futuresplash    			spl
application/hta 						hta
application/internet-property-stream    acx
application/mac-binhex40    			hqx
application/msword  					doc
application/msword  					dot
application/octet-stream    			*
application/octet-stream    			bin
application/octet-stream    			class
application/octet-stream    			dms
application/octet-stream    			exe
application/octet-stream    			lha
application/octet-stream    			lzh
application/oda 						oda
application/olescript   				axs
application/pdf 						pdf
application/pics-rules  				prf
application/pkcs10  					p10
application/pkix-crl   	 				crl
application/postscript  				ai
application/postscript  				eps
application/postscript  				ps
application/rtf 						rtf
application/set-payment-initiation  	setpay
application/set-registration-initiation setreg
application/vnd.ms-excel    			xla
application/vnd.ms-excel    			xlc
application/vnd.ms-excel    			xlm
application/vnd.ms-excel    			xls
application/vnd.ms-excel    			xlt
application/vnd.ms-excel    			xlw
application/vnd.ms-outlook  			msg
application/vnd.ms-pkicertstore 		sst
application/vnd.ms-pkiseccat    		cat
application/vnd.ms-pkistl   			stl
application/vnd.ms-powerpoint   		pot
application/vnd.ms-powerpoint   		pps
application/vnd.ms-powerpoint   		ppt
application/vnd.ms-project  			mpp
application/vnd.ms-works    			wcm
application/vnd.ms-works    			wdb
application/vnd.ms-works    			wks
application/vnd.ms-works    			wps
application/winhlp  					hlp
application/x-bcpio 					bcpio
application/x-cdf   					cdf
application/x-compress  				z
application/x-compressed    			tgz
application/x-cpio  					cpio
application/x-csh   					csh
application/x-director  				dcr
application/x-director  				dir
application/x-director  				dxr
application/x-dvi   					dvi
application/x-gtar  					gtar
application/x-gzip  					gz
application/x-hdf   					hdf
application/x-internet-signup   		ins
application/x-internet-signup   		isp
application/x-iphone    				iii
application/x-javascript    			js
application/x-latex 					latex
application/x-msaccess  				mdb
application/x-mscardfile    			crd
application/x-msclip    				clp
application/x-msdownload    			dll
application/x-msmediaview   			m13
application/x-msmediaview   			m14
application/x-msmediaview   			mvb
application/x-msmetafile    			wmf
application/x-msmoney   				mny
application/x-mspublisher   			pub
application/x-msschedule    			scd
application/x-msterminal    			trm
application/x-mswrite   				wri
application/x-netcdf    				cdf
application/x-netcdf    				nc
application/x-perfmon   				pma
application/x-perfmon   				pmc
application/x-perfmon   				pml
application/x-perfmon   				pmr
application/x-perfmon   				pmw
application/x-pkcs12    				p12
application/x-pkcs12    				pfx
application/x-pkcs7-certificates    	p7b
application/x-pkcs7-certificates    	spc
application/x-pkcs7-certreqresp 		p7r
application/x-pkcs7-mime    			p7c
application/x-pkcs7-mime    			p7m
application/x-pkcs7-signature   		p7s
application/x-sh    					sh
application/x-shar  					shar
application/x-shockwave-flash   		swf
application/x-stuffit   				sit
application/x-sv4cpio   				sv4cpio
application/x-sv4crc    				sv4crc
application/x-tar   					tar
application/x-tcl   					tcl
application/x-tex   					tex
application/x-texinfo   				texi
application/x-texinfo   				texinfo
application/x-troff 					roff
application/x-troff 					t
application/x-troff 					tr
application/x-troff-man 				man
application/x-troff-me  				me
application/x-troff-ms  				ms
application/x-ustar 					ustar
application/x-wais-source   			src
application/x-x509-ca-cert  			cer
application/x-x509-ca-cert  			crt
application/x-x509-ca-cert  			der
application/ynd.ms-pkipko   			pko
application/zip 						zip
audio/basic 							au
audio/basic 							snd
audio/mid   							mid
audio/mid   							rmi
audio/mpeg  							mp3
audio/x-aiff    						aif
audio/x-aiff    						aifc
audio/x-aiff    						aiff
audio/x-mpegurl 						m3u
audio/x-pn-realaudio    				ra
audio/x-pn-realaudio    				ram
audio/x-wav 							wav
image/bmp   							bmp
image/cis-cod   						cod
image/gif   							gif
image/ief   							ief
image/jpeg  							jpe
image/jpeg  							jpeg
image/jpeg  							jpg
image/pipeg 							jfif
image/svg+xml   						svg
image/tiff  							tif
image/tiff  							tiff
image/x-cmu-raster  					ras
image/x-cmx 							cmx
image/x-icon    						ico
image/x-portable-anymap 				pnm
image/x-portable-bitmap 				pbm
image/x-portable-graymap    			pgm
image/x-portable-pixmap 				ppm
image/x-rgb 							rgb
image/x-xbitmap 						xbm
image/x-xpixmap 						xpm
image/x-xwindowdump 					xwd
message/rfc822  						mht
message/rfc822  						mhtml
message/rfc822  						nws
text/css    							css
text/h323   							323
text/html   							htm
text/html   							html
text/html   							stm
text/iuls   							uls
text/plain  							bas
text/plain  							c
text/plain  							h
text/plain  							txt
text/richtext   						rtx
text/scriptlet  						sct
text/tab-separated-values   			tsv
text/webviewhtml    					htt
text/x-component    					htc
text/x-setext   						etx
text/x-vcard    						vcf
video/mpeg  							mp2
video/mpeg  							mpa
video/mpeg  							mpe
video/mpeg  							mpeg
video/mpeg  							mpg
video/mpeg  							mpv2
video/quicktime 						mov
video/quicktime 						qt
video/x-la-asf  						lsf
video/x-la-asf  						lsx
video/x-ms-asf  						asf
video/x-ms-asf  						asr
video/x-ms-asf  						asx
video/x-msvideo 						avi
video/x-sgi-movie   					movie
x-world/x-vrml  						flr
x-world/x-vrml  						vrml
x-world/x-vrml  						wrl
x-world/x-vrml  						wrz
x-world/x-vrml  						xaf
x-world/x-vrml  						xof

【VUE】iview的datetimerange的验证

Posted on 2019-05-06 |

iview 的DatePicker 为 datetimerange 的验证问题

<FormItem label="查询时间段" prop="startEndTime">
	<DatePicker
              type="datetimerange"
              placement="bottom-end" 
              v-model="exportData.startEndTime" 
              placeholder="查询时间段"
              :options="dateOptions"
              class="item last">
            </DatePicker>
</FormItem>

data里的数据

data() {
    return {
        exportData: {
                startEndTime: [], // 查询时间
        },
        dateOptions: {
           disabledDate (date) {
             return date && date.valueOf() < Date.now() - 86400000;
           }
         },
        startEndTime: [{ // 验证
             required: true, 
             type: 'array', 
             message: '查询时间段', 
             trigger: 'change',
             fields: {
               0: { type: "date", required: true, message: "查询时间段" },
               1: { type: "date", required: true, message: "查询时间段" }
             }
        }],
    }
}

起始

Posted on 2019-05-02 | In 默认分类 |

附加一段文章摘要