- 博客(45)
- 收藏
- 关注
原创 css实现圆角渐变边框
border: 0.02rem solid transparent; background-origin: border-box; background-image: $selectBtnColor, $selectBorderColor; background-clip: content-box, border-box; 效果:
2020-11-10 21:55:23 497
原创 09-网络模块http、服务器搭建、express
HTTP1、协议及协议栈的基本概念1.1、什么是协议协议是网络中计算机或设备之间进行通信的一系列规则的集合。常用协议有IP、TCP、HTTP、POP3、SMTP等。1.2、什么是协议栈在网络中,为了完成通信,必须使用多层上的多种协议。这些协议按照层次顺序组合在一起,构成了协议栈(Protocol Stack),也称为协议族(Protocol Suite)。1.3、协议的作用一个网络协议的作用主要有两个:一是建立对等层之间的虚拟通信,二是实现层次之间的无关性。1.4、层次间的无关性所谓层次间
2020-09-09 13:29:05 1797
原创 08-Buffer
Buffer初识在引入 TypedArray 之前,JavaScript 语言没有用于读取或操作二进制数据流的机制。 Buffer 类是作为 Node.js API 的一部分引入的,用于在 TCP 流、文件系统操作、以及其他上下文中与八位字节流进行交互。这是来自 Node.js 官网的一段描述,比较晦涩难懂,总结起来一句话 Node.js 可以用来处理二进制流数据或者与之进行交互。Buffer 用于读取或操作二进制数据流,做为 Node.js API 的一部分使用时无需 require,用于操作网络协议
2020-09-09 11:43:52 591
原创 07-事件event、node进程、路径模块path
事件eventNode.js 事件循环Node.js 是单进程单线程应用程序,但是因为 V8 引擎提供的异步执行回调接口,通过这些接口可以处理大量的并发,所以性能非常高。Node.js 几乎每一个 API 都是支持回调函数的。Node.js 基本上所有的事件机制都是用设计模式中观察者模式实现。Node.js 单线程类似进入一个while(true)的事件循环,直到没有事件观察者退出,每个异步事件都生成一个事件观察者,如果有事件发生就调用该回调函数.事件驱动程序Node.js 使用事件驱动模型
2020-09-09 11:41:37 229
原创 06-文件系统模块
文件系统(File System)fs模块(系统内置模块 主要用来操作文件)1. 写入提供同步异步两种选择(同步的方法 都是在异步方法后面加上 Sync)同步导致阻塞异步操作完成通过回调返回结果1.1 同步写入操作let fs = require("fs");//同步打开文件let fd = fs.openSync('text_1', 'w');console.log(fd)//写入内容fs.writeFileSync(fd, 'hello ink!');//退出fs.
2020-09-08 20:56:07 237
原创 05-node模块化
node 的模块运行机制1.CommonJS 的规范CommonJS 的规范,包括模块引用,模块定义,模块标识,3个部分模块引用: 模块通过require方法来同步加载所依赖的模块模块定义: 在node中一个文件就是一个模块,提供exports对象导出当前模块的方法或变量模块标识: 模块标识传递给require()方法的参数,可以是按小驼峰(camelCase)命名的字符串,也可以是文件路径。1.1.node 模块中CommonJS 的应用模块内容导出两种方式:a.js的内容如下,**方
2020-09-08 16:14:00 249
原创 04-npm使用介绍
1. NPM 使用介绍什么是 NPM?NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:允许用户从NPM服务器下载别人编写的第三方包到本地使用。允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。由于新版的nodejs已经集成了npm,所以之前npm也一并安装好了。同样可以通过输入"npm -v"来测试是否成功安装。命令如下,出现版本提示表示安装成功:
2020-09-08 15:31:41 220
原创 03-交互式解释器
Node.js REPL(交互式解释器)Node.js REPL(Read Eval Print Loop:交互式解释器) 表示一个电脑的环境,类似 Window 系统的终端或 Unix/Linux shell,我们可以在终端中输入命令,并接收系统的响应。REPL 的交互式的编程环境可以实时的验证你所编写的代码,非常适合于验证 Node.js 和 JavaScript 的相关 API。Node 自带了交互式解释器,可以执行以下任务:读取 - 读取用户输入,解析输入了Javascript 数据结构并
2020-09-08 15:15:29 149
原创 02-Node.js环境安装
1. Node.js 安装配置向大家介绍在window和Linux上安装Node.js的方法。本安装教程以Node.js v0.10.26 版本为例。Node.js安装包及源码下载地址为:http://www.nodejs.org/en/download/。根据不同平台系统选择你需要的Node.js安装包。注意:Linux上安装Node.js需要安装Python 2.6 或 2.7 ,不建议安装Python 3.0以上版本。2. Windowv 上安装Node.jsWindows 安装包(
2020-09-08 15:02:31 116
原创 01-Node.js简介
1. Node.js是什么?Node.js是一个Javascript运行环境(runtime)。实际上它是对Google V8引擎进行了封装。V8引 擎执行Javascript的速度非常快,性能非常好。Node.js对一些特殊用例进行了优化,提供了替代的API,使得V8在非浏览器环境下运行得更好。Node.js是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动, 非阻塞I/O 模型而得以轻量和高效,非常适合在分布式设
2020-09-08 14:48:36 338
原创 ES6-类、类的继承
1.面向过程与面向对象1.1面向过程面向过程就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候再一个一个的依次调用就可以了。1.2面向对象面向对象是把事务分解成为一个个对象,然后由对象之间分工与合作。1.3面向过程与面向对象对比面向过程面向对象优点性能比面向对象高,适合跟硬件联系很紧密的东西,例如单片机就采用的面向过程编程。易维护、易复用、易扩展,由于面向对象有封装、继承、多态性的特性,可以设计出低耦合的系统,使系统 更加灵活、更加易于
2020-09-07 11:21:17 178 1
原创 ES6-ES6概念、新增语法、内置对象拓展
ES6相关概念什么是ES6ES 的全称是 ECMAScript , 它是由 ECMA 国际标准化组织,制定的一项脚本语言的标准化规范。为什么使用 ES6 ?每一次标准的诞生都意味着语言的完善,功能的加强。JavaScript语言本身也有一些令人不满意的地方。变量提升特性增加了程序运行时的不可预测性语法过于松散,实现相同的功能,不同的人可能会写出不同的代码ES6新增语法letES6中新增了用于声明变量的关键字let声明的变量只在所处于的块级有效 if (true) {
2020-09-07 11:08:28 132
原创 JS高级-this、严格模式、闭包、递归
1.函数的定义和调用1.1函数的定义方式方式1 函数声明方式 function 关键字 (命名函数)function fn(){}方式2 函数表达式(匿名函数)var fn = function(){}方式3 new Function()var f = new Function('a', 'b', 'console.log(a + b)');f(1, 2);var fn = new Function('参数1','参数2'..., '函数体')注意/*Function
2020-09-07 10:44:45 149
原创 JS高级-构造函数和原型、继承、ES5新增方法
1.构造函数和原型1.1对象的三种创建方式字面量方式var obj = {};new关键字var obj = new Object();构造函数方式function Person(name,age){ this.name = name; this.age = age;}var obj = new Person('zs',12);1.2静态成员和实例成员1.2.1实例成员实例成员就是构造函数内部通过this添加的成员 如下列代码中uname age sin
2020-09-07 10:29:04 202
原创 jQuery-介绍、选择器、样式操作、动画、属性操作、元素操作、位置、事件、插件
1. jQuery 介绍1.1. JavaScript 库 JavaScript库:即 library,是一个封装好的特定的集合(方法和函数)。从封装一大堆函数的角度理解库,就是在这个库中,封装了很多预先定义好的函数在里面,比如动画animate、hide、show,比如获取元素等。简单理解: 就是一个JS 文件,里面对我们原生js代码进行了封装,存放到里面。这样我们可以快速高效的使用这些封装好的功能了。比如 jQuery,就是为了快速方便的操作DOM,里面基本都是函数(方法)。1.2. j
2020-09-02 20:21:15 290
原创 26-正则表达式
正则表达式简介定义:正则表达式用于定义一些字符串的规则。作用:计算机可以根据正则表达式,来检查一个字符串是否符合指定的规则;或者将字符串中符合规则的内容提取出来。如果你想查看正则更多的内容,可以查阅官方文档关于 RegExp 这个内置对象的用法。创建正则表达式的对象方式一:使用构造函数创建正则表达式的对象语法: var 变量 = new RegExp("正则表达式"); // 注意,参数是字符串 var 变量 = new RegExp("正则表达式", "匹配模式"); // 注意,两个参
2020-08-25 09:09:35 437
原创 JS-25-offset、scroll、client的相关属性
offset 系列offset 翻译过来就是偏移量, 我们使用 offset系列相关属性可以动态的得到该元素的位置(偏移)、大小等。获得元素距离带有定位父元素的位置获得元素自身的大小(宽度高度)注意:返回的数值都不带单位下面分别介绍。1、offsetWidth 和 offsetHightoffsetWidth 和 offsetHight:获取元素的宽高 + padding + border,不包括margin。如下:offsetWidth = width + padd
2020-08-16 15:22:27 228
原创 JS-24-移动端触摸事件
触屏事件概述移动端浏览器兼容性较好,我们不需要考虑以前 JS 的兼容性问题,可以放心的使用原生 JS 书写效果,但是移动端也有自己独特的地方。比如触屏事件 touch(也称触摸事件),Android 和 IOS 都有。touch 对象代表一个触摸点。触摸点可能是一根手指,也可能是一根触摸笔。触屏事件可响应用户手指(或触控笔)对屏幕或者触控板操作。常见的触屏事件<script> var body = document.querySelector("body")
2020-08-15 19:15:12 155
原创 JS-23-ajax
简介Ajax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术。Ajax = 异步 JavaScript 和 XML 或者是 HTML(标准通用标记语言的子集)。Ajax 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。传统的网页(不使用 Aja
2020-08-14 13:00:34 255
原创 JS基础-22-HTTP和HTTPS协议
HTTP与HTTPS 一、前言:先来观察这两张图,第一张访问域名http://www.12306.cn,谷歌浏览器提示不安全链接,第二张是https://kyfw.12306.cn/otn/regist/init,浏览器显示安全,为什么会这
2020-08-12 21:30:02 1982
原创 JS基础-21-audio、video的一些属性和方法
属性src:音频资源地址controls:是否显示控制器autoplay:自动播放(浏览器禁用了)muted:静音volume:音量currentTime:可以设置和获取当前播放到的时间点方法play :播放pause:暂停事件onpause:暂停事件onplay:播放事件onplaying:正在播放事件onvolumchange:音量改变...
2020-08-10 23:16:48 485
原创 JS基础-19-BOM
BOM什么是BOM BOM(Browser Object Model)即浏览器对象模型,它提供了独立于内容而与浏览器窗口进行交互的对象,其核心对象是 window。 BOM 由一系列相关的对象构成,并且每个对象都提供了很多方法与属性。 BOM 缺乏标准,JavaScript 语法的标准化组织是 ECMA,DOM 的标准化组织是 W3C,BOM 最初是Netscape 浏览器标准的一部分。BOM的构成BOM 比 DOM 更大,它包含 DOM。顶级对象windowwindow对象的常
2020-08-09 12:45:39 168
原创 移动端rem布局适配方案
移动web开发之rem布局rem基础rem单位rem (root em)是一个相对单位,类似于em,em是父元素字体大小。不同的是rem的基准是相对于html元素的字体大小。比如,根元素(html)设置font-size=12px; 非根元素设置width:2rem; 则换成px表示就是24px。/* 根html 为 12px */html { font-size: 12px;}/* 此时 div 的字体大小就是 24px */ div { font-size:
2020-08-09 12:12:21 1094
原创 JS基础-18-addEventListener和冒泡
绑定事件的两种方式/DOM事件的级别方式一:onclick element.onclick = function () { }举例:<body><button>点我</button><script> var btn = document.getElementsByTagName("button")[0]; //这种事件绑定的方法容易被层叠。 btn.onclick = function () {
2020-08-03 08:47:22 1294
原创 JS基础-17-事件
事件简介事件:就是文档或浏览器窗口中发生的一些特定的交互瞬间。对于 Web 应用来说,有下面这些代表性的事件:点击某个元素、将鼠标移动至某个元素上方、关闭弹窗等等。JavaScript 是以事件驱动为核心的一门语言。JavaScript 与 HTML 之间的交互是通过事件实现的。事件的三要素事件源(谁):触发事件的元素事件类型(什么事件): 例如 click 点击事件事件驱动程序(做啥):事件触发后要执行的代码(函数形式),事件处理函数案例代码<body> <b
2020-08-02 09:18:50 206
原创 JS基础-16-DOM节点操作
常见概念JavaScript的组成JavaScript基础分为三个部分:ECMAScript:JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。DOM:文档对象模型(Document object Model),操作网页上的元素的API。比如让盒子移动、变色、轮播图等。BOM:浏览器对象模型,操作浏览器部分功能的API。比如让浏览器自动滚动。节点节点(Node):构成 HTML 网页的最基本单元。网页中的每一个部分都可以称为是一个节点,比如
2020-08-01 12:39:34 360
原创 JS基础-15-内置对象:Date/Math
内置对象简介内置对象就是指这个语言自带的一些对象,供开发者使用,这些对象提供了一些常用的或是最基本而必要的功能。JavaScript的内置对象:内置对象对象说明Arguments函数参数集合Array数组Boolean布尔对象Date日期时间Error异常对象Function函数构造器Math数学对象Number数值对象Object基础对象RegExp正则表达式对象String字符串对象内置对象
2020-07-29 23:12:18 252
原创 JS基础-14-内置对象:String
内置对象属性方法基本数据类型不能绑定属性和方法1、基本数据类型:注意,基本数据类型string是无法绑定属性和方法的。比如说: var str = "qianguyihao"; str.aaa = 12; console.log(typeof str); //打印结果为:string console.log(str.aaa); //打印结果为:undefined上方代码中,当我们尝试打印str.aaa的时候,会发现打印结果为:undefined。也就是说
2020-07-29 23:03:12 216
原创 JS基础-13-包装类
包装类包装类的介绍我们都知道,js中的数据类型包括以下几种。基本数据类型:String、Number、Boolean、Null、Undefined引用数据类型:ObjectJS为我们提供了三个包装类:String():将基本数据类型字符串,转换为String对象。Number():将基本数据类型的数字,转换为Number对象。Boolean():将基本数据类型的布尔值,转换为Boolean对象。通过上面这三个包装类,我们可以将基本数据类型的数据转换为对象。代码
2020-07-29 22:26:44 132
原创 JS基础-12-数组
数组简介数组(Array)是属于内置对象,我们可以在MDN网站上查询各种方法。数组和普通对象的功能类似,也是用来存储一些值的。不同的是:普通对象是使用字符串作为属性名的,而数组是使用数字来作为索引来操作元素。索引:从0开始的整数就是索引。数组的存储性能比普通对象要好。在实际开发中我们经常使用数组来存储一些数据,使用频率非常高。数组的基本操作数组的元素可以是任意的数据类型,也可以是对象,也可以是函数,也可以是数组。数组的元素中,如果存放的是数组,我们就称这种数组为二维数组。创建数组对象方
2020-07-29 21:48:34 588
原创 css实现移动端tab标签滑动效果
Box { overflow-x: auto; /* 横向溢出滚动 */ white-space: nowrap; /* 溢出不换行 */}Box::-webkit-scrollbar { Display:none; /* 隐藏滚动条,webkit内核浏览器中有效(Chrome,Safari)*/}
2020-07-27 17:15:03 2287
转载 A页面跳转到B页面后打开指定tab标签
A页面:<!DOCTYPE html><html lang="en" class="no-js"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> </head&g
2020-07-27 14:11:22 881 2
原创 JS基础-11-原型对象
原型对象原型的引入 function Person(name, age, gender) { this.name = name; this.age = age; this.gender = gender; //向对象中添加一个方法 this.sayName = function () { console.log("我是" + this.na
2020-07-26 22:00:56 173
原创 JS基础-10-对象的创建&构造函数
创建自定义对象的几种方法方式一:对象字面量对象的字面量就是一个{}。里面的属性和方法均是键值对。例如:var o = { name: "生命壹号", age: 26, isBoy: true, sayHi: function() { console.log(this.name); } };console.log(o);控制台输
2020-07-26 19:43:35 361
原创 JS基础-09-this
this解析器在调用函数每次都会向函数内部传递进一个隐含的参数,这个隐含的参数就是this,this指向的是一个对象,这个对象我们称为函数执行的 上下文对象。根据函数的调用方式的不同,this会指向不同的对象:【重要】1.以函数的形式调用时,this永远都是window。比如fun();相当于window.fun();2.以方法的形式调用时,this是调用方法的那个对象3.以构造函数的形式调用时,this是新创建的那个对象4.使用call和apply调用时,this是指定的那个对
2020-07-26 12:45:59 89
原创 JS基础-08-对象简介和对象的基本操作
面向对象简介对象的作用是:封装信息。比如Student类里可以封装学生的姓名、年龄、成绩等。对象具有特征(属性)和行为(方法)。面向对象:可以创建自定义的类型,很好的支持继承和多态。面向对象的特征:封装、继承、多态。对象简介基本数据类型和引用数据类型的对比基本数据类型(值类型):String 字符串、Number 数值、Boolean 布尔值、Null 空值、Undefined 未定义。引用数据类型(引用类型):Object 对象。基本数据类型:基本数据类型的值直接保存在栈内
2020-07-26 10:26:43 190
原创 JS基础-07-作用域
作用域(Scope)的概念作用域指一个变量的作用范围。在js中,一共有两种作用域:全局作用域函数作用域全局作用域直接编写在script标签中的JS代码,都在全局作用域。全局作用域在页面打开时创建,在页面关闭时销毁。在全局作用域中有一个全局对象window,它代表的是一个浏览器的窗口,它由浏览器创建我们可以直接使用。在全局作用域中:创建的变量都会作为window对象的属性保存。创建的函数都会作为window对象的方法保存。全局作用域中的变量都是全局变量
2020-07-25 23:15:16 107
原创 JS基础-06-函数
函数的介绍函数:就是将一些功能或语句进行封装,在需要的时候,通过调用的形式,执行这些语句。函数也是一个对象使用typeof检查一个函数对象时,会返回function函数的作用:将大量重复的语句写在函数里,以后需要这些语句的时候,可以直接调用函数,避免重复劳动。简化编程,让编程模块化。来看个例子: console.log("你好"); sayHello(); // 调用函数 // 定义函数 function sayHello(){ console.log("
2020-07-25 21:42:29 163
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人