![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端开发
想成为前端工程师滴小小白
这个作者很懒,什么都没留下…
展开
-
最快发布网站方法
1.购买服务器www.net.cn(阿里云)-----购买云服务器ECS(相当于一台独立电脑,建议两核4G起点配置)-----登陆服务器-----点阿里云后台—点ECS服务器(给了全球唯一ip)我的电脑----远程桌面连接—输入ip------连接2.购买域名(指向服务器的ip)解析(@输入 .cn即可跳转,输入www指向服务器)3.在服务器上安装数据库软件sqlserver安装好,sqlserver要有自己的密码,不要用windows身份认证(问题:服务器上登陆没问题,服务器以外无法登录)原创 2020-12-06 18:40:12 · 732 阅读 · 0 评论 -
node02
node02:第三方模块Gulp基于node平台开发的前端构建工具将机械化操作编写成任务,想要执行机械化操作时执行一个命令任务就能自动执行了Gulp能做什么?项目上线,HTML、CSS、JS文件合并压缩语法转换(es6、less)公共文件抽离修改文件浏览器自动刷新Gulp使用:1.使用npm install gulp下载gulp库文件1)新建gulp -demo文件夹cd gulp-demonpm install gulp2.在项目根目录下建立gulpfile.js文件在gul原创 2020-06-12 16:22:48 · 148 阅读 · 0 评论 -
Node01:
Node01:1.Node开发概述服务器端开发要做的事:实现网站的业务逻辑数据的增删改查Node是一个基于ChromeV8引擎的JavaScript代码运行环境2.Node运行环境的搭建LTS长期支持版 稳定版Current拥有最新特性 实验版、官网:https://nodejs.org/en/1)错误代码2502、2503解决方法:a.以管理员身份运行powershell命令行工具b.输入运行安装包命令msiexec/package node安装包位置执行windows原创 2020-06-09 11:43:36 · 153 阅读 · 0 评论 -
js高级05
js高级05:ES6:ES全称是ECMAScript,它是由ECMA国际标准化组织制定的一项脚本语言的标准化规范为什么要使用ES6?变量提升特性增加了程序运行的不可预测性语法过于松散,实现相同的功能,不同的人可能会写出不同的代码1.变量let1)ES6中新增的用于声明变量的关键字2)let声明的变量只在所处的块级有效3)注意:使用了他关键字声明的变量才具有块级作用域,使用var声明的变量不具备块级作用域特性4)防止循环变量变成全局变量2.使用let关键字声明的变量不存在变量提升3.使原创 2020-06-09 09:22:27 · 99 阅读 · 0 评论 -
js高级04之正则表达式
js高级041.正则表达式1)匹配2)替换3)提取2.正则表达式在js中的使用1)通过调用RegExp对象的构造函数创建var 变量名=new RegExp(/表达式/);2)利用字面量来创建var 变量名=/表达式/;3)测试正则表达式test用于检测字符串是否符合该规则,该对象会返回true或false,其参数是测试字符串regexObj.test(str)a.regexObj是写的正则表达式b.str我们要测试的文本c.就是检测str文本是否符合我们写的正则表达式规范3原创 2020-06-08 16:20:38 · 193 阅读 · 0 评论 -
js高级03之函数的定义和调用
js高级03一、函数的定义和调用1.函数定义方式:1)自定义函数function fn(){};2)函数表达式var fun=function(){};3)利用new Function(‘参数1’,‘参数2’,‘函数体’)var fn=new Function(‘参数1’,‘参数2’,‘函数体’)a.Function里面都必须是字符串格式b.第三种方式执行效率低,也不方便书写,因此较少使用c.所有函数都是Function的实例(对象)2.函数的调用方式: 2.this指向问题:原创 2020-06-08 10:36:56 · 180 阅读 · 0 评论 -
js高级02之构造函数和原型,ES5中的新增方法
js高级02一、构造函数和原型:1.构造函数:是一种特殊的函数,主要用来初始化对象,即为对象成员变量赋初值,它总与new一起使用。我们可以把对象中一些公共的属性和方法抽取出来,然后封装到这个函数里面2.new在执行时会做4件事:1)在内存中创建一个新的空对象2)让this指向这个新的对象3)执行构造函数里面的代码,给这个新对象添加属性和方法4)返回这个新对象(所以构造函数里面不需要return)// 1. 利用 new Object() 创建对象 var obj1 = new Obj原创 2020-06-07 17:11:37 · 561 阅读 · 0 评论 -
js高级01之tab栏切换案例
javaScript面向对象:面向对象编程介绍面向过程:步骤面向对象(OOP):把事物分解为一个个对象,然后由对象之间分工与合作封装性、继承性、多态性ES6中的类和对象:类class:泛指某一大类对象:具体名词,特指某一个创建类:class name{//class body}创建实例:var xx=new name();类必须使用new实例化对象 conctructor构造函数:conctructor()方法是类的构造函数(默认方法),用于传递参数,返回实例对象,通过n原创 2020-06-07 10:03:15 · 337 阅读 · 0 评论 -
jQuery基本操作之三
jQuery3jQuery事件:jQuery事件注册:单个事件注册:$(“div”).click(function(){$(this).css(“background”,“purple”);});$(“div”).mouseenter(function(){$(this).css(“background”,“skyblue”);});事件处理on(多个或一个事件连接起来)element.on(events,[selector],fn)1.events:一个或多个用空格分隔的事件类型原创 2020-06-05 15:05:10 · 145 阅读 · 0 评论 -
jQuery基本操作之二
jQuery2jQuery属性操作:prop获取元素固定的属性值:1.获取属性值语法:prop(“属性”)$(“a”).prop(“href”)2.设置属性语法:prop(“属性”,“属性值”)$(“a”).prop(“title”,“我们都很好”)KaTeX parse error: Expected '}', got 'EOF' at end of input: …){console.log((this).prop(“checked”));})设置或获取元素自定义属性attr()原创 2020-06-04 15:15:44 · 184 阅读 · 0 评论 -
jQuery基础知识篇一
javasciprt库封装了很多js函数的文件夹常见的javascript库:jQueryPrototypeYUIDojoExt JS移动端的zeptojQuery概念:javascript query查询把js中的DOM操作做了封装,我们可以快速查询使用里面的功能jQuery的基本使用:jQuery的入口函数:$(function(){…//此处是DOM加载完成的入口});(document).ready(function()...//此处是页面DOM加载完成的入口)相当原创 2020-06-03 16:43:01 · 179 阅读 · 0 评论 -
webapi7
webapi7移动端常见特效:移动端轮播图:1.可以自动播放图片2.手指可以拖动轮播图transitionend监听事件完成的事件:classList属性div.classList.add(‘three’);//追加类名不加小点element.classListremove(‘类名’);//移除类名切换类:点击一次添加类,再点击一次取消类element.classList.toggle(‘类名’);click延时解决方案:300ms延时禁止缩放功能:利用touch事件自己封装原创 2020-06-02 10:20:31 · 109 阅读 · 0 评论 -
webapi6之淘宝轮播图案例
webapi6缓动动画原理:// 缓动动画函数封装obj目标对象 target 目标位置// 思路:// 1. 让盒子每次移动的距离慢慢变小, 速度就会慢慢落下来。// 2. 核心算法:(目标值 - 现在的位置) / 10 做为每次移动的距离 步长// 3. 停止的条件是: 让当前盒子位置等于目标位置就停止定时器function animate(obj, target) {// 先清除以前的定时器,只保留当前的一个定时器执行clearInterval(obj.timer);obj.tim原创 2020-06-01 15:52:51 · 360 阅读 · 0 评论 -
webapi5
webapi4PC端网页特效元素偏移量offset系列:翻译过来是偏移量,使用offset系列相关属性可以动态的得到该元素的位置(偏移)、大小等。a.获得元素距离带有定位父元素的位置b.获得元素自身的大小注:返回的数值都不带单位offset系列常用属性:offest系列属性 作用element.offsetParent 返回作为该元素带有定位的父级元素,如果父级元素都没有定位则返回bodyelement.offsetTop 返回元素相对带有定位父元素上方的偏移element.off原创 2020-05-30 11:10:12 · 127 阅读 · 0 评论 -
webapi4
Webapi3常用的键盘事件onkeyup 某个键盘按键被松开时触发onkeydown 某个键盘按键被按下时触发onkeypress 某个键盘按键被按下时触发,但它不识别功能键比如ctrl、shift箭头等。document.οnkeyup=function(){alert(‘我弹起了’);}document.addEventListener(‘keyup’,function(){alert(‘我弹起了’);})document.addEventListener(‘keydown’,原创 2020-05-29 10:26:51 · 173 阅读 · 0 评论 -
webapi3
WebAPI3删除节点node.removeChild(child)从DOM中删除一个节点,返回删除的节点删除熊大熊二光头强删除留言案例:javascript:;//阻止链接跳转 复制节点:node.cloneNode()括号为空或false,是浅拷贝,只复制标签不复制里面的内容for(var k in obj){k得到的是属性名obj[k]得到的是属性值}动态生成表格: </tbody></table><scr原创 2020-05-28 12:04:41 · 151 阅读 · 1 评论 -
webapi2
WebAPI2一.排他思想按钮1按钮2按钮3按钮4按钮5表单全选和取消案例: </tbody> </table></div><script>var j_cbAll=document.getElementById('j_cbAll');var j_tbs=document.getElementById ('j_tb').getElementsByTagName('input');j原创 2020-05-27 18:38:37 · 140 阅读 · 0 评论 -
WebAPI(2)
**WebAPI(2) 换肤案例;表格隔行变色;表单全选和取消案例;自定义属性案例;tab栏切换;节点操作案例;兄弟节点;发布留言案例**一.排他思想按钮1按钮2按钮3按钮4按钮5**表单全选和取消案例**: </tbody> </table></div><script>var j_cbAll=document.getElementById('j_cbAll');var j_t原创 2020-05-27 18:33:08 · 95 阅读 · 0 评论 -
Web APIS(1),分时显示不同图片,显示不同问候语案例;点击按钮改变文本框中的内容;仿京东显示密码;淘宝关闭二维码案;判断输入密码格式是否正确
Web APISJSECMAScript DoM BOMJS基础 Web APISAPI:应用程序编程接口Web API:浏览器提供的一套操作浏览器功能和页面元素的API一、DOM:1.DOM简介:文档对象模型,处理可拓展语言的标准编程接口。2.DOM树文档document元素element节点node3.获取元素:1)根据id获取:getElementById()2)根据标签名获取getElementByTagName()//返回带有标签名的对象的集合以伪数组的形原创 2020-05-26 18:20:23 · 612 阅读 · 0 评论 -
js之作用域、预解析、对象、内置对象、简单类型和复杂类型
js之作用域两种作用域全局作用域:整个js标签或一个单独的js文件局部作用域:只在函数内部起作用变量的作用域:全局变量、局部变量在函数内部没有声明直接赋值的变量也是全局变量函数的形参也可以看作是局部变量(节约内存资源)js预解析预解析:js引擎会把js里面所有的var还有function提升到当前作用域的最前面代码执行:从上往下,依次执行1)变量提升:只提升变量声明,不提升赋值操作2)函数提升:把所有的函数声明提升到函数的最前面,不调用函数js对象创建对象的三种方式:1)字面量原创 2020-05-25 18:27:49 · 103 阅读 · 0 评论 -
js之函数
js之函数1)声明函数function 函数名(){//函数体}2)调用函数函数名();var 变量名=function(){}3)函数不调用,自己不执行案例求1-100的累加和//声明函数function getSum(){var sum=0;for(var i=1;i<=100,i++){sum=sum+i;}console.log(sum);}//调用函数getSum();关于函数中形参个数跟实参个数的问题:function getSum(num1,nu原创 2020-05-25 10:12:08 · 96 阅读 · 0 评论 -
JS内置对象
JS中对象分为三大类:自定义对象、内置对象、浏览器对象 ECMAScript JS APIJS内置对象:JS自带的一些对象,这些对象供开发者使用,并提供了一些常用的或是最基本而必要的功能(属性和方法)常见的内置对象有:Math、Date、Array、String等查文档:MDN/W3C网址:https://developer.mozilla.org/zh-CN/...原创 2020-05-04 18:02:42 · 94 阅读 · 0 评论 -
遍历对象属性
遍历对象属性var obj={name:‘pink老师’,age:18,sex:‘男’fn:function(){}}for…in语句for(变量 in 对象){}for (var k in obj){console.log(k);//k变量输出得到的是属性名console.log(obj[k]);//obj[k]得到的是属性值}//for in 里面的变量喜欢用k或k...原创 2020-05-04 18:01:36 · 138 阅读 · 0 评论 -
构造函数和对象的相互联系,new关键字
构造函数:泛指的某一大类,类似于java中的类class对象:具体的事物用构造函数创建对象的过程也称为对象的实例化new关键字1.new构造函数在内存中创建了一个空的对象2.this就会指向刚才创建的空对象3.执行构造函数里面的代码给空对象添加属性和方法4.返回这个对象(所以构造函数不需要return)----------------------------------------...原创 2020-05-04 18:00:34 · 157 阅读 · 0 评论 -
JS中创建对象的三种方式
(obj[‘sex’]);obj.sayHi();2.3利用构造函数创建对象原因:前面两种创建对象的方法一次只能创建一个对象特点:封装的是对象,不是普通代码构造函数:把我们的对象里面一些相同的属性和方法抽象出来封装到函数里面function 构造函数名 (){this.属性=值;this.方法=function(){}}new 构造函数名( );function Star(...原创 2020-05-04 17:59:25 · 130 阅读 · 0 评论 -
(变量,属性)、(函数,方法)的相同点与不同点
1.变量和属性:相同点:都是用来存储数据的不同点:变量:单独声明并赋值,单独存在属性:在对象里面,不需要声明2.函数和方法的:相同点:都是实现某种功能,做某件事不同点:函数:单独声明并调用,函数名()单独存在方法:在对象里面调用的时候对象.方法()--------------------------------------------------------------------...原创 2020-05-04 17:55:22 · 471 阅读 · 0 评论