qq_33172029的博客

关于前端在线markdown编辑插件editormd的设置的纪录：项目结构图1）外部资源路径设置：（就是editormd自家的资源）参数：path

iframe高度随内容自适应方法：//计算iframe高度function calcPageHeight(doc) { var cHeight = Math.max(doc.body.clientHeight, doc.documentElement.clientHeight); var sHeight = Math.max(doc.body.scrollHeight, doc.d...

内容：前端JS删除对应数组元素//删除数组，坐标为index的元素arry.splice(index,1);应用：求两数组之间的差集，求出arr2中arr1没有的元素代码：function diffArr(){ var arr1 = ['a','b','c','d']; var arr2 = ['a','e','f']; for(var i=0;i<arr1.le...

前端Base64编码数据（加密和解密）谷歌：base64.js/* * base64.js * * Licensed under the BSD 3-Clause License. * http://opensource.org/licenses/BSD-3-Clause * * References: * http://en.wikipedia.org/...

1）简洁：Canvas，HTML5支持属性（IE9+之后，才支持H5）2）Canvas学习文档：Runoob：HTML5 CanvasMDN：canvas3）兼容IE8（Google 给出了解决方案：github资源）引入：excanvas.js（若要最新版的，自行到github上拉取）// Copyright 2006 Google Inc.//// ...

需求：由于有个模块功能，是需要做很多报表，而报表与报表之间是通过TAB页形式切换的，因此想通过设计，让代码更灵活，维护性更高；功能如下图思路：1）通过JQ的Tab组件（jquery-ui-tabs.js），实现前端页面Tab切换效果；2）页面主要有两个元素，TAB项（如：人数统计表，人事报表分析），和每个TAB对应的挂载点；3）每个TAB页在第一次点击时，就会触发加载函数，然后...

情况：二维表（公司/统计），一般来说，我们通常做的二维表是（统计/公司），因为统计项是确定的，公司是动态的，所以在JSP中做table时，可以遍历每行数据，就很好做；但是目前横轴字段（公司）是动态的，然后每行的td数量也需要根据公司的数量来确定，因此需要一个html模板，在每次加载行的时候，把公用的td模板添加上去，那样就不用每行遍历了。做法：在JSP中编写JAVA，把对应相同空白区...

-moz-, -webkit-, -o-这些都是浏览器前缀情况：浏览器厂商在标准尚未明确情况下提前支持会有风险，同时也会出现有的浏览器厂商支持的好，有的支持的不好，所以就用厂商前缀加以区分。结果：CSS个别样式，会有兼容问题，需要给个别浏览器的样式加上浏览器前缀，像阴影效果的样式，box-shadow；在不同浏览器上有不同的效果，为了兼容，可能需要在box-shadow加上不同浏览器的前缀...

情况：有时候，想在不同的浏览器上，加载不同的样式文件，或者其他操作，就需要浏览器条件注释判断，以下是，部分浏览器的条件注释判断。注：本文非原创，摘抄自其他网友的blog。<!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]--><!--[if IE]> 所有的IE可识别 <![endif]--&gt...

1）情况：最近写了一个类似window界面，鼠标左击按下（不放开），然后移动，会出现一个方框的效果（如图一），然后选中虚线框中的td（其实就是td颜色改变），这里的内容，看似简单，但是对于一个我这个前端菜鸡的后端来说，简直就是噩梦，因为需要兼容谷歌，IE11和IE8。。。，好了，实际效果图（如图二，由于系统太旧，前端界面比较丑，不用在意，看思路就好）2）实现效果：图一：图二：...

情况：IE8的滤镜、谷歌（现代浏览器）的透明度，他们的效果基本一致，不过注意，他们存在的意义，个人认为是做遮罩层用的，也可以在其他dom之上，做一个透明的覆盖层，用于其他业务用途（我做过的是画板），不过一定需要注意的是：IE8上必须设置颜色，因为不设置的话，会直接穿透点中下层元素（即z-index比遮罩层低的元素），这也是IE8上的一个坑，老子算是遇到了，怕了怕了。代码：.div{ /...

思路：判断当前dom是否有滚动条（横轴，纵轴），依据是：当前dom的内容，是否超过当前页面的可见宽高即可代码：（这里最好不能添加=号）//判断是否有滚动条：vertical纵轴，horizontal横轴function hasScrolled(element,direction){ if(direction==='vertical'){ return eleme...

情况：前端浏览器窗口大小变化，监听函数（针对窗体最大化，最小化，或手动调整窗口大小，都能监听到）代码：$(window).resize(function (){ //do something if you want});...

1：可见范围描述：获取当前页面的可见大小，其大小是动态的，若是窗体最小化，或者缩小什么的，可见宽高也会变化//页面可见大小var clientWidth = document.body.clientWidth;var clienHeight = document.body.clientHeight;2：滚动距离描述：获取当前页面上下左右滚动距离，不过这里是有坑的，因为在...

用途：区分当前IE浏览器系列中（IE8还是IE11）1：先判断是否为IE浏览器（IE8和IE11，适用）function isIE(){ if(window.showModalDialog){ return true; } return false;}2：再判断版本号function isIE11(){ var userAgent = navigator.u...

MDN，对于前端DOM的各个事件总结的太好了，因此转载记录转载：MDN：事件参考总结

1）情况：前端实现阴影效果，一般是通过box-shadow属性来设置，不过根据不同的浏览，可能存在兼容差异2）接口简单说明：（正常做阴影的效果，就是在dom的两边，一般右边和底边）box-shadow：3px 3px 3px black;第一个3px：是阴影距离dom的横轴（右方为正方向，负数即左方）的距离；第二个3px：是阴影距离dom的纵轴（下方为正方向，负数即上方）的距离；...

前端鼠标形状设置，可以通过设置cursor属性来修改。具体参考：CSS cursor 属性

导论：select标签总结，一直会完善1）option子标签1.1）option子标签中的title属性当鼠标悬停在对应的option上时，会将对应的option标签的title内容显示出来。注意：有时候，option内容太长，需要省略，获取以其他方式显示，设置该参数可能有所帮助...

IE浏览器：document.body.createTextRange()moveToElementText()其他的浏览器：document.createRange()selectNodeContents()代码：var obj = $("#span")[0];//dom节点if (document.body.createTextRange) {//IE写法 ...

项目：Vue+Springboot情况：前后端分离时，Vue在node.js运行（有自身的端口号），springboot运行对外提供接口，但是vue项目直接访问springboot的接口，会出现跨域问题。解决方案（两种，已测试）：1）方式一：通过nginx代理（其实这种，也不是真正意义上的跨域，因为资源放在了代理上）1.1）将vue项目下，通过命令：npm run build，...

IE8中对于Date对象，存在兼容性文档：MDN：Date对象适当调整代码：（注：这里的日期格式为"2019-09-03"，如果想要其他格式，自行修改正则表达式即可）function parseDate(dateStr) { var isoExp = /^\s*(\d{4})-(\d\d)-(\d\d)\s*$/;//正则 var date = new Date(NaN); v...

转载：VUE环境搭建npm安装教程

CSS去掉背景颜色：background-color:transparent;

转载：前端布局

转载：BFC元素理解

情况：我们正常的操作，为了阻止DOM的事件，往外层的DOM冒泡时，一般会使用e.stopPropagation(); 但是由于这个世上出现了IE8，一切都变了，真的是氧化钙！MDN文档：event​.stop​Propagation，这里注意看“浏览器兼容性”那一项代码：if(window.showModalDialog){//IE8 window.event.cancel...

情况：为了打印出其他iframe页面内容，而我的情况，则是打印出同一个tomcat下的其他应用程序的页面（此处可以操作其他页面的window，是由于没有跨域问题，如果是跨域问题的话，除非两边都能有权限设置，否则GG，而现在再同一个tomcat下，所以IP和端口号都一致，无跨域问题。）代码：//打印简历 function printResume(){ var resumeWind...

情况1）在IE8上，回调前函数可以，回调后函数alert方式测试：测试结果：顺序1：alert(1)顺序2：alert(2)顺序3：弹出打印界面情况2）谷歌上调用，回调前，回调后，两个函数，会各自调用两次alert方式测试：测试结果：顺序1：alert(1)顺序2：弹出打印界面顺序3：alert(1)顺序4：alert(2)顺序5：alert(2...

情况：由于IE8有时候，部分标签属性或者，某些样式是不支持，所以有时会自己写JS来兼容代码：（该代码由本人同事写的，可能也是百度）/* * jQuery placeholder, fix for IE6,7,8,9 */var JPlaceHolder = { //检测 _check : function(){ return 'placeholder...

1）通过JS方式，判断是否为IE81.1）通过IE8特有的对象，或者IE8没有的对象，区分判断1.1.1）通过IE8（IE8之前的判断不做验证）特有对象判断：window.ActiveXObject代码：window.onload = function(){ if(chkIE()){ alert("is IE8"); }else{ alert("is not IE8"...

代码：（IE8，谷歌都兼容）//修改时，所有浏览器都兼容$("#id").bind("input propertychange", function (e) {                 });  

情况：点击某个节点元素时，点击事件，不往上层元素传递冒泡代码：$("#id").bind("click", function(e){ e.stopPropagation();//阻止点击事件向上冒泡}); 

情况：绑定整个页面点击事件时，IE8失效，所以做了以下兼容代码：第一种：（else内的方式绑定，只有谷歌等浏览器可以，IE8不可以）//判断是否为IE8（showModalDialog为IE8特有弹窗方法）if(window.showModalDialog){      $(document).bind("click", function (e) {             ...

有时候，需要将块元素变成行元素可以设置元素属性：display:inline

 前端页面，有时需要同步效果，得到某个结果后，再进行操作1：AJAX访问后台，获取数据，再进行之后的操作，有些人可以在success函数中回调函数，但ajax中原本也可以设置async参数为false，来达到同步效果，async默认为true代码：（设置同步后，alert(1)会等访问结束后，才调用）$.ajax({ type: "POST", async: false, ur...

常见前端JSON互转用法：1）JSON字符串转为JSON对象（目前，我所知道的有四种实现方式）1.1）JQuery方式--其中string为JSON字符串var temp = $.parseJSON(string)1.2）（Firefox，chrome，opera，safari，ie）等浏览器支持的转换方式--string为JSON字符串var temp = JSON....

适用于不能修改项目或者页面的编码时 js对url进行编码和解码（三种方式区别）*** 只有 0-9[a-Z] $ - _ . + ! * ' ( ) , 以及某些保留字，才能不经过编码直接用于 URL。***例如：搜索的中文关键字，复制网址之后再粘贴就会发现该URL已经被转码。1、escape 和 unescape原理：对除ASCII字母、数字、标点符号 @  *  _  ...

前言：关于前端map对象的简单说明，它跟我们平时JAVA对象的思想基本一样，具体可以参考文档：MAP对象 问题情况：但是，这个这么好用的对象，并不是在所有浏览器，或者所有不同版本的浏览器上，所特有的。目前，我遇到的是，谷歌，火狐，IE10，IE11都内置有map对象，但是IE8却没有...（忧伤）就是因为，这个对象比较强大，在某些情况下，需要用到，所以看情况而定吧。 ...

1：属性概括：CSS中border属性的使用，设置元素有边框，并设置边框的属性，包括边界大小，类型，颜色；2：属性使用细说：2.1：第一种设置border的方式，元素是矩形的，有四条边，而这种方式的设置后，会样式给四条边都一一赋予例子：border:1px solid red；/*设置边框大小为1px的红色实线*/参数说明：第一个属性为设置边框大小：px为单位；第二个属性为...