weixin_42943920的博客

原创 删除搜索框搜索记录

就删除成功，Chrome浏览器亲测有效。在想要删除的浏览记录条目上，按下。

原创 setup语法糖中父组件调用子组件的属性或方法

setup语法糖中父组件调用子组件的属性或方法

原创 setup语法糖中的props和emit

setup语法糖中的props和emit

原创 setup语法糖中的component组件无效

setup语法糖中component动态组件无效

原创 git stash无法暂存新建文件

git stash无法暂存新建文件默认情况下，git stash 命令只暂存 Git 已追踪的文件更改，不会暂存未追踪的文件和 .gitignore 文件中忽略的文件解决办法：使用git add 文件名 对新建文件进行追踪，再进行git stash 操作即可。如：git add club.vue 再git stash...

原创 关于git

git配置：git本地操作：1 git初始化2 查看暂存区和工作区的内容3 把工作区的内容添加到暂存区4 暂存区内容还原到工作区5 形成历史版本6 查看历史版本7 还原历史版本注意：id可通过git log查看git如何管理文件夹：上传到远程：第一次上传：步骤1：步骤2：步骤3：后续上传：拉取远程代码：第一次拉取远程仓库：后续拉取：git分支：1 创建分支：git branch 新分支名2 查看分支：git branch3 切换分

原创 关于webpack

认识webpackwebpack是一个前端资源打包工具，基于node环境运行，在webpack中，前端所有资源文件（js/html/css/json/scss）都会作为模块处理，打包成对应的静态资源。webpack提供了：----友好的模块化支持；----代码压缩混淆----处理js兼容问题----性能优化webpack作用：----对项目进行打包----可使用单页面应用程序的打包；----可打包多页面应用程序；webpack打包模式：+开发环境打包：-在开发过程中的打包规则，随时调试

原创 关于npm第三方包的下载配置

三方包的下载分为生产依赖包和开发依赖包

原创 关于sass

在css语法的基础上增加了变量、嵌套、混合、导入等高级功能sass文件后缀有两个， 一个是.sass 另一个是.scss区别：1 .sass没有{} 和 ;2 .sass都是通过换行或空格体现层级关系浏览器不能直接识别sass语法，需要一款sass编译工具sass工具下载：命令行输入指令： npm i sass -g查看是否安装成功： sass --version使用sass编译文件（sass或scss）实时编译一个sass文件：指令：sass --watch sass文件:css文件

原创 express中的send()方法和query属性-day85

/* express的res中已经封装好一个名叫send()方法 +res.send(返回给请求处的数据) +会自动转为json数据格式并返回 express的req中也封装好一个叫query属性 +会自动将get携带的所有参数解析并放在里面*/// 创建服务const express = require('express')let app = express()app.listen(8080,() => {console.log('服务开启成功');})

原创 使用express获取静态资源-day85

文件结构：代码：命令行中启动index.js浏览器输入地址：获取数据

原创 express接口设置-day85

/*express接口设置 基础方法： 1 app.use(函数) 所有请求进来都会执行这个函数 2 app.use(请求地址，函数) 只有满足接口请求的地址，才会执行函数 3 按照请求方式执行函数 app.get(接口地址，函数) //只有get请求，以/a开头的请求，才会执行这个函数*/ const express = require('express')// 创建服务let app = express()// 监听端口ap

原创 node操作mongodb的一些方法

/*详细操作mongodb数据库*/ // 导入包let mongoose = require('mongoose')// 2 连接数据库mongoose.connect('mongodb://localhost:27017/kd23',(err) => { if(err) return console.log(err); console.log('连接成功');})// 3 创建表结构let users = new mongoose.Schema({ // 对字段的

原创 node操作mongodb(day84)

关于mongodb：常见的数据库分类+关系型数据库(比如mysql) 可多表合一+非关系型数据库(比如mongodb) 不可多表合一安装mongoDB;启动mongodb命令行执行指令:mongod --dbpath 你定义的文件夹目录如: mongod --dbpath F:\Web\mongoData回车,黑窗口就是数据库为了启动数据库更加方便创建txt文件(mongodb.txt)在文件夹中输入启动指令: mongod.exe --dbpath F:\Web\mongoData

原创 页面渲染的两种方式

1 前后端分离+后端提供数据，前端使用ajax请求数据，再进行页面的组装和渲染2 服务端渲染+前端只负责浏览器打开页面，发送请求+服务端接收到请求后，在服务端准备好页面；+前端只需要提供一个浏览器，负责显示就好关于服务端渲染页面// +需要使用一个第三方模块 art-template(模板引擎)// +下载，命令行指令：npm install art-template// +导入： let template = require(‘art-template’)// 数据渲染的方法：//

原创 npm基本使用

包管理工具npm（Node Package Manager）包管理工具npm基本使用1 初始化+准备一个初始化配置文件，这个文件是项目的描述信息+打开命令行，切换目录到项目的根目录+输入指令 npm init 回车。输入配置信息-package name:项目名称，默认使用该文件夹名称-version 版本号 默认1.0.0-description: 项目描述-entry point: (index.js) 入口js文件（启动js文件） 默认是index.js-test command:

原创 nodejs完成从163邮箱发送邮件到qq邮箱

