霜月枫桥-CSDN博客

原创 vue文本字段匹配高亮组件

### 功能介绍> 实现了一个句子根据查询字词进行高亮显示的功能，查询的字词的输入格式为数组（为了> 兼容分词查询功能），根据字词数组的内容进行多个词的高亮展示。使用模板差值 {{ }} 和> v-text，而不是v-html进行高亮字词的展示，减少XSS攻击的风险### 下载插件```npm install v-highlight-component```### 在线演示> [示例](https://mooncom.github.io/v-highlight-

2021-01-08 10:42:40 1606 6

转载 JS禁止用户对页面文档进行操作

常用方法如下：禁止鼠标右键：oncontextmenu="return false"；禁止选择：onselectstart="return false"；禁止拖放：ondragstart="return false"；禁止拷贝：oncopy=document.selection.empty() 。禁止复制：oncopy = "return false"；禁止保存：，放在he

2018-01-25 14:44:18 2133

转载 JS中document对象和window对象的区别

简单来说，document是window的一个对象属性。Window 对象表示浏览器中打开的窗口。如果文档包含框架（frame 或 iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。所有的全局函数和对象都属于Window 对象的属性和方法。document 对 Document 对象的只读引用。[windo

2017-03-30 16:56:39 1753

转载 javaScript document对象详解

Document对象内容集合document 文挡对象 - JavaScript脚本语言描述———————————————————————注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写否则会提示你一个错误信息 “引用的元素为空或者不是对象\\\\\”———————————————————————对象属性document.titl

2017-03-16 16:13:51 539

原创 <input type="file">的accept属性值详解

accept可以限制文件的上传类型，比如只上传图片文件、视频文件、音频文件……如下audio/* 接受所有的声音文件。video/* 接受所有的视频文件。image/* 接受所有的图像文件。详细类型限制如下所示：*.3gpp audio/3gpp, video/3gpp 3GPP Audio/Video*.ac3 audio/ac3 AC3 Audio*.asf all

2017-02-20 15:38:44 8975

转载前台开发——256种颜色的图谱对应16进制数值总结

红色和粉红色，以及它们的16进制代码。#990033#CC6699#FF6699#FF3366#993366#CC0066#CC0033#FF0066#FF0033..#CC3399..#FF3399#FF9999#FF99CC#FF0099#CC3366

2016-11-22 16:33:03 7441

转载 Js获取当前日期时间及其它操作

var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份(4位,1970-????)myDate.getMonth(); //获取当前月份(0-11,0代表1月)myDate.getDate(); //获取当前日(1-31)

2016-11-11 10:46:17 436

转载 js中数组Array和字符串String的属性方法归纳总结

1、数组创建： new Array(5)-->创建有5个元素的数组； new Array()-->创建空数组； new Array("a","b","b")-->创建有3个元素，分别为abc的数组； []-->创建空数组； ["a","b","b"]-->创建有3个元素，分别为abc的数组；2、数组的方法：

2016-11-11 10:44:36 2291

转载 ajax属性详解

jquery中的ajax方法参数总是记不住，这里记录一下。 1.url: 要求为String类型的参数，（默认为当前页地址）发送请求的地址。2.type: 要求为String类型的参数，请求方式（post或get）默认为get。注意其他http请求方法，例如put和delete也可以使用，但仅部分浏览器支持。3.timeout: 要求为Number类型的

2016-09-01 19:41:08 9644 1

原创【桌游】微信小程序——线下桌游预约

这是21年开发的一套线下桌游体验店的预约小程序一、适用范围该小程序的适用范围为剧本杀、狼人杀、陪聊、陪玩（switch、手游、电影等游戏）体验店二、客户端该小程序分为三端，分别为管理端、助教端以及顾客端，以不同的身份登录会展示不同的界面，使用不同的功能1、管理端管理端具有最高权限，可以进行房间管理功能（房间定价、营业状态维护）、助教管理功能（助教考勤管理、助教等级管理、助教个人信息管理、助教奖罚等）、公告管理、助教动态管理、订单管理（订单的创建、删除，订单的开启、终止、结账功能）、充值管

2022-02-10 18:10:10 2229 1

原创使用html+js书写分页功能

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> ul,li{ .

2021-08-18 10:54:50 443

原创 Vue组件生命周期钩子和Vue-Router路由钩子的执行顺序

Vue组件生命周期钩子的执行顺序如下图所示链接：https://cn.vuejs.org/v2/guide/instance.html#%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F%E5%9B%BE%E7%A4%BA这里只列出了初始化时渲染的钩子，销毁、更新时的钩子不在本次讨论的范围之内。而在Vue-Router中，导航守卫的执行顺序如下所示链接：https://router.vuejs.org/zh/guide/advanced/navigation-.

2020-07-28 20:35:31 2406

原创 JDK1.7和JDK1.8环境相互切换时报错

环境：Windows 7 64位背景：最近有两个项目要开发，首先进行的项目环境为JDK1.7，开发工具为Eclipse；后一个项目环境为JDK1.8，开发工具为IDEA。因为开发后一个项目的同时，要解决前一个项目的维护工作，因此要不时切换JDK的版本，这里记录一下我碰到的问题，希望能帮到大家。JDK1.7升级到JDK1.8在配置环境变量时，除了要修改系统变量 JAVA_HOME 的路径以外，还要注...

2018-05-31 14:57:08 2243 1

转载 Webstorm的一些常用快捷键

下面是Webstorm的一些常用快捷键：1. ctrl + shift + n: 打开工程中的文件，目的是打开当前工程下任意目录的文件。2. ctrl + j: 输出模板3. ctrl + b: 跳到变量申明处4. ctrl + alt + T: 围绕包裹代码(包括zencoding的Wrap with Abbreviation)5. ctrl + []: 匹配 {}[]6. ctrl + F12...

2018-05-30 17:17:44 622

原创 JS中数组的复制和类数组转换为数组的方法

一、数组的复制1、使用concat()var arr1=[1,2,3];var arr2=arr1.concat();arr2.push(4);console.log('arr1的值为：'+arr1);console.log('arr2的值为：'+arr2);效果图如下所示2、使用slice()var arr1=[1,2,3];var arr2=arr1.slice();arr2.pu...

2018-05-16 11:17:22 605

原创 JS对象的继承

继承需要在某一个对象或者类的基础上，保留原有内容的同时，扩展出一些新东西一、对象的继承1、一个JSON对象，属性值只有JSON、数组、数字、字符串，没有函数。可以使用JSON.parse 和 JSON.stringify搭配实现对象的继承。var zhangsan={ x:10, y:20, z:30}var lisi=JSON.parse(JSON.stringify(zhangsa...

2018-05-11 10:38:41 417

原创 canvas使用注意点

1、canvas.arc();方法画圆时，最后一个参数默认为false，false为顺时针，当为true时，为顺时针如果想画一个1/4圆，需要结合lineTo()方法canvas.beginPath();canvas.arc(100,100,50,0,Math/2);canvas.lineTo(100,100);canvas.closePath();2、canvas.createPatter...

2018-05-08 15:16:44 765

原创 Head First设计模式读书随笔

一、第九页找出应用中可能需要变化之处，把它们独立出来，不要和那些不需要变化的代码混合在一起。//面向对象的特点之封装。将不需要变化的代码封装起来。二、第十一页针对接口编程【针对超类型（接口+抽象类）编程】，而不是针对实现编程。依赖于实现的表现：行为来自超类的具体实现，或是继承某个接口并由子类自行实现出来。//面向对象的特点之多态。声明接口，实现具体类。//可以实现动态运行。三、第二十三页多用组合，...

2018-05-04 14:41:08 236

原创前台开发总结14——20180504

一、元素定位后，只和定位的父级有关系，和自己的直接父级没有关系，假如定位子元素的width为100%，那么它的width取的为其定位父元素的width的100%二、获取事件对象及事件触发元素var ev=ev || window.event;var element=ev.target || ev.srcElement;三、IE8不支持window事件，可以使用document事件代替window...

2018-05-04 14:35:19 533

原创 MySQL知识点随笔

一、使用now()可以获取当前时间insert into tb_demo(Name,birthday,address) values('xyong',now(),'青岛');设置其他时间insert into tb_demo(Name,birthday,address) values('张三','2008-08-08 12:00:00','大连');二、create 1、创建表create t...

2018-04-28 17:16:13 310

原创 JS事件addEventListener、on、元素属性事件触发的先后顺序

三种事件触发方法都存在时示例代码如下：<div id="div1" onclick="ma()"> </div> <script> var oDiv1=document.getElementById("div1"); oDiv1.addEventListener("click",function(){ console.log(&quo

2018-04-27 16:11:40 5880

原创 Liferay主题配置Portlet组件默认无边框

创建主题工程，打开WEB-INF下的liferay-look-and-feel.xml文件，初始内容如下所示：<?xml version="1.0"?><!DOCTYPE look-and-feel PUBLIC "-//Liferay//DTD Look and Feel 6.2.0//EN" "http://www.liferay.com/dtd/liferay-look-...

2018-04-26 15:12:22 352

原创前台开发总结13——20180419

一、JS中使用数组的sort()可以对数组进行排序，Array.sirt();默认是按照递增的顺序排列的。若需要按递减的顺序排序，可以对sort进行重写cosole.log([4,7,2,9,1,6].sort(function(a,b){ return b-a;}));二、系统架构包含技术架构、功能架构、部署架构、数据架构。国内的系统架构中往往包含了功能架构。三、HTML中的某些元素会具有自...

2018-04-19 14:26:51 250

原创 Liferay进行Builder Service时，不刷新数据库中已存在的表

在使用Liferay进行组件开发时，需要创建Service Builder进行数据库交互。一、Service Builder下service.xml的书写格式<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE service-builder PUBLIC "-//Liferay//DTD Service Builder 6.2.0//...

2018-03-27 10:37:44 550

转载前端模块化，AMD与CMD的区别

最近在研究cmd和amd，在网上看到一篇不错的文章，整理下看看。在JavaScript发展初期就是为了实现简单的页面交互逻辑，寥寥数语即可；如今CPU、浏览器性能得到了极大的提升，很多页面逻辑迁移到了客户端（表单验证等），随着web2.0时代的到来，Ajax技术得到广泛应用，jQuery等前端库层出不穷，前端代码日益膨胀这时候JavaScript作为嵌入式的脚本语言的定位动摇了，JavaScri...

2018-03-08 16:46:40 241

转载深入浅出数据库索引原理

前段时间，公司一个新上线的网站出现页面响应速度缓慢的问题，一位负责这个项目的但并不是搞技术的妹子找到我，让我想办法提升网站的访问速度，因为已经有很多用户来投诉了。我第一反应觉的是数据库上的问题，假装思索了一下，摆着一副深沉炫酷的模样说：“是不是数据库查询上出问题了，给表加上索引吧”，然后妹子来了一句：“现在我们网站访问量太大，加索引有可能导致写入数据时性能下降，影响用户使用的”。当时我就楞了...

2018-03-06 14:36:12 253

原创 jsonp模拟百度搜索框

代码如下： Title *{ margin:0; padding:0; font-family:"Microsoft yahei",serif;} li{ list-style-type: none;} #box{

2018-02-07 10:06:24 795

原创修改CAS的MD5加密规范

2.4.1、背景本文使用的CAS版本为4.0.0 CAS服务和第三方进行对接，第三方使用的MD5加密规范为64位，而CAS的MD5加密规范为32位。因为第三方数据库中数据繁多，不便于进行修改。因此，需要修改CAS的加密规范为MD5 64位。2.4.2、操作2.4.2.1、获取cas-server-core -4.0.0.jar 打开CAS的Linu

2018-01-29 15:24:02 1750

原创 Linux配置CAS4.0.0单点登录服务

下载CAS 从GitHub上下载cas-server-4.0.0-release.zip，如图2.1.1红框中所示，地址为：https://github.com/apereo/cas/releases/tag/v4.0.0。图2.1.1发布CAS 解压下载好的cas压缩文件，将cas-server-4.0.0\cas-server-4.0.0\modules下

2018-01-29 15:07:53 2381

原创 HTML demo之可调整的盒子

代码如下： HTML demo之可调整的盒子 #div{ position: absolute; box-sizing: border-box; height: 200px; width: 200px; background-color: orange; top: 200px; left: 300px; padding: 10p

2018-01-25 18:03:29 507

原创 HTML 添加数据信息

代码如下： Title *{ margin:0; padding:0; font-family:"Microsoft yahei",serif;} li{ list-style-type: none;} html,body{

2018-01-19 10:39:41 5044

原创 -webkit-mask实现爱心遮罩效果

代码如下：爱心遮罩效果 *{margin:0;padding:0;} ul,ol{list-style:none;} a{text-decoration:none;} .box{ position:fixed; width:100%; height:100%; background:url("images/03.jpg");

2018-01-17 17:11:24 1942

原创 HTML旋转的太极图

代码如下：旋转的太极图 body{ margin: 0px; background-color: #ccc; } html,body{ height: 100%; } @keyframes ani{ 100%{ transform: rotate(360deg); } } .content{ position: fixed;

2018-01-17 11:06:56 2791

原创 CAS4.0.0链接Redis4.0.6

前言最近，部门要求为原有CAS服务配置redis，将CAS的TGT存储到Redis中，从而提高CAS服务的性能。我上网查询了许多资料，却因为创建JedisPool时出现的BUG，而纠结痛苦了好长时间。己所不欲，勿施于人，我节选了CAS配置文档中，关于链接Redis的部分，分享出来，希望能帮助大家。2.5.1、版本信息CAS服务器版本为4.0.0Redis数据库版本为4.0.

2018-01-16 17:22:05 1076

原创 JS获取随机颜色（3种方法）

一共三种方法，代码如下： /*---------------------------- 方法一 -------------------------*/ var colorArr=['0','1','2','3','4','5','6','7','8','9','a','b','c','d','e','f']; function random(min,max){ if(i

2018-01-10 14:17:39 15492 1

转载将HTMLCollection/NodeList/伪数组转换成数组

这里把符合以下条件的对象称为伪数组（ArrayLike）1，具有length属性2，按索引方式存储数据3，不具有数组的push,pop等方法例如：1，function内的arguments 。2，通过document.forms，Form.elements，document.styleSheets, Select.options，document.getElements

2018-01-10 10:50:14 1248

转载 CAS框架配置详解

一、概述单点登录（Single Sign On , 简称 SSO ）是目前比较流行的服务于企业业务整合的解决方案之一， SSO 使得在多个应用系统中，用户只需要登录一次就可以访问所有相互信任的应用系统。CAS(Central Authentication Service)是一款不错的针对 Web 应用的单点登录框架，本文介绍了 CAS 的原理、协议、在 Tomcat 中的配置和使用，对于采

2018-01-09 15:46:22 2197

原创使用Gradle将CAS源码转为为eclipse工程详解

一、下载安装gradle构建工具网上有很多配置文档，请自行百度。二、下载CAS源码我这里的CAS版本为cas4.2.7，源码地址为https://github.com/apereo/cas/tree/v4.2.7页面如下，点击截图右下角 Clone and download按钮进行下载三、将CAS源码转换成eclipse工程1、原因：将CAS源码转换成eclipse工程后，可以拓展CAS的...

2017-12-26 15:14:43 3244

原创 HTML黑客帝国数据瀑布流

代码如下：黑客帝国数据瀑布 body{ margin:0px; } #canvas{ display:block; } var maxHeight=0; var maxWidth=0; var canvas=null; var arrMess=new Array(256).fill(1); function $_id(id){ r

2017-12-14 11:19:22 3621 1

原创缓存+懒加载实现瀑布流效果

页面代码：最佳影片TOP200推送 body{ margin:0px; background-color: #368; } div#content { position:relative; margin: 20px auto; } figure.movie { box-shadow: 1px 1px 1em #ddd;

2017-12-11 17:20:07 1634