前端开发
文章平均质量分 95
web 开发是常青藤
Cao Lilu
浮生若梦,岁月流金
展开
-
https 是如何保护数据传输的
为什么需要 httpshttps 是 http + ssl,也就是加密的 http 数据传输。我们都知道 https 的最主要的作用在于保证数据的安全,但具体来说,https 的安全性主要体现在以下两点:保证数据传输不被中间人盗用和信息的泄漏。保证数据内容不被劫持、篡改。针对上面两点,https 的保护策略如下:对传输内容进行加密对请求进行身份验证对称加密和非对称加密对称加密只有一个密钥,同时用来进行加密和解密。非对称加密有一对密钥,分别是公钥和私钥。公钥加密,私钥解密。原创 2022-05-10 09:45:37 · 2608 阅读 · 0 评论 -
ESLint 和 Prettier 工程化前端代码
大浪淘沙,前段构架工具也在一代代的更迭,最终脱颖而出的是 Prettier 和 ESLint。很多人说这两个有很多重复功能,但其实这两个工具的侧重点是不一样的:Prettier 注重的是代码的格式化,也就是让团队有一个统一的代码规范。ESLint 注重的则更多是代码的质量,保证的是代码的安全性。这一点在 Prettier 的官网上有很好的说明:参考链接:https://prettier.io/docs/en/comparison.htmlLinters have two categories原创 2022-03-27 21:55:29 · 2182 阅读 · 1 评论 -
HTTP 下的前后端交互
互联网上半场的打法可以说是营销和资本驱动(你在选择安装哪个APP)。而互联网的下半场是数据和技术在驱动(你在选择卸载哪个APP)。HTTP 版本对比HTTP 版本的演化到现在为止一种经历了四个版本,分别是 HTTP/0.9,HTTP/1.0,HTTP/1.1 和 HTTP/2.0。现在使用最广泛的仍然是 1.1 版本,但是 2.0 版本也慢慢的被各个网站接纳和使用。下面分别介绍上面几个版本的区别。1991年 HTTP/0.9仅支持 GET 请求,不支持请求头1996年 HTTP/1.0默原创 2021-08-26 20:14:09 · 490 阅读 · 0 评论 -
require.js的使用
简介: 是一个JavaScript模块加载器,它非常适合在浏览器中使用,但它也可以用在其他脚本环境,使用RequireJS加载模块化脚本将提高代码的加载速度和质量。 它使用了不同于传统标签的脚本加载步骤,鼓励在使用脚本时以module ID替代URL地址。RequireJS 优点:1.防止js加载阻塞页面渲染2.使用程序调用的方式加载JS,防止批量丑陋方式加载JS原创 2015-09-21 21:38:30 · 453 阅读 · 0 评论 -
HTML5笔记
1、浏览器选择IE9+,FireFox 3.5+,Chrome 3.0+,Safari 3.0+,Opera 10.5+。2、html的好处1、向下兼容 对于XHTML2.0要求遵循规则,否则不予显示的方式,HTML5却实行“不破坏Web”的原则。也就是说,以往已存在的Web页面,还可以保持正确的显示。当然,面对开发者,HTML5规范要求屏蔽过去那些编码坏习惯和废气的标签...原创 2015-11-15 11:29:15 · 845 阅读 · 0 评论 -
HTML table使用详解
对于table来说,在一些小的模块中进行表格布局是非常好用的。我们可以这样来理解table,主要分成table部分和td部分。 table部分:主要是来控制外边框的(就是最外面一层边框,不包括里面部分),它拥有的属性为:margin属性,border属性,cellspacing属性,规定单元格之间的空白cellpadding属性,规定单元边沿与其内容之间的空白。...原创 2015-02-01 10:55:16 · 15911 阅读 · 0 评论 -
js常用内置方法和对象
JS内置函数不从属于任何对象,在JS语句的任何地方都可以直接使用这些函数。JS中常用的内置函数如下: 1、eval(str)接收一个字符串形式的表达式,并试图求出表达式的值。作为参数的表达式可以采用任何合法的操作符和常数。如果参数中包含JS命令,这些命令也可以被执行,就像这些命令是JS程序的一部分一样。 2、parseInt(str,n)试图从一个字符串中提取一个整转载 2015-03-20 11:22:13 · 1857 阅读 · 0 评论 -
基于jquery.cxscroll的无缝滚动
版本:jQuery v1.4.4+jQuery cxScroll v1.2.1注意事项:内部会自动创建 prev 及 next 切换按钮,也可以在外部直接创建,若外部已创建或设置prevBtn: false及nextBtn: false,内部将跳过此步骤;若(滚动的列表宽度 ≤ 父元素的宽度),则不会自动创建 prev 及 next 切换按钮,也不会自动滚动;鼠标移动到滚动元素上时,会暂停转载 2015-05-04 19:49:56 · 2799 阅读 · 0 评论 -
js集合操作(简)
html页面中,如果涉及到多数据的提交,利用JS中的数组对象,可以实现类似于java语言中List等集合对象的功能,这将大大增加页面于后台交互的能力。Array对象有许多基础方法,例如:push(增加),join(转化为字符串、以逗号分隔),sort(排序),但是没有提供删除方法,这里需要自己实现。Array.prototype.remove=function(dx){ if(转载 2015-05-23 11:11:56 · 3193 阅读 · 0 评论 -
Ajax和JSON笔记
1、JSON说明json对象是用冒号(而不是等号)来赋值的。每一条赋值语句都用逗号分开。整个对象用大括号封装起来。当然,也可以用大括号分级嵌套数据。JSON对象描述中存储的数据可以是字符串,数字或者布尔值。对象描述也可以存储函数,那就是对象的方法。【实例】 var jsonObject = { 'name':'clown', 'age':18, 'address':{'原创 2015-02-08 21:47:41 · 572 阅读 · 2 评论 -
jquery学习笔记
一、jquery简介为了简化JavaScript 的开发, 一些 JavsScript 库诞生了. JavaScript 库封装了很多预定义的对象和实用函数。能帮助使用者建立有高难度交互的 Web2.0 特性的富客户端页面, 并且兼容各大浏览器当前流行的JavaScript 库有: 见图。二、jquery对象和DOM对象jQuery 对象就是通过 $() 包装 DOM 对象后产原创 2015-02-03 11:52:59 · 412 阅读 · 0 评论 -
word-break同word-wrap区别
word-break:normal | break-all | keep-allnormal 该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本。break-all 该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本keep-all 与所有非亚洲语言的normal相同...转载 2015-02-20 20:46:59 · 381 阅读 · 0 评论 -
JS中定义对象的几种方式
JavaScript中没有类的概念,只有对象。 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工厂方式 3.构造函数方式 4.原型(“prototype”)方式 5.动态原型方式 一.基于已有对象扩充其属性和方法var object = new Object();ob转载 2015-05-25 17:49:23 · 822 阅读 · 0 评论 -
页面布局技巧&&js相关知识点&&乱七八糟
1、frameset的使用 基本使用:<frameset frameborder="no" framespacing="0" rows="160px,*,205px" /> <frame name="top" noresize="noresize" scrolling="no" src="top.html"&am原创 2014-12-25 11:32:16 · 1913 阅读 · 0 评论 -
js的Date应用
在js的内置对象中有Date对象,我们可以通过var date = new Date();的方法来实例化这个对象。如果我们想在内置对象中添加自己的特有方法,我们可以通过prototype(原型)来添加自己特有的方法,代码及其应用如下:// 实例化Date对象var DateUtil = new Date();// 默认输出格式为:Fri Apr 03 2015 08:41:15 GMT+转载 2015-04-03 08:51:53 · 306 阅读 · 0 评论 -
javascript DOM笔记
1、第一个DOM程序【实例】window.onload = function(){ var btn = document.getElementsByTagName("button")[0]; btn.onclick = function(){ alert("Hellow!!!"); }}2、获取元素的节点document.getElementById();根原创 2015-01-30 10:34:58 · 414 阅读 · 0 评论 -
(document)与$(window)的几个常用属性辨析
主要讨论一下几个属性:$(window).width()$(window).height()$(window).scrollTop()$(window).scrollLeft()$(window).height()代表了当前可见区域的大小,而$(document).height()则代表了整个文档的高度,可视具体情况使用。注意:当浏览器窗口大小改变时(如最大化或拉大窗口原创 2015-01-15 22:36:53 · 559 阅读 · 0 评论 -
基于jquery的可移动dialog 和 页面遮盖层
jquery的版本是1.xHTML代码为:moveDialog .win{ width:300px; height:300px; background:#658CCD; position:absolute; left:0; top:0; display:none; } .wTop{ height:30px; width:100%;原创 2014-12-28 20:40:38 · 3028 阅读 · 0 评论 -
js UUID
/*!Math.uuid.js (v1.4)http://www.broofa.commailto:robert@broofa.com Copyright (c) 2010 Robert KiefferDual licensed under the MIT and GPL licenses.*/ /* * Generate a random uuid. * * USAGE:转载 2015-05-30 08:20:28 · 1795 阅读 · 0 评论 -
上下无缝滚动(应用高级盒子模型)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><me转载 2015-07-07 10:23:26 · 611 阅读 · 0 评论 -
jquery写的自动增加行
js代码为:// JavaScript Documentvar addCertifyinfo;var addCertifyinfoFlag = true;addCertifyinfo += '';addCertifyinfo += ' * 姓名:';addCertifyinfo += '';addCertifyinfo += ' * 出生年月:';addCertifyi原创 2014-12-12 09:01:22 · 692 阅读 · 0 评论 -
html+css的高级盒子模型
overflow:scroll;这个属性应该注意,加上这个属性后,元素出现滚动条,但是其真正的宽和高不会增加,但是会占用width和heigth的空间,也就是说如果出现滚动条,这个时候元素的width和heigth的值为滚动条的宽度加上现在的width或heigth。scrollTop这个属性需要当前元素的内容要比当前元素的高度高,当滚动条向下滚动的时候,滚动上去的那部分,即看不见了的那部分为...原创 2015-06-25 16:45:04 · 619 阅读 · 0 评论 -
WEB应用开发该选择什么图片格式?
从某种程度上说,判断一个网页设计师是否优秀,可以从其在WEB开发(或网页设计)中是否合理的采用各种图片格式得出结论。事实上,或许所有人都知道图片存在GIF,JPG和PNG等格式,但并非所有人都知道它们之间的具体区别和使用技巧。1.JPEG?JPEG格式是一种大小与质量相平衡的压缩图片格式。通俗一点讲,就是:高的压缩比=低的图片质量=小的文件大小。反之,低的压缩比=高的图片质量=大的文件大小。由...转载 2015-01-17 11:06:49 · 584 阅读 · 0 评论 -
写web前端的准备工作
1、文档头 一个良好的文档必须有一个文档头: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">这是用DreamWeaver cs6版本创建html页面出现的文档头。 ...原创 2014-12-13 10:38:17 · 729 阅读 · 0 评论 -
一个基于jquery的TreeMenu和下拉式Menu菜单,代码很简单
jquery用的1.x版本。HTML代码为:TreeMenu.menu{ width:100px; height:25px; border:1px solid #000; cursor: pointer;}ul{ width:100px; border:1px solid #900; display:none;} 菜单一原创 2014-12-22 14:35:49 · 7805 阅读 · 0 评论 -
HTML select ,radio的使用,checkbox全选
1、HTML select 的使用注:所有的操作都是基于jquery的【例子】 Volvo Saab Fiat Audi 1.1 取值$("#cars").val(); $("#cars option:selected").val(); $("#cars").find("option:selected").val(); // 以上三句代码都是选择selec原创 2015-01-11 21:37:52 · 870 阅读 · 0 评论 -
jquery中bind和live的区别
Jquery中绑定事件有三种方法:以click事件为例 (1)target.click(function(){}); (2)target.bind("click",function(){}); (3)target.live("click",function(){});第一种方法很好理解,其实就和普通JS的用法差不多,只是少了一个on而已。第二、三种方法都是绑定事件,但是转载 2015-01-14 10:33:36 · 393 阅读 · 0 评论 -
浏览器模式和文档模式的区别(转载后加注释)
只有IE浏览器中才会有“浏览器模式”和“文档模式”,兼容性视图涉及两个重要的功能便是“浏览器模式【browser mode】”和“文档模式【document mode】”,在IE8/IE9中按F12键,打开“开发人员工具”,在菜单栏中可以看到“浏览器模式”和“文档模式”的切换菜单,其中可以选择切换到IE7/8等不同的网页模式。这个设置之后在js中可以通过navigator.userAgen...转载 2015-04-01 09:11:38 · 501 阅读 · 0 评论 -
jQuery操作cookie
Cookies是一种能够让网站服务器把少量数据储存到客户端的硬盘或内存,或是从客户端的硬盘读取数据的一种技术当你浏览某网站时,你硬盘上会生产一个非常小的文本文件,它可以记录你的用户ID、密码、浏览过的网页、停留的时间等信息。当你再次来到该网站时,网站通过读取Cookies,得知你的相关信息,就可以做出相应的动作,如在页面显示欢迎你的标语,或者让你不用输入ID、密码就直接登录等等。从本质上讲,它原创 2015-06-04 15:12:14 · 523 阅读 · 0 评论 -
基于jquery的鼠标滑动详细显示框
jquery版本是1.xHTML代码为:detialDiaLog.detial{ width:100px; height:100px; border:1px solid #000; position:relative; cursor: pointer;}.detialHide{ display:none; position:absolute; top:0原创 2014-12-30 10:54:15 · 553 阅读 · 0 评论 -
Spring集成Ibatis详细介绍
Spring集成Ibatis 对于spring集成ibatis,主要用到spring提供的一个重要的类“org.springframework.orm.ibatis.SqlMapClientFactoryBean”。这个类是两者集成的接口。本来在ibatis中要配置的数据源,事物管理现在都交给spring来做就可以了。 以下是两者集成的图示:具体结构图如下:原创 2015-03-31 22:08:34 · 1810 阅读 · 2 评论 -
eclipse配置tomcat的两种方式
第一种、新建server服务器方法第一步:File --> New --> Other 选择Server第二步: 选择对应的Tomcat服务器后点击下一步。第三步: 指定Tomcat的安装所在根文件夹的目录。点击完成即可。第四步: 之后我们可以看见Servers对话框中有了对应的服务器,就可以使用了。 第原创 2015-02-15 21:19:04 · 525 阅读 · 0 评论 -
一些java笔记和Tomcat体系结构的知识
第一章、java的一些知识1、什么是API API(Application Programming Interface)。应用程序编程接口,是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。另外,它里面提供的函数其实就是system call。2、POSIX规范。 POS原创 2015-01-02 14:45:27 · 568 阅读 · 1 评论 -
<%@ INCLUDE FILE=""%>与<JSP:INCLUDE PAGE=""/>区别
我们都知道在jsp中include有两种形式,分别是Include指令:和include动作: 前者是指令元素、后者是行为元素。具体它们将在何处用?如何用及它们有什么区别?这应该是很多人看到它都会想到的问题。下面一起来看看吧。 通常当应用程序中所有的页面的某些部分(例如标题、页脚和导航栏)都相同的时候,我们就可以考虑用include。具体在哪些时候用,哪些时候用。这种形式。转载 2015-01-18 16:53:44 · 362 阅读 · 0 评论 -
JSP指令详解
JSP指令指令作用:控制这个页面产生的 Servlet 的整体结构指令一般形式:指令类别:一、page指令:作用:指示页面相关的信息。说明:在一个 JSP 页面中,page 指令可以出现多次,但是每一种属性却只能出现一次,重复的属性设置将覆盖掉先前的设置,但其中的 import 属性是一个例外,可以有多个导入操作。基本语法格式:各属性的说明如下表所示:原创 2015-01-18 16:54:46 · 772 阅读 · 0 评论 -
Web开发中的四个域对象(范围由小到大)
简介:page(jsp有效) request(一次请求) session(一次会话)application(当前web应用)page域指的是pageContext.request域指的是requestHttpServletRequestsession 域指的是 sessionHTTPSessionapplication 域指的是 applicationServletConte转载 2014-12-19 08:58:10 · 4248 阅读 · 0 评论 -
ckeditor和ckfinder集成详细配置及其优化
1、下载文件目录结构分析ckeditor和ckfinder的下载网址分别是:ckeditor:http://ckeditor.com/ckfinder:http://cksource.com/ckfinder下载下来后的目录结构:ckeditor:精简:1.samples文件夹,这是示例文件,可删除;2.adapters文件夹,这个应该是和第三方的东西配原创 2015-04-19 11:30:26 · 23740 阅读 · 2 评论 -
★★★Struts2常用配置项,配置属性备份,不断更新...
1、通过struts.properties配置文件修改struts2框架的全局行为:当然,也可以在struts.xml文件中通过来定义。1、通过struts.properties配置文件修改struts2框架的全局行为:当然,也可以在struts.xml文件中通过来定义。# 修改默认的编码方式struts.il8n.encoding=UTF-8# 设置自动加载struts.x原创 2015-04-05 16:47:20 · 287 阅读 · 0 评论 -
log4j的使用详解(转载)
简介log4j是一个非常强大的log记录软件,下面我们就来看看在项目中如何使log4j。首先当然是得到log4j的jar档包,推荐使用1.2.X版本的 对于log4j,我们需要配置3个方面的内容:1、根目录(级别和目的地);2、目的地(控制台、文件等等);3、输出样式。以下是log4j的类图:Logger - 日志写出器,供程序员输出日志信息 Appe转载 2015-04-08 09:41:57 · 385 阅读 · 0 评论 -
jstl参考手册
前言 =========================================================================JSTL标签库,是日常开发经常使用的,也是众多标签中性能最好的。把常用的内容,放在这里备份一份,随用随查。尽量做到不用查,就可以随手就可以写出来。这算是Java程序员的基本功吧,一定要扎实。 JSTL全名为JavaServer转载 2015-04-21 10:07:41 · 503 阅读 · 0 评论