- 博客(30)
- 收藏
- 关注
RSS订阅原创 城市三级联动的json文件
[{ "code" : "110000", "name" : "北京市", "children" : [{ "code" : "110100", "name" : "市辖区", "children" : [{ "code" : "110101", "name" : "东城区" }, { "code" : "110102", "name" : "西城区" }, { "code" : "11010
2020-09-21 09:14:26
373
原创 分享一个自己的城市三级联动代码
这是自己写的城市三级联动代码，给大家分享下~<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><b
2020-09-21 08:54:15
167
原创 ES5的Object.defineProperty()方法
Object.defineProperty()方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象。我们来看看例子。const obj = { name : "name", age : 18}Object.defineProperty(obj,"name",{ value : "郑爽"})console.log(obj)可以看到obj里面的name变成了新的值Object.defineProperty(obj,"name",{ configurable
2020-09-13 23:17:15
179
原创 ES5属性描述符Property Descriptor
属性描述符：Property Descriptor是用来描述属性相关的信息const obj = { ame: "杨幂", age: 18}console.log(Object.getOwnPropertyDexcriptor(obj,"name"))//用属性描述符之后会返回一个新的对象，里面有四个属性，分别是//configurable:true 默认为true，改为false后，表示改name属性就不能被属性描述符修改了//enumerable:true 默认为true
2020-09-10 20:02:50
251
原创 防抖（debounce）和节流（throttle）函数之节流函数
上篇博客写到，防抖函数是在规定的一段事件内，只执行一次函数，那要是用户一直拖着鼠标滚来滚去，理论上来说就一直不会输出距离顶部的距离，那么要是产品提个需求，就算用户不断的拖着滚动条，也能每过一段事件就输出一次距离顶部的距离呢？ 这个就是就要用到我们的节流函数了function top() { let top = document.documentElement.scrollTop console.log(`滚动条的位置:${top}`) }; function throttle
2020-09-02 20:54:14
182
原创 防抖（debounce）和节流（throttle）函数之防抖函数
前端项目中，防抖和节流实际上遇到的频率特别的高，因为浏览器的性能是有限的，为了达到性能优化的目的，所以防抖节流的知识还是早点掌握好一点。 function top() { var top = document.documentElement.scrollTop || document.body.scroolTop console.log(top) }; window.onscroll = top鼠标滚轮轻轻一滚动，会发现事件已经打印了这么多次，这个时候就会发现一个问题，这
2020-09-02 20:33:05
170
原创 AJAX的基础语法
// 1: 创建xhr对象var xhr = new XMLHttpRequest()//2: 监听xhr.onreadystatechange = function(){ //readyState(状态码)：有0,1,2,3,4五个值 当等于4的时候表示内容解析完成 if(xhr.readyState == 4){ //stasus=200的时候表示 服务器已成功处理了请求 if(xhr.status == 200){ console.log(xhr.responseText)
2020-08-17 19:37:06
152
原创 彻底理解用JavaScript实现冒泡排序
冒泡排序是一个比较经典且简单的一种算法，利用对数组进行一些方法，让数组从小到大的顺序重新排序。 话不多说上代码function paixu(arr) { //遍历一遍数组， for (var i = 0; i < arr.length - 1; i++) { //拿后面所有的数字和第一个比 for (var j = i + 1; j < arr.length; j++) { //如果第一个值比后面大，就和哪个数交换，最终第一轮下来，数组
2020-08-05 20:30:05
154
原创 教公司前端妹子用纯css3实现轮播图~
接水的时候碰到了公司的一个前端妹子，她向我请教了下轮播图的写法，我就决定在她面前秀一波~ 大概效果就是这样了，就是简单的用了CSS3的animation的动画属性，废话少说上代码~<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sca
2020-07-23 10:03:48
115
原创 flex布局写一个永动机~
这是我无聊写的一个可以一直循环转动的抽奖机，之哦于点暂停的时候才会暂停，多的话不说上代码~<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title&.
2020-07-22 09:08:11
133
原创 玩一下数组的一些方法
//数组的toString()var arr = ["abc","def","ghi"]//toString()方法把数组转换为逗号相隔的字符串var newarr = arr.toString()console.log(newarr)//abc,def,ghivar arr = ["aaa","bbb","ccc"]//join()也是将数组转换为字符串，但是可以更改分隔符,默认是(,)var newarr = arr.join()var newarr2 = arr.join("")v
2020-07-15 20:31:55
106
原创 写给女程序员的JavaScript异步加载的三种写法~
因为女程序少的缘故，故女程序员在公司中一般都是团宠的。但是，前提是你得过笔试面试才有成为团宠的机会呀。 这篇文章就来解析比试中常出现的异步加载的三种方式。 一般题目是写出两种JS的异步加载方式//第一种<script src="" defer></script>//第二种<script src="" async></script> 这样写虽然是没错，但肯定不是面试的心中最理想的答案//第三种function loadScript(url,
2020-07-13 19:24:13
1067
3
原创 前端之预编译
预编译是JavaScript绕不过去的一道坎，有关的题更是层出不穷，今天就由我来彻底的解析什么是前端的预编译。 js有GO对象(global object)和AO对象(active object),先来讲GO对象，进入script标签，在执行代码前的一瞬间会生成一个GO对象分析var声明，变量名为GO对象的属性名，值为undefined，如果变量名重名，不用发生任何改变分析函数声明，变量名为GO对象的属性名，值为函数体，如果变量名重名，直接覆盖属性值。搞懂了这些，接下来就直接上代码。//.
2020-07-08 11:48:50
1074
1
原创 getComputedStyle 公司新来的前端妹子竟然连这个都不会~~~
公司新来了个前端妹子，在写购物车的时候，有一个点击会把隐藏的div显示出来的效果。通过点击来实现这样的的效果，但是妹子说她的代码点第一的时候没反应，要点第二次才行，废话不说上代码。function up(e) { var zs = document.querySelector('.tt_zhangsan') if (zs.style.display == "none") { e.className = "fa fa-chevron-down fa-lg"
2020-07-06 17:25:16
3357
23
原创 H5的input新属性number
在用js对input进行操作的时候，会因为你获得的input的value值是string而很麻烦，比如和数字进行比较的时候得转换为number，或者要进行非空验证，非字符串的验证。但现在ECMAScript6(简称es6)，给input加了一个新属性type = “number”，在这个的input里只能输入数字和大小写的E(e)空格，字母，汉字通通都输入不了，是不是很方便。但是你把鼠标放上去会input右边会出现一个默认样式，虽然这个上下箭头可以给数字加一或者减一，但是我个人觉得很丑，最后终于找到了解
2020-06-02 20:33:24
959
原创 一个前端vue项目应该怎样创建
在我们创建vue项目之前，需要node环境，你们先window+r输入cmd，在输入框搜索"cmd",然后进入，在命令行输入node-v 按回车,可以看见当前node的版本。如果没有node那就去node的官网下载一个，一直下一步就行了。(下载完重复第一步检查是否安装成功)接下来就是安装脚手架了，接着按照第一步的步骤打开cmd，但这次不输入noede-v，如果我们网速不好，可以下一个淘宝镜像，...
2020-03-12 18:36:12
409
原创 vue的内置指令
vue是我们前端非常重要的一部分，随着这几年使用vue技术的公司越来越多，足以证明vue确实是非常好用的前端框架，竟然这么火的vue，那我们可不能马虎。vue是一个渐进式的框架，渐进式就是循环渐进的一个过程，能当成库来使用，也可以当成框架来进行项目的构建。我们主要拿vue当成框架来用，可以完成一整个大型应用的开发，库就简单些，提供便利，完成某些功能。那么就会问了，jQuery就是我们以前常用...
2020-03-10 18:57:29
525
原创 Ajax
好久没见，这段时间有点懒惰~~~~什么是异步和同步呢？异步就是在生活中的一心二意，比如一边洗在一边刷牙，这样可以说自己节省了刷牙的时间，也可以说节省了洗澡的时间，这样从某些方面来说是好事，但一心多用可能导致洗澡的某些部位不够干净，或者口腔清洁的还不够，有利有弊吧；同步就很简单了，一对一专心的做一件事，但就没异步那么灵活安排，各有各的好吧。script在使用async引入外部脚本的script标...
2019-11-11 21:01:57
258
原创 js 一些细节
篇幅有点长，就在写一篇。在对数组的处理上我们用push()在数组的结尾添加括号里面的内容，把数组的最后一个元素删除用pop()来删除；在开头添加元素用unshift()来添加，shift()就是用来删除开头的第一个元素；学了这么久的JavaScript，它有哪些特点呢？特点是：弱类型，面向对象（基于对象），脚本语言，解释性语言：直接由JavaScript引擎来执行，任何文本工具都可以开发Jav...
2019-08-26 20:33:18
229
原创 js
经过了这么长一段时间的学习，我决定在网上找一些题目来检测自己，看看自己的只是掌握到了那个程度，关于JavaScript的题目网上还是挺多的，我于是就总结了一些常规的比较容易发生错误的题目，以后回来看看能够马上想起来。我们用JavaScript创建对象一般有四种方法：1：var obj = {name :“lihua”,age:20,intr:function(){return this....
2019-08-26 19:51:00
113
原创 JavaScript
在写JavaScript代码的时候，当我们要查找id为xxx的的元素的时候，我们可以用var aaa = document.getElementById(“xxx”)来表示，举个例子吧，当我们要查找id = intro的元素时，我们就可以var div = document.getElementById(“intro”);就可以了。当我们需要通过标签名来查找HTML中的元素时，我们就可以用...
2019-08-19 19:43:19
86
原创 DOM
这段时间学习了HTML DOM,DOM全名叫Document Object Model,当网页被加载的时候，浏览器会创建页面的文档对象模型，而这HTML DOM的模型就被我们俗称DOM树。JavaScript的三个重要组成有：ES，DOM，BOM这三个。核心DOM能够操作所有结构化文档，例如HTML和XML。在网页中所有呆在内存中的都是以树形结构储存的，存储的上下级之间的关系有有着非常直观的架...
2019-08-19 17:22:34
167
原创 2048小游戏
这个星期尝试着做一个2048的小游戏，就是有一个大的div里面包裹着横四竖四共16个小的div，曹总键盘上下左右使得数字相加或者移动，从而使数字最终达到2048即为游戏结束，或者当格子移动不了了之后也是游戏结束。我们首先建立基本的模型，div建好之后我们去给它一个class和id，然后在css里面给边框选择长度和宽度，里面16个小框之间的内部距离大小，字体的颜色和字体的尺寸，还有数字在小框之间的...
2019-08-12 20:02:19
313
原创 原型 原型链
标题在最近的原型和原型链的学习中，感觉压力有点大，学习难度也比较大，但又很基础很重要，我们在学习中得要下很大的功夫才行。无论什么时候，只要创建了一个新的函数，就会根据一组特定的规则为这个函数创建一个prototype的属性，prototype这个属性指向函数的原型对象，然后所有的的原型对象都会有一个constructor的属性，这个属性包含着一个指向prototype属性所在函数的指针。原型...
2019-08-12 19:34:58
1181
原创 变量
在我们的变量中一般都有两个变量，一个是全局变量，一个是局部变量，两个变量都有自己的优势和自己的缺点。在全局变量中，全局作用域window，它能随处可见，也能反复使用，但是有全局污染的缺点。局部变量中，局部变量（AO：Action Object），它仅仅能在函数内使用，不可以反复使用。函数的生命周期一般分为四个步骤，第一是开始执行前，也就是生命提前阶段。先是创建环境栈或者数组，临时的保存正在z...
2019-08-05 18:39:11
98
原创 bug和垃圾回收
这期的博客我们来讲讲什么是BUG,想我这批95后，大多都爱玩电子游戏，竟然经常玩这类游戏的话，那么BUG这个词大家肯定都不会陌生，因为不同的游戏或多或少都会有哪些BUG。就好像当初我玩的CF穿越火线，里面应为地图比较大，所有就一直都存在着卡箱子的BUG，就是人物在箱子的边缘WSAD上下左右的移动，就可以将游戏人物卡到地下，浙江生化幽灵就攻击不到玩家，但是玩家能用枪武器攻击生化幽灵，像这样的等等，...
2019-08-05 15:03:47
278
原创 JS一些小心得
这段时间的JS学习令我在前端的学习道路走上正轨，学习了一些循环运算的算法，感觉自己又回到了初中高中的那个和数学题较劲的年代，哈哈哈。果然很长时间不用脑子之后，这生锈的大脑确实有点转不过来，有时候面对一些很简单的算法逻辑题，都找不到一点头脑，只能向朋友们求助，虽然英国点播之后就会很快理解，但面对新的难题时，却又总不能第一时间理解，看来确实缺少点独立自考的能力。不仅算法，最近还学了数组，我知道数组...
2019-07-29 18:37:09
124
原创 js算法
1 典型的算术运算会操作两个数（或表达式）并返回一个新的数。2 典型的算术运算会操作两个数（或表达式）并返回一个新的数。3 典型的算术运算会操作两个数（或表达式）并返回一个新的数。4 + 运算符5 - 运算符6 * 运算符7 / 运算符8 9 ++ 运算符10 – 运算符...
2019-07-22 21:38:56
189
原创 javascript算法
1 笔试成绩60 面试成绩60 才可录取var bi = prompt(“请输入笔试成绩:”);var face = prompt(“请输入面试成绩:”);var isPass = bi >= 60 && face >= 60;console.log(“能否通过？” + isPass);2 笔试成绩面试成绩一个为100 就可录取var bi = ...
2019-07-22 18:39:00
94
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人