/* 发送邮件 第三方模块nodemailer专门用于发送邮件 1 下载 命令行下载：npm install nodemailer 2 在需要使用的文件中导入下载的第三方模块 + let nodemailer = require('nodemailer'); 3 按照规则使用 +三方包学习网站 npmjs.com +使用导入的nodemailer来创建一个发送器 +语法：nodemailer.createTransport({

原创 nodejs基础

nodejs介绍:为什么浏览器可以运行js代码,因为浏览器有js解析引擎 !将浏览器引擎单独拿出来,做成一个软件,叫node,目的是使用js写后端什么是node一款基于chrome v8 解析引擎运行js代码时的环境node作用-当js代码引入到html中,在浏览器中运行的时候,叫做前端js,用来操作DOM和BOW,完成网页特效-当js代码通过node软件运行的时候,没有DOM和BOM的操作,而是读取电脑硬盘 读写文件 操作数据库等;-可以当作电脑系统和数据库的时候,就可以当作服务器来使用

原创 node创建一个就简单的服务器

写一个简单的服务器；支持html css 和 js文件目录结构1 index.js中导入模块// 1 导入模块let http = require('http')let fs = require('fs')let path = require('path')let url = require('url')2 index.js中创建服务// 2 再次创建服务器 let server = http.createServer((req,res) => { let urlStr

原创 jQuery的常见选择器和筛选器

关于jQuery是前端方法库特点：1 优质的选择器和筛选方法2 好用的饮食迭代3 强大的链式编程jQuery向外暴露两个变量：jQuery和$ (jQuery === $)选择器// jQuery选择器 $(选择器) 返回元素集合 // id选择器 console.log($('#li3')); // jQuery.fn.init(1) // 类选择器 console.log($('.c1')); // 标签选择器 console.log($('li')); /

原创 JS解决鼠标一直触发某个动画，导致动画效果一直展示

在动画中，常常有这样的问题，比如某个元素有鼠标悬停的动画，如果鼠标在短时间内不断移入移出，动画效果会来不及反应，短时间积累多次触发效果，导致，鼠标移除后，触发效果依然在继续。为了解决这个问题：可使用jQuery中的动画停止函数stop(),在鼠标移入移出函数中，添加$(元素).stop()例如：...

原创 JS中jq实现手风琴图片展示

4张图片在一个盒子中展示，鼠标移入哪一张图片，该图片便展开显示，其他图片折叠；鼠标移出后四张图片平分黑子宽度// 手风琴// ul宽度640,鼠标移出的效果是每张图片width=160// 鼠标移入li,该liwidth=520,其他liwidth=(640-520)/3=40$('ul>li').hover(function(){ // 鼠标移入 // $(this).css('width',520).siblings().css('width',40) // 向将其他liw

原创 JS中使用jq方法实现二级菜单的切换和隐藏

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l.

原创 JS中使用jq方法，完成图片放大和移动的效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l.

原创 JS中使用jQuery实现高亮展示

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l.

原创 点击小图标，展示大图标和对应title

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l.

原创 JS中阻止事件冒泡或阻止链接跳转的操作

可通过return false阻止事件冒泡或阻止链接跳转的操作//在处理函数中使用return false;

原创 JS中闭包

闭包函数条件：// 1 在函数A内部返回函数B// 2 在函数B中访问函数A的私有作用域变量intNum// 3 在函数A外部,有变量引用函数B（调用函数A，执行结果就是函数B，引用f1，实际上就是引用函数B）function A(){ var intNum = 100; return function B(){ var num = intNum; return num } } let f1 = A(); // 发

原创 关于函数的定义、调用和执行

认识函数（定义-执行-销毁（执行空间））1-先定义2-再调用在JS函数中，数值是先赋值，再进预解析function fn(a){ console.log(a); function a(){} } fn(100);//ƒ a(){} 说明在函数中，先赋值，再进行预解析一个不销毁的执行空间在函数执行空间中，函数代码执行结束，则执行空间销毁，函数内的变量也会销毁；若想要保存函数内的变量，怎么办？答：在函数内返回一个引用数据类型(数组、对象、函数)，并且

原创 JS中点击下面button的按钮，实际获取上面input的值，获取兄弟元素

//转为number类型后，增加1let number = target.previousElementSibling.value - 0 + 1;

原创 通过CSS完成禁用和点击无效的操作

img元素不对指针做出反应.list>li>.show>img{ /* img元素不对指针做出反应 */ pointer-events: none;}通过 /* 禁用 */ cursor: not-allowed;

原创 JS中的鼠标穿透事件

img元素不对指针做出反应.list>li>.show>img{ /* img元素不对指针做出反应 */ pointer-events: none;}通过 /* 禁用 */ cursor: not-allowed;

原创 JS通过元素.dataset.xxx方式获取属性

原创 JS中一个ul中li点击事件，改变另一个ul中的li

原创 关于获取li标签的数据类型datatype

原创 JS中点击分类后，重新请求列表数据

// 切换分类事件category.addEventListener('click',e => { e = e || window.event; let target = e.target; // li标签及其内容 // 判断点击的对象是li if(target.nodeName === 'LI'){ // 切换类名 // ...category.children 是所有li的伪数组 // 可通过展开运算符...，放到中括号中，作为数组 // cons

原创 JS中点击ul中的li，切换样式

// category ul的类名// 所有li的点击事件，可都委托给ulcategory.addEventListener('click',e => { e = e || window.event; let target = e.target; // li标签及其内容 // 判断点击的对象是li if(target.nodeName === 'LI'){ // 切换类名 // ...category.children 是所有li的伪数组 // 可通过展开运

原创 JS渲染商品列表

原创 JS渲染数据到ul中

原创 JS中p标签多余内容用省略号显示

.list>li>.info>.title{ font-size: 14px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}