- 博客(24)
- 收藏
- 关注
原创 vue2双向数据绑定基本原理
vue2的双向数据绑定(又称响应式)原理,是通过数据劫持结合发布订阅模式的方式来实现的,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调来渲染视图。也就是说数据和视图同步,数据发生变化,视图跟着变化,视图变化,数据也随之发生改变。...
2022-08-08 17:32:40
9129
原创 css动画
.show { animation: show-item 2s ease-in forwards;}.hide { animation: hide-item 2s ease-in forwards;}@keyframes hide-item { 0% { opacity: 1; color: red; } 50% { opacity: 0.5; color: g...
2018-10-27 21:34:01
151
原创 ssr服务器端渲染
准备工作安装node新建一个server文件夹,用命令行在server文件夹中npm init,出现一个package.json文件,使文件夹变成一个node的包,这样的包时比较容易管理的。然后在这个包中安装npm install express --save,此时server文件夹中多了一个node_modules文件夹。在server文件夹中新建一个app.js在express.js...
2018-10-25 14:23:45
2590
2
转载 百度搜索框提示词
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title&a
2018-10-14 14:33:45
766
转载 前端性能优化(DOM操作篇)
缓存DOM对象JavaScript的DOM操作可以说是JavaScript最重要的功能,我们经常要根据用户的操作来动态的增加和删除元素,或是通过AJAX返回的数据动态生成元素。比如我们获得了一个很多元素的数组data[],需要将其每个值生成一个li元素插入到一个id为container的ul元素中,最简单(最慢)的方式是:var liNode, i, m;for (i = 0, m = da...
2018-10-14 11:49:30
694
原创 把相对路径换成绝对路径
str = '/a/b/../c/d/e/../f';function func(str) { arr = str.split('/'); var s; if(arr.indexOf('..') == -1){ return str; }else{ index = arr.indexOf('..'); ...
2018-10-12 20:49:27
1533
原创 跨域
1.jsonp原生js<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">
2018-10-12 20:48:23
147
原创 js排序算法
1.冒泡排序function bubbleSort(arr) { var len = arr.length; for(var i=0; i<len; i++) { for(var j=0; j<len-i; j++) { if(arr[j+1]<arr[j]){ var temp = arr[j]; arr[j] = arr[j+1]; a...
2018-10-11 15:01:42
193
原创 浏览器缓存
localstoragevar storage=window.localStorage;//写入三种方法storage["a"]=1;storage.b=2;storage.setItem("c",3);//读取三种方法console.log(storage.a);console.log(storage["b"]);console.log(storage.getItem("c")...
2018-10-09 18:43:04
137
原创 js笔记
undefined一个变量声明了但没有初始化,那么这个变量是undefined。它与没有声明的变量是不同的。注意:typeof对声明了但没有初始化的变量和没有声明的变量的结果都是undefined。NULLNull表示的是一个空对象指针,用typeof来检测null的值会返回objectStringtoString()和String()toString()可以把一个值转换为字符串,但...
2018-10-08 13:03:12
478
原创 HTTP
网络协议分层物理层:定义物理设备如何去传输设备数据链路层:在通信实体之间建立数据链路连接网络层:为数据在结点之间传输创建逻辑链路传输层:向用户提供端到端的服务(tcp,udp),传输层向高层屏蔽 了下层数据通信的细节应用层:为应用软件提供了很多服务,构建于tcp协议之上,屏蔽了网络传输的相关细节HTTP历史HTTP/0.9 只有GET,没有header等描述...
2018-10-02 09:44:34
305
转载 页面加载完毕执行的事件
ready和onload$(function(){ alert('页面加载完毕');})$(document).ready(function(){ alert('页面加载完毕');})window.onload = function(){ alert('页面加载完毕');}区别window.onload会在页面的document全部加载完毕后,并且要求所有的外部图片和资...
2018-09-30 19:55:41
7997
转载 innerHTML,innerText,outerHTM,textContent区别
HTML结构<div id="test"> <span style="color:red">test1</span>test2</div>innerHTML:对象的起始位置到终止为止的全部内容,包括html标签window.onload = function(){ var test = document.getElementById...
2018-09-30 19:46:49
171
转载 js事件委托
概述事件委托或事件代理,就是利用事件冒泡,值得是指定一个事件处理,就可以管理某一类型的所有事件。实现子节点实现相同的功能<ul id="ul1"> <li>111</li> <li>222</li> <li>333</li> <li&
2018-09-30 19:28:36
556
原创 react简书项目
Header怕各个组件的样式冲突,安装以下进行管理npm install styled-components 先把index.css换成style.js,如果想设置全局变量,比如进行reset,则import {injectGlobal} from 'styled-components';injectGlobal` html, body, div, span,...
2018-09-07 19:55:39
839
原创 css3动画
.show{ animation:show-item 2s ease-in forwards;}.hide{ animation:hide-item 2s ease-in forwards;}@keyframes show-item{ 0%{ opacity: 0; color: red; } 50%{ ...
2018-09-05 18:35:28
247
转载 知识点
CSS盒模型https://www.cnblogs.com/chengzp/p/cssbox.htmlflexhttp://www.ruanyifeng.com/blog/2015/07/flex-grammar.htmlBFChttps://segmentfault.com/a/1190000012221820表单提交中的input、button、submit...
2018-08-26 10:39:23
142
转载 笔记-Ajax
不是原创哦,笔记是照着关注的微信公众号Web前端之巅记下来的,大家去关注吧!她的博客地址是https://blog.youkuaiyun.com/lvonve/,非常感谢她!服务器和客户端网路相关概念IP地址: 通过IP地址可以找到特定的服务器。可以通过ipconfig 查看本机的IP。 域名: 由于IP地址是一串数字,比较难记,所以用域名代替IP地址。 DNS域名解析器:...
2018-08-17 19:19:58
611
转载 笔记-jQuery插件
不是原创哦,笔记是照着下面这个博客地址写的,https://www.cnblogs.com/ajianbeyourself/p/5815689.html,非常感谢!jQuery插件开发模式主要有三种:通过$.extend()来扩展jQuery通过$.fn向jQuery添加新的方法通过$.widget()应用jQuery UI的部件工厂方式创建通常我们使用第二种方法。...
2018-08-15 21:08:17
189
转载 笔记-jQuery
不是原创哦,笔记是照着关注的微信公众号Web前端之巅记下来的,大家去关注吧!她的博客地址是https://blog.youkuaiyun.com/lvonve/,非常感谢她!介绍jQuery是JavaScript函数库,是一个js文件,封装了很多方法。 jQuery特点:具有独特的链式语法和短小清晰的多功能接口具有高效灵活的css选择器,并且可以对css选择器进行扩展拥有便捷的插件...
2018-08-15 12:59:56
216
转载 笔记-CSS
CSS介绍CSS全称为Cascading Style Sheets,层叠样式表。可以对网页的布局,颜色,背景,宽度,高度,字体进行控制,让页面更加美观。选择器标签选择器列选择器 谁调用,谁生效 一个标签可以调用多个类选择器,多个标签可以调用同一个类选择器 命名规则 - 不能用数字开头 - 不能特殊符号开头,除_ - 不建议用汉字 ...
2018-08-12 21:35:09
108
转载 笔记-HTML
HTML介绍HTML全称是超文本标记语言(Hyper text markup language),超文本就是超链接,可以实现页面的跳转,是页面的骨架。结构&amp;amp;lt;!DOCTYPE html&amp;amp;gt; &amp;amp;lt;!-- 声明文档的类型 --&amp;amp;gt;&amp;amp;lt;html lang=&amp;quot;
2018-08-12 19:32:16
126
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人