前端
关注
分享
扫一扫
_Always_
这个作者很懒，什么都没留下…
展开
-
CSS-图片滚动样式
无缝滚动模块的图片在同一行显示:white-space :nowrap;关于white-space各个属性：：：normal：轻轻地我走了 正如我轻轻地来pre：轻轻地我走了（这里接很多测试文字）正如我轻轻地来pre-wrap：轻轻地 我走了（这里接很多测试文字）正如我轻轻地来pre-line轻轻地 我走了（这里接很多测试文字）正如我轻轻地来nowrap：轻轻地我走了 正如我轻轻地来...原创 2018-04-17 16:43:59 · 2121 阅读 · 0 评论 -
JQuery---1-基础
JQuery选择器总结: https://www.cnblogs.com/onlys/articles/jQuery.html过滤器： filter原创 2018-06-28 15:51:15 · 167 阅读 · 0 评论 -
Flask后端开发-获取前端ajax交互数据
前端HTML function getData() { $.ajax({ url:'/', data:{'host':host_ip}, type:'POST', async:false, dataType:'json', suc...原创 2018-11-23 14:51:45 · 3785 阅读 · 0 评论 -
Flask开发前端-模板渲染+静态文件
模版继承和block的目的就是为了减少前端代码量，提高代码复用性一、块 (Block)1、关于模板的继承，我们可以在子模板的顶部使用如”{% extend ‘base.html’ %}”语句来声明继承。而子模板中由”{% block block_name %}”和”{% endblock %}”所包括的语句块，将会替换父模板中同样由”{% block block_name %}”和”{% ...原创 2018-11-23 14:52:05 · 4275 阅读 · 1 评论 -
前端开发-echarts 横坐标与数据动态变化
在这次项目开发中使用了ajax，进行前端和后端的数据交互；获取数据使用定时器；本文以横坐标动态变化的折线图为例进行说明,最终效果在文末，但是横坐标会随时间不停变化<!--引入百度Echarts--><script src="{{ url_for('static', filename='js/echarts.min.js') }}"></script&g...原创 2018-11-23 14:52:44 · 7456 阅读 · 4 评论 -
前端开发-Bootstrap-table定时更新
var app = {}; app.timeTicket = setInterval(function(){ $.ajax({ type : 'POST', url : "/", dataType:"json", data:{'host': host_ip},...原创 2018-11-23 14:52:13 · 992 阅读 · 0 评论 -
Uncaught (in promise) DOMException: Failed to execute 'open' on 'XMLHttpRequest': Invalid URL
解决方案：url前面一定要加http://原创 2018-10-12 15:14:18 · 11631 阅读 · 1 评论 -
VUE-项目搭建+element+axios
依赖环境1. node: 访问node官网下载并安装2. vue-cli: npm install -g vue-cli （全局进行安装）淘宝镜像：npm install -g cnpm --registry=https://registry.npm.taobao.org初始项目搭建vue-cli创建vue项目vue init webpack [项目名]在后序的安装中...原创 2019-01-17 20:18:39 · 1200 阅读 · 0 评论 -
vue-axios数据请求
src/main.js中的配置axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded' //设置请求头部axios.defaults.baseURL = 'http://127.0.0.1:8081/news/' //所请求的连接axios.defaults.withCredent...原创 2019-01-17 20:33:15 · 283 阅读 · 0 评论 -
vue-element 表格操作合集
element 表格中的操作主要有 表格分页 表格内的值传至对话框 表格内部分列内容的隐藏 <template> <div> <el-card> <p>这是一个栗子</p> </el-card> <el-card style="margin-top: 20px;&quo原创 2019-01-17 21:16:07 · 2969 阅读 · 0 评论 -
vue-element 表单操作合集
<template> <div class="background" style="padding-top: 10%"> <div class="news"> <el-form ref="ruleForm" :model="ruleForm" :rules="rules&quo原创 2019-01-17 21:36:17 · 769 阅读 · 0 评论 -
禁用浏览器中的返回键 + 跨域在servlet 中的设置
禁用返回键deleteall(){ history.pushState(null, null, document.URL); window.addEventListener('popstate', function () { history.pushState(null, null, document.URL); }); ...原创 2019-01-18 14:15:50 · 150 阅读 · 0 评论 -
npm安装报错--“Unexpected end of JSON input while parsing near···”错误解决方案
背景：使用npm下载时，出现错误Unexpected end of JSON input while parsing near···解决方法：先清除缓存，再重新安装清除缓存：运行npm cache clean --force重新安装：npm install ...原创 2019-01-13 15:55:58 · 25372 阅读 · 0 评论 -
fiddler抓包工具的使用
charles 和 fiddler都是网络数据包拦截工具就是抓包工具啦。抓包：所谓抓包就是讲网络中发送和接受的数据包进行截获， 重发，编辑和转存等等，也经常被用来做数据截取。SSL：SSL协议位于TCP/IP协议与各种应用层协议之间，为数据通讯提供安全支持。广泛地用于Web浏览器与服务器之间的身份认证和加密数据传输。比如HTTPS就是基于HTTP协议，通过SSL或TLS提供加密处理数据、验...原创 2019-03-03 20:20:17 · 536 阅读 · 0 评论 -
TypeError: document.getElementById(...) is null 问题
在用JQuery进行样式修改时，出现TypeError: document.getElementById(...) is null， 错误原因：是body还没有加载，无法获取DOM元素，产生加载顺序问题，get不到节点所在的点 解决方法：1. 将<script>标签放在<body>之后；2. 在<script>标签中加入 defer="tru...原创 2018-06-28 10:59:37 · 5835 阅读 · 0 评论 -
JS---DOM
JS具有足够的能力来创建动态的HTML通过JS，操作HTML元素1. 通过id找到HTML元素 例如查找id为intro的元素：var x = document.getElementById("intro");如果找到该元素，则该方法将以对象在（x中）的形式返回该元素如果未找到，x将包含null2. 通过标签名找到HTML元素 查找id="main"的元素，然后查找main中所有的<P&g...原创 2018-06-27 14:56:55 · 182 阅读 · 0 评论 -
CSS---响应式布局
学的太不仔细了，仰天默泪 media query (媒体查询）常见的属性：device-width,device-height; 屏幕宽高width,height; 渲染屏幕宽高orientation; 设备方向 （例如手机页面横屏显示或者竖屏显示）resolution; ...原创 2018-06-27 14:56:12 · 260 阅读 · 0 评论 -
后代选择器与子元素选择器
1. 后代选择器：找到其后代，包括儿子孙子 曾孙等，改变属性 标签名称1 标签名称2{} 使用空格做连接符2. 子元素选择器：找到其特定直接子元素改变属性 标签名称1>标签名称2{} 注意：不能有空格 选中直接标签（特定的儿子标签）以上都是可以标签、ID、类class混用作为选择器...原创 2018-05-22 19:34:24 · 991 阅读 · 0 评论 -
属性选择器
根据属性名找到对应的标签p[id]{} (代表p标签中有ID标签的)p[class=cc] (代表class=cc的)在input中：当寻找type=password的时input[type=password]{}原创 2018-05-22 20:11:25 · 276 阅读 · 0 评论 -
CSS三大特性-继承性、层叠性、优先级
一、继承性给父元素设置一些属性, 子元素也可以使用, 这个我们就称之为继承性。注意点:并不是所有的属性都可以继承, 只有以color/font-/text-/line-开头的属性才可以继承在CSS的继承中不仅仅是儿子可以继承, 只要是后代都可以继承继承性中的特殊性a标签的文字颜色和下划线是不能继承的h标签的文字大小是不能继承的继承性一般用于设置网页上的公共信息，例如网页文字颜色、字体以及大小等。二...原创 2018-05-24 16:13:36 · 258 阅读 · 0 评论 -
CSS-盒模型Border padding margin
1、 border:边框的宽度 样式 颜色；方向为：上右下左连写时样式不能省略2、内边距属性边框与内容之间的距离给标签设置内边距之后，标签占有的宽度和高度也会发生变化,设置内边距后会有背景颜色3、外边距属性margin标签和标签之间的距离就是外边距，没有背景颜色外边距合并现象默认布局的垂直方向上外边距是不会叠加的, 会出现合并现象, 谁的外边距比较大就听谁的关于margin-top问题:原因根据W...原创 2018-05-24 16:54:40 · 167 阅读 · 0 评论 -
CSS-浮动流
1. 浮动流没有居中对齐即没有center这个取值2. 不可以使用margin：0 auto；3. 相同方向上的浮动流先浮动的元素会显示在前面，4. 浮动元素有贴靠现象：如果父元素的宽度能够显示所有浮动元素, 那么浮动的元素会并排显示如果父元素的宽度不能显示所有浮动元素, 那么会从最后一个元开始往前贴靠， 如果贴靠了前面所有浮动元素之后都不能显示, 最终会贴靠到父元素的左边或者右边...原创 2018-05-24 17:06:15 · 569 阅读 · 0 评论 -
CSS-定位
1. 相对定位：相对自己以前在标准流中的位置来移动position:relative;在相对定位当中，同方向的属性只能使用一个top/bottom right/left相对定位不脱离标准流，所以会继续占用一份空间，并且区分行内元素，块级元素，行内块级元素，相对定位的元素会占用标准流流中的位置，所以设置margin padding 属性时会影响标准流的布局。2. 绝对定位性对于body或者某个定位流...原创 2018-05-30 20:09:19 · 121 阅读 · 0 评论 -
JavaScript----1
一、行内式，内嵌式，外链式行内式往往不推荐内嵌式通常将代码写在body的最后，因为HTML是由上到下加载的，如果先执行了JS，HYTML还未加载，n那么将无法提供交互性；HTML页面中出现<script>标签后，就会让页面暂停等待脚本的解析和执行。无论当前脚本是内嵌式还是外链式，页面的下载和渲染都必须停下来等待脚本的执行完成才能继续, 所以如果把js代码写在head中, 那么js代码没...原创 2018-05-31 17:11:20 · 203 阅读 · 0 评论 -
JavaScript----2
一、算数运算符非Number类型的值进行运算时，会将这些值转换为Number类型的在进行计算可以通过为一个值 -0 *1 /1来将其转换为Number二、赋值运算与自增自减注意x--/x++ 和 ++x/--x三、关系运算符与逻辑运算符=== 判断值和类型是否相等！== 判断值和类型是否不相等对于非数值类型进行比较时，先转换为数字然后进行比较关于逻辑运算：&&：：：：...原创 2018-06-07 18:14:28 · 198 阅读 · 0 评论 -
JS--函数、闭包
1. 没有语言层面的必传参数，即在应用一个函数时，不是必须有参数2. 动态的获取传参使用arguments关键字function join(){// 将arguments对象转化为数组 var arr = Array.prototype.slice.call(arguments);// 将转换后的数组用空字符串连接起来 return arr.join('');}console.log(...原创 2018-06-24 20:07:58 · 155 阅读 · 0 评论 -
JS--window对象2
//都需要传参，下面写的都是匿名函数1. 用于定时的setTimeout() window.setTimeout(function(){ //window可以去掉 console.log('自己计时');},1000); //计时时间为1秒，到达一秒时打印“自己计时”2. 用于计数的setInterval() 时间任务clearInterval() // 清除计时器其...原创 2018-06-24 22:14:09 · 109 阅读 · 0 评论 -
JS--数据类型
一、number常见的Number类型都有哪些？整数（整型）如：1，-1怎么判断一个值是否为整型？Number.isInteger(1) // trueNumber.isInteger(1.1) // false其他类型怎么转整型？parseInt('1') // 1parseInt('1.1') // 1parseInt('1.9') // 1parseInt('1a') // 1parseIn...原创 2018-06-25 15:12:44 · 154 阅读 · 0 评论 -
JS---this
this的三种情况：this所指示的取决于其function是如何被调用的1. 用在方法中指示其父级对象，--以方法的形式调用（function）2. 没有作为方法形式调用时为undefined（全局函数，匿名函数等）3. 在构造函数之中：this指向即将生成的对象全局作用域或者普通函数中this指向全局对象window。//直接打印console.log(this) //window//f...原创 2018-06-25 15:57:54 · 153 阅读 · 0 评论 -
JS---apply call bind-改变this指向（绑定）
call和apply改变了函数的this上下文后便执行该函数,而bind则是返回改变了上下文后的一个函数。 apply 方法，它让我们构造一个参数数组传递给函数，同时可以自己来设置 this 的值，这就是它最强大的地方，上面的 3 种函数调用方式，你可以看到，this 都是自动绑定的，没办法由你来设，当你想设的时候，就可以用 apply() 了。apply 函数接收 2 个参数，第一个是传递给这个...原创 2018-06-25 20:25:08 · 164 阅读 · 0 评论 -
JS---回调函数
字面上的理解，回调函数就是一个参数，将这个函数作为参数传到另一个函数里面，当那个函数执行完之后，再执行传进去的这个函数。这个过程就叫做回调。var a = [2, 4, 6, 8];function each(arr, callback){ for(var i = 0; i < arr.length; i++) { var item = arr[i]; ...原创 2018-06-25 20:52:27 · 115 阅读 · 0 评论