![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端那些事
文章平均质量分 54
芳月存心
活着高兴,就不怕穷。
活着本身,就不是为了谁,仅仅是因为活着就是为了活着
展开
-
【BOM】Web Storage
1. Web Storage APIStorage 提供了访问特定域名下的会话存储或本地存储的功能,例如,可以添加、修改或删除存储的数据项。存储对象是简单的键值存储,类似于对象,但是它们在页面加载时保持完整。键和值始终是字符串(请注意,与对象一样,整数键将自动转换为字符串)2. Web Storage 包含如下两种机制:sessionStorage 为每一个给定的源(given origin)维持一个独立的存储区域,该存储区域在页面会话期间可用(即只要浏览器处于打开状态,包括页面重新加载和恢复)。原创 2020-09-10 17:33:36 · 145 阅读 · 0 评论 -
【css】【整理版】知识点小结
1.css元素: 1.1 凡是带有inline的元素,都有文字特性。 1.2 em的计算 em=1*font-size 1.3 元素分类 1)行级元素:内容决定元素所占位置,不可以通过css改变宽高常见行级元素:span strong em a del22)块级元素:独占一行,可以通过css改变宽高常见块级元素:div p ul li ol fo...原创 2018-03-13 23:32:47 · 121 阅读 · 0 评论 -
【vue】render 函数学习总结
在一些场景中,你真的需要 JavaScript 的完全编程的能力,这就是 render 函数,它比 template 更接近编译器。createElement 函数中生成模板。这里是 createElement接受的参数:// @returns {VNode}createElement( // {String | Object | Function} // 一个 HTML 标签字符串,组...原创 2018-03-15 23:11:48 · 741 阅读 · 0 评论 -
【vue-cli】vue-cli+webpack配置下局域网,手机无法访问绑定ip的vue项目
http://192.168.0.104:8080/#/ 访问我的vue项目,浏览器可以打开,手机无法打开,在同一局域网段下。1.设置config文件下的index.js文件: dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: {}, /...原创 2018-03-08 23:03:31 · 6698 阅读 · 0 评论 -
【div+css】关于滚动条
如何出现滚动条?万变不离其宗:文档内容超过其高度就会有滚动条。1.设固定高度+overflow:auto就会出现滚动条,此举措表示适配的时候会让自己崩溃。2.设置top+bottom即可让它高度自动适应(此刻不设置div高度,文档内容自填充),当然此刻要注意好定位,定位不好,真的也会崩溃。例子1:无固定高度的<style type="text/css"> html,body{ ...原创 2018-03-08 20:43:47 · 395 阅读 · 0 评论 -
【vue-cil】 vue-cil 开发总结
1. 项目运行时+编译器(Runtime+Compiler)版本vs只含有运行时版本(Runtime-only)--尽可能使用只含有运行时的构建版本如果你需要在客户端编译模板(例如,向 template 选项传入一个字符串,或者需要将模板中的非 DOM 的 HTML 挂载到一个元素),你需要带有编译器的版本,因而需要完整构建版本。// 这种情况需要编译器(compiler)new V...转载 2018-10-17 11:51:43 · 347 阅读 · 0 评论 -
【vue-cli】去掉eslint语法检查
find this file: config/index.js find thie line: config.dev.useEslint = falsethen => npm run dev原文:https://segmentfault.com/q/1010000006215850?_ea=1053838转载 2018-03-14 22:37:04 · 2605 阅读 · 0 评论 -
【js】js常用正则表达式
1.js去空格str为要去除空格的字符串:去除所有空格: str = str.replace(/\s+/g,”“); 去除两头空格: str = str.replace(/^\s+|\s+$/g,”“);去除左空格:str=str.replace( /^\s*/, ”);去除右空格:str=str.replace(/(\s*$)/g, “”);转载 2018-01-08 16:57:45 · 152 阅读 · 0 评论 -
【CSS】文字属性的一些总结
1.截取多余字符并以省略号显示{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}不行,就试一试定定宽高2.文本居中 1) vertical-align 有时候设置了text-align:center 却发现文字还是不居中,其实text-原创 2017-11-06 15:47:57 · 321 阅读 · 0 评论 -
【css+js】图片轮播
css: .slideshow-container { max-width: 1000px; position: relative; margin: 0 auto; } .mySlides { displa转载 2017-12-28 16:26:43 · 351 阅读 · 0 评论 -
【js】 a标签中href中javascript:void(0)理解
这个是为了 在点击此链接后回到页首,如果你写href="#"那么点击后会回到页首,这样影响操作。 人员管理 人员管理 建议使用void 0方式,因为return方式,有时会影响click事件的传播,尤其是return false的时候。原因如下: href="#"是个锚点,链接指向当前页面。 href="javascript:void(0);" 和 href="j转载 2017-12-19 15:22:20 · 2309 阅读 · 0 评论 -
【nodejs express框架】一些小结
1.项目结构对照.net mvc5框架,便于理解。 node_modules==引用 bin ==原创 2017-12-19 15:06:33 · 418 阅读 · 0 评论 -
【vue】vue-cli中自定义路径别名 assets和static文件夹的区别
静态资源处理:assets和static文件夹的区别相信有很多人知道vue-cli有两个放置静态资源的地方,分别是src/assets文件夹和static文件夹,这两者的区别很多人可能不太清楚。assets目录中的文件会被webpack处理解析为模块依赖,只支持相对路径形式。例如,在 <img src="./logo.png"> 和 background: url(./logo.png...转载 2018-03-12 22:07:40 · 4196 阅读 · 0 评论 -
【Chrome调试】一些技巧小结
1.关于快捷键F12 即可调出开发者工具。Ctrl+{ 或者 } 即可选项卡左右滑动。2.关于调试 2.1 js调试打印对象最好用console.dir(); 此方法可以看到原型链。如何简写console.log()?window.log=console.logƒ log() { [native code] } 线上调试,删除log输出的简洁方法:window.log=()=>{} 2...原创 2018-03-12 23:08:01 · 395 阅读 · 0 评论 -
【vue】关于vue组件的小结
1.vue父子组件通信,老是报warining某某属性无定义的问题: 在子组件中,定义一个属性prop form: { type:Object, default(){ return{ name:"", } } } ...原创 2018-10-17 11:50:30 · 152 阅读 · 0 评论 -
【css】关于图片自适应的技巧
1. 两个div , 最外层div 则是设定图片的宽高,里层的div则设置图片的url,利用background属性进行图片的加载,在做头像的时候就可以做到剪裁加载。内层div的css设置:/*设置图片样式*/.img{ width: 100%; height: 100%; background-position: center; background-size:cov...原创 2018-10-17 11:49:20 · 2251 阅读 · 0 评论 -
【js】js判断PC端还是Mobile端
if (navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent....原创 2018-09-30 14:47:08 · 241 阅读 · 0 评论 -
【css】css缩写
css缩写参考文档https://developer.mozilla.org/zh-CN/docs/Web/CSS/Shorthand_properties css缩写 能缩减大量的代码,使代码便于阅读、理解。 1.background background:#F00 url(header_bg.gif) no-repeat fixed left top;...原创 2018-05-04 16:07:01 · 512 阅读 · 0 评论 -
【浏览器中错误调试】chrome 里面http提示Provisional headers are shown错误
参考:http://stackoverflow.com/questions/21177387/caution-provisional-headers-are-shown-in-chrome-debugger/21179105#21179105http://segmentfault.com/q/1010000000364871参考以上两个解决方案,发生错误的原因为:请求的资源可能被(扩展插件或其他什...转载 2018-05-04 14:27:00 · 3632 阅读 · 1 评论 -
【css】iconfont 在线链接怎么用
font-class引用font-class是unicode使用方式的一种变种,主要是解决unicode书写不直观,语意不明确的问题。与unicode使用方式相比,具有如下特点:兼容性良好,支持ie8+,及所有现代浏览器。相比于unicode语意明确,书写更直观。可以很容易分辨这个icon是什么。因为使用class来定义图标,所以当要替换图标时,只需要修改class里面的unicode引用。不过因...原创 2018-04-09 23:14:38 · 2739 阅读 · 0 评论 -
【css】网页动画效果
1.图标旋转的效果html代码: <div class="apply-entrance "> <p class="apply-tt ">我要讲课<i class="icon-font i-v-bottom-small "></i></p> &a原创 2018-04-09 11:57:08 · 240 阅读 · 0 评论 -
【css】content-box 的应用
1.搜索文本框拼接html代码:<div class="header-index-search "> <div class="mod-search "> <a class="mod-search-dropdown "> <span class="mod-se原创 2018-04-09 11:35:20 · 452 阅读 · 0 评论 -
【css】boder-sizing 中content-box与boder-box的区别
1.盒子模型尺寸基准有两种,分别是content-box和border-box (默认是content-box)2.理论上说,content-box与border-box区别是两者的盒子的宽度是否包含表框和内边距。3.新建两个不同背景填充的div(con1设置为box-sizing:border-box,con为默认的content-box)[html] view plain copy<h...转载 2018-04-09 11:17:06 · 943 阅读 · 0 评论 -
【css】box-shadow 单双边阴影
box shadow 单边阴影 两边阴影box-shadow语法:x轴偏移值 y轴偏移值 模糊半径 阴影半径 || 颜色 insect,其中阴影半径可以为负值,意思是增加或减少指定数值的阴影半径正常阴影 box-shadow: 5px 5px 5px black; 阴影半径为负值 box-shadow: 5px 5px 5px -5px black;阴影半转载 2018-04-09 09:29:48 · 3826 阅读 · 0 评论 -
【vue】计算属性和侦听器
当你有一些数据需要随着其它数据变动而变动时,你很容易滥用 watch<div id="demo">{{ fullName }}</div>watch版本:var vm = new Vue({ el: '#demo', data: { firstName: 'Foo', lastName: 'Bar', fullName: 'Foo Bar'...转载 2018-03-26 14:30:40 · 442 阅读 · 0 评论 -
【vue】关于组件总结
1.函数式组件Vue.component('my-component', { functional: true, // 为了弥补缺少的实例 // 提供第二个参数作为上下文 render: function (createElement, context) { // ... }, // Props 可选 props: { // ... }})如果你使...原创 2018-03-19 23:31:42 · 401 阅读 · 0 评论 -
【css】css图片廊
思路:利用左浮动进行排列,设置hover效果,动画自设。浮动清除使用伪元素after css: .responsive { float: left; padding: 0 6px; width: 24%; margin: 10px auto;转载 2017-12-27 16:20:42 · 353 阅读 · 0 评论 -
【css】提示框Tooltip
css: .content { line-height: 2em; min-width: 24px; border: 1px solid #d4d4d4; padding: 5px; padding-top: 7px;转载 2017-12-27 12:54:41 · 305 阅读 · 0 评论 -
【vuejs】 模态框组件-confirm或者alert框
前言在开发项目的过程中,经常会需要开发一些弹出框效果,但原生的alert和confirm往往都无法满足项目的要求。这次在开发基于Vue.js的读书WebApp的时候总共有两处需要进行提示的地方,因为一开始就没有引入其他的组件库,现在只好自己写一个模态框组件了。目前只是一个仅满足当前项目需求的初始版本,因为这个项目比较简单,也就没有保留很多的扩展功能。这个组件还是有很多扩展空间的,可以增加更转载 2017-11-01 15:51:24 · 5594 阅读 · 1 评论 -
【js】js设为首页加入收藏
//设为首页var sethomepage = function (url){ if (document.all) { document.body.style.behavior = 'url(#default#homepage)'; document.body.setHomePage(window.location.href); } el原创 2017-10-13 11:38:41 · 1142 阅读 · 0 评论 -
【js】滚动条的一些想法
1. 确定那个div里的内容是需要滚动条的。2.滚动条时内容超过高度溢出才有的玩意。3.定位好需要滚动的div //滚动加载事件 scrollBind() { var obj = document.getElementById(this.scrollCurrentNavbar); if (obj.scrollTop + obj.clientHeight原创 2017-11-07 10:29:24 · 132 阅读 · 0 评论 -
【jquery】 ajax parsererror was not called 报错[0,0,error]
问题介绍:$.ajax({ type: "GET", url: url, dataType: "jsonp", success: function (result) { alert("SUCCESS!!!"); }, error: function (xhr, ajaxOptions, thrownError) {转载 2017-10-09 16:28:05 · 1189 阅读 · 0 评论 -
用Html5和csss3做出漂亮的登录注册界面
用html5和css3切换登录注册界面首先我们先创造两个HTML5 forms,那样我们可以利用css3进行设置,使用icon font,这个案例就是来展示如何连接两个form之间的切换。HTML代码<div id="container_demo" > <!-- hidden anchor to stop jump http://www.css3crea...翻译 2017-02-06 22:04:33 · 52908 阅读 · 0 评论 -
C#去除HTML标签
C#去除HTML标签在做网站的时候,用到了去除html标签的问题,用正则匹配到html标签,然后replace即可。public static string ReplaceHtmlTag(string html, int length = 0){ string strText = System.Text.RegularExpressions.Regex.Repla转载 2017-09-25 16:29:11 · 931 阅读 · 0 评论 -
【easyUI】 datagrid的一些使用
引用JQueryUI插件页面布局: js代码:// DataGridvar buildGrid = function () { $('#tt').datagrid({ title: '标签列表', url: '/Tag/TagExList', //control控制中的json返回方法路径 row原创 2017-03-02 18:31:34 · 2211 阅读 · 0 评论 -
【easyui】 datagrid 属性事件常用
// DataGridvar valuedata;var textdata;var buildGrid = function () { $('#tt').datagrid({ title:', url: ' ', //数据填充路径 rownumbers: true, //开启列 fit: true, //自适原创 2017-03-07 18:44:24 · 1847 阅读 · 2 评论 -
【js】第一次加载js失效,如果我再刷新则会成功,why?
当ajax正在运作请求的时候,jquery是不会加载完整的一个页面的,它只是会提取这个页面的头部标签。这个逻辑是这么进行处理的,jquery提取了头部标签只是为了更快的去加载这个页面,减少下载或者请求加载的时间,然后自己提取出的头部标签再和剩下的html页面整合成一个完整的页面。这就是为什么为先得到头部导航。jquery依旧不会先运作任何js在ajax尚未加载完全或者正在进行请求的时候翻译 2017-08-25 15:17:21 · 7478 阅读 · 0 评论 -
HTML文本框INPUT无法输入的解决
HTML文本框INPUT无法输入的解决查看,READONLY和DIAABLE属性都是OK的..在IE下是可以正常输入的的..但是在TT,等基于IE的浏览器下也无法输入..在FF,CHROME下输入也无效..使用各种HTML.CSS调试工具 无果..只好采用二分查找法.删除一片HTML,再看.经过三五次,渐渐缩小范围..终于找到了,是一个左边的TABLE的宽度定成了950PX转载 2017-02-09 19:15:20 · 40392 阅读 · 0 评论 -
理解 CSS 的 z-index 属性
通常认为HTML页面是二维的,但实际上,CSS还有一个z-index属性,允许层叠元素。所有的盒模型元素都处于三维坐标系中。 除了我们常用的横坐标和纵坐标, 盒模型元素还可以沿着“z轴”层叠摆放, 当他们相互覆盖时, z轴顺序就变得十分重要。-- CSS 2.1 Section 9.9.1 - Layered presentation默认的摆放规则假定元素没有指定z-i转载 2017-02-08 22:32:34 · 366 阅读 · 0 评论 -
【html5】 canvas小结
canvas小结1). 默认情况下 元素没有边框和内容。2). 标签通常需要指定一个id属性 (脚本中经常引用), width 和 height 属性定义的画布的大小。3). 你可以在HTML页面中使用多个 元素.4). getContext("2d") 对象是内建的 HTML5 对象,拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。5).canvas拥有坐标,是一个原创 2017-11-17 13:26:40 · 244 阅读 · 0 评论