sharp_wu-CSDN博客

原创 css 模拟手机充电水滴效果

看个效果图，没办法搞gif魔法师开始表演万能的div出场 <div class="container"> <div class="drop"></div> <div class="drop"></div> <div class="drop"></div> <div class="collection"></div> <sp

2021-01-14 15:18:45 477

单行省略文字超出盒子大小时，会溢出自动换行然而我们只想在一行上显示，多余部分变成省略号，需要如何处理呢？css魔法师登场设置一个长为100px的div<div class="content">Do you like driving ?</div> .content { width: 100px; border: 1px solid #ccc; }魔法师药剂overflow: hidden; // 超出部

2021-01-13 18:18:01 507

原创 Linux CentOS mysql数据库基本命令导入sql文件

进入数据库mysql -u用户 -p密码#例子：mysql -uroot-p123456展示所有库show database创建数据库create database xxx#示例create database test进入数据库use xxx#示例use test查看表show tables创建表CHAR(10) 数据格式PRIMARY KEY 主键NOT NULL 不为空CREATE TABLE 表名( 列名类型约束条件,)#示例CR

2021-01-13 16:12:12 564

原创 CSS 实现炫酷的动态背景效果

活不多说，直接开始效果图：HTML：一个万能的div <div class="bgc"></div>主要是css部分使用background属性纯色线性渐变(linear-gradient)径向渐变(radial-gradient)角向渐变(conic-gradient)多重线性渐变(repeating-linear-gradient)多重径向渐变(repeating-radial-gradient)多重角向渐变(repeating-conic-

2021-01-09 11:23:42 5608 1

原创 JS 字符串常用方法

字符串常用方法length 字符串长度这个相对简单，不多赘述const str = 'hello shadiao';console.log(str.length); // 13还有另一种方法，使用 … 扩展运算符const str = 'hello shadiao';console.log([...str].length); // 13split 分割字符串为数组split 方法将字符串分割为数组，参数为以XXX分割const str = 'hello shadiao';conso

2021-01-04 16:07:39 205 1

原创 css3之3d动画呈现

利用css3完成3d效果的简单呈现动画效果用图片呈现不出来，大家自己动手写一个看看吧新建html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title&gt

2020-12-25 18:39:45 199

原创 css3动画完成打字机效果

新建一个html文件<!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><body> <div cl

2020-12-25 16:47:21 697 4

原创前端打包工具webpack的概念及基本使用、配置文件webpack.config.js、loader、plugins、图片资源打包、代码热更新

webpack概念本质上，webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。从 webpack v4.0.0 开始，可以不用引入一个配置文件。然而，webpack 仍然还是高度可配置的。在开始前你需要先理解四个核心概念：入口(entry)输出(outpu

2020-12-24 20:40:51 325 1

原创最近被吞噬星空动漫吸引，那就愉快的爬取一下小说看看吧！----Python爬虫

作为一个国产动漫迷，前几天的斗罗，实在太震撼了吞噬星空作为后来者，也不赖。那就让我们来爬取他的小说吧！前期准备使用Python requests发送请求，xpath解析数据所以没有安装以上两个模块的小伙伴，安装一下咯：pip install requestspip install lxml踩点小说网站找到一个可以免费看吞噬星空的网站https://www.biqumo.com/8_8497F12 研究一下网页源码，如下图所示：dd标签就是各章节的目录及链接。进入章节详情页，分别找到

2020-12-23 15:26:34 851

原创 Python爬虫增量式爬虫通用爬虫聚焦爬虫

爬虫分类通用爬虫聚焦爬虫增量式爬虫通用爬虫和聚焦爬虫之前的博客有讲解过了，本篇主要讲解增量式爬虫增量式爬虫概念：检测网站数据更新的情况，只会爬取最新更新的数据适用于持续跟踪网站的数据爬取。例如三个月前，爬取了所有数据。网站更新了100条数据，此时爬取跟新的100条数据即可。...

2020-12-19 13:42:32 645 2

原创 Python爬虫 scrapy框架（五）分布式爬虫 scrapy-redis

scrapy框架分布式爬虫概念搭建一个分布式的机群，让其对一组资源进行分布联合爬取作用提升爬取数据的效率实现原生的scrapy是不可以实现分布式爬虫的，必须结合着scrapy-redis组件一起实现分布式爬虫。调度器不可以被分布式机群共享管道不可以被分布式机群共享安装scrapy-redis组件 pip install scrapy-redisscrapy-redis作用：可以给原生的scrapy框架提供可以被共享的管道和调度器实现流程创建一个工程创建一个基于Cr

2020-12-17 18:28:50 294

原创 Python爬虫 scrapy框架（四）CrawlSpider 链接提取器 LinkExtractor 规则解析器 Rule

scrapy框架CrawlSpiderCrawlSpider：基于Spider的子类，继承父类的功能，且派生出自己的功能。全站数据爬取的方式基于Spider：手动请求发送基于CrawlSpider：基本使用创建一个工程scrapy startproject quanzhanPro切换到工程目录cd quanzhanPro创建一个基于CrawlSpider类的爬虫文件scrapy genspider -t crawl quanzhan wz.sun0769.com/politi

2020-12-17 15:59:49 1086 7

原创 Python爬虫 scrapy框架（三）中间件爬虫/下载中间件拦截请求/响应爬取网易新闻的新闻数据

scrapy框架中间件爬虫中间件 MiddleproSpiderMiddleware下载中间件 MiddleproDownloaderMiddleware爬虫中间件位于引擎和爬虫之间class MiddleproSpiderMiddleware: # Not all methods need to be defined. If a method is not defined, # scrapy acts as if the spider middleware does not

2020-12-16 20:10:34 2529

原创 Python爬虫 scrapy框架（二）全站数据爬取五大核心组件请求传参meta 爬取图片ImagesPipeline 反爬机制：图片懒加载

scrapy框架基于Spider全站数据爬取将网站中某板块下的全部的页码对应的页面数据进行爬取。实现方式：将所有页码的url添加到start_urls 列表（不推荐）自行手动进行请求的发送（推荐） yield scrapy.Request(url=new_url, callback=self.parse) #callback 用于数据解析案例爬取 www.521609.com/tuku/mxxz/index.html 下所有页码的图片名称scrapy startproject xh

2020-12-16 15:26:36 535 1

原创 Python爬虫 scrapy框架（一）基本使用数据解析持久化存储

什么是框架集成了很多功能，并且具有很强通用性的一个项目模板。（或理解成一个项目的半成品）scrapy框架爬虫中封装好的一个明星框架。功能：高性能的持久化存储操作异步的数据下载高性能的数据解析分布式环境安装Mac & Linuxpip isntall scrapyWindows1、 wheelpip install wheel2、下载Twisted(科学上网)https://www.lfd.uci.edu/~gohlke/pythonlibs/#twisted

2020-12-16 10:52:57 498

原创 Python selenium自动化模拟12306登录验证码识别滑动滑块

模拟12306登录验证码识别平台本次选择超级鹰https://www.chaojiying.com/12306 验证码识别价格体系注册充值之后生成软件id（一元即可）下载官方demo官方demo.py#!/usr/bin/env python# coding:utf-8import requestsfrom hashlib import md5class Chaojiying_Client(object): def __init__(self, usernam

2020-12-15 14:55:47 3168 15

原创 Python selenium自动化无头浏览器

selenium模块与爬虫的联系便捷的获取网站中动态加载的数据便捷的实现模拟登入定义基于浏览器自动化的模块。使用流程安装环境pip install selenium下载浏览器的驱动程序以下以谷歌浏览器为例：http://chromedriver.storage.googleapis.com/index.html下载对应版本的驱动实例化浏览器对象from selenium import webdriverdriver = webdriver.Chrome(execut

2020-12-14 20:57:21 5394

原创 Python爬虫 asyncio异步编程协程事件循环、async、await、Task、Ruture

asyncio异步编程event_loop 事件循环：相当于一个无限循环，我们可以把一些函数注册到这个事件循环上，当满足条件时，就会调用对应的处理方法。coroutine 协程：协程对象，只一个使用async关键字定义的函数，他的调用不会立即执行函数，而是会返回一个协程对象。协程对象需要注册到事件循环中，由事件循环调用。task 任务：一个协程对象就是一个原生可以挂起的函数，任务则是对协程的进一步封装，其中包含任务的各种状态。future：代表将来执行或没有执行的任务结果。它与task没有本质的区

2020-12-14 15:40:33 1019 2

原创 Python爬虫协程 greenlet yield asyncio async&await

异步编程

2020-12-11 14:50:02 275

原创 Python爬虫代理

代理反扒机制：封IP当某一个IP请求一个门户网站单位时间的次数达到一个阈值时，门户网站可能采取一些反爬措施，限制当前IP访问，拒绝访问。反反爬机制：代理（破解封IP反爬机制）定义：代理服务器：本机请求网站发送给代理服务器，代理服务器中转向web服务器请求，此时web服务器上请求的IP就不是本机的IP，而是代理服务器的IP。从而实现破解封IP的反爬机制。作用突破自身IP访问的限制隐藏自身真实的IP，免受攻击第三方代理快代理西祠代理www.goubanjia.com代理类型

2020-12-09 15:19:46 308

原创 Python爬虫反爬机制：验证码识别基于cookie登录：session会话对象

验证码识别反爬机制：验证码验证码是门户网站使用的一种反爬机制。识别验证码图片中的数据，用于模拟登录操作。识别验证码方式人工肉眼识别（不推荐，效率低）第三方自动识别第三方自动识别超级鹰收费的，不能白嫖了，量力而行吧http://www.chaojiying.com/tesserocr穷逼的我选择这个-_-tesserocr 是 Python 的一个 OCR 识别库tesserocr其实是对 tesseract 做的一层 Python API 封装，所以它的核心是 tess

2020-12-08 19:26:54 883

原创 Python爬虫数据解析（聚焦爬虫）正则、BS4、Xpath

数据解析（聚焦爬虫）聚焦爬虫：爬取页面中指定的页面内容。聚焦爬虫的编码流程：指定url发起请求获取响应数据数据解析持久化存储建立在通用爬虫基础之上，先爬取整个页面，之后进行指定局部的数据进行提取。这个提取的过程就称之为数据解析数据解析分类：正则bs4Xpath（最通用的，重点）数据解析原理：解析的局部内容基本上会存储在标签之间或标签的属性中；进行指定的标签定位标签之间或标签的属性中存储的数据进行提取（解析）爬取图片数据content 二进制数据text 文

2020-12-08 13:45:37 763

原创 Python爬虫网络请求 requests（get、post）

Python网络请求模块urllibUrllib 库，它是 Python 内置的 HTTP 请求库，也就是说我们不需要额外安装即可使用，它包含四个模块第一个模块 request，它是最基本的 HTTP 请求模块，我们可以用它来模拟发送一请求，就像在浏览器里输入网址然后敲击回车一样，只需要给库方法传入 URL 还有额外的参数，就可以模拟实现这个过程了。第二个 error 模块即异常处理模块，如果出现请求错误，我们可以捕获这些异常，然后进行重试或其他操作保证程序不会意外终止。第三个 parse 模块是

2020-12-07 13:57:54 5075 1

原创 HTTP协议、HTTPS协议、加密方式

HTTP超文本传输协议—服务器与客户端进行数据交互的一种形式常用请求头User-Agent请求载体（浏览器）的身份标识包含当前操作系统的版本、当前浏览器的版本Connection请求完毕后，是保持连接还是断开连接closekeep-alive常用响应头Content-Type服务器响应回客户端的数据类型常见的媒体格式类型如下：text/html ： HTML格式text/plain ：纯文本格式text/xml ： XML格式image/gif ：gif图片格式i

2020-12-05 11:14:00 1057

原创 ES11语法特性私有属性 Promise.allSettled String.prototype.matchAll 可选链操作符动态import BigInt类型绝对全局对象globalThis

ES11私有属性私有属性只允许在类的内部调用，不允许在在类中，使用#变量名定义私有属性 class Person { name; #age; #weight; constructor(name, age, weight) { this.name = name; this.#age = age; this.#weight = weight; }

2020-12-02 19:11:37 488

原创 ES10语法特性 fromEntries trimStart trimEnd flat flatMap Symbol.prototype.description

ES10对象扩展方法 fromEntriesES8 中 entries 将对象转化为二维数组 console.log(Object.entries({ name: 'root', password: 'root' }));ES10 中 fromEntries将二维数组转化为对象1.二维数组 const result = Object.fromEntries([ ['name', 'root'], ['password', 'root']

2020-12-02 13:00:08 144

原创 ES9语法特性对象展开（rest、扩展运算符）正则扩展

ES9对象展开：rest参数、扩展运算符rest参数与扩展运算符于ES6已经引入使用，但只针对数组在ES9中，为对象提供了和数组一样的rest、扩展运算符rest参数之前的参数一一对应，剩余的参数全部储存在rest参数数组中。 const connect = ({ host, port, ...userInfo }) => { console.log(host); console.log(port); console.log(us

2020-12-02 10:49:04 493

原创 ES8语法特性 async await values entries getOwnPropertyDescriptor

ES8async await为了解决异步编程，async await 结合使用是异步代码和同步代码一样生成器函数Promise函数async awaitasync函数async 函数的返回值为 Promise对象（即使返回的是字符串）只要返回的不是一个Promise对象，结果都为成功的Promise对象，返回的是Promise对象，结果为Promise对象返回的结果（成功或失败）。Promise对象的结果由 async 函数执行的返回值决定1.return的不是一个Promise对象（

2020-12-01 19:33:34 152

原创 ES7语法特性 includes **幂运算

ES7数组方法 includesincludes 检测数组中是否包含某个元素，返回布尔类型indexOf方法，存在返回索引，不存在返回-1 let arr = [1, 11, 22, 33, 44, 55, 66]; console.log(arr.indexOf(33)); // 3 console.log(arr.indexOf(333)); // -1includes let arr = [1, 11, 22, 33, 44, 55, 66];

2020-12-01 15:48:43 124

原创 ES6语法特性（五）模块化、引入npm包

ES6模块化模块化是指将一个大的程序文件，拆分为许多小的文件（模块），然后将小的文件组合起来。优点防止命名冲突代码复用高维护性模块化规范产品ES6之前本身没有模块化，社区衍生出模块化产品CommonJS ===> NodeJS、BrowserifyAMD ===> RequireJSCMD ===> SeaJS语法模块功能主要有两个命令构成 export 、importexport 命令用于规定模块对外的接口import 命令用于输入其他模块提供的功能

2020-12-01 15:33:20 1899 2

原创 ES6语法特性（四）class类数值扩展方法对象扩展方法

ES6Class类es6引入了类Class 的概念，作为对象的模板。可以使用Class关键字定义类，通过类实例化对象。Class类可以看做是一个语法糖，绝大部分功能也可以通过es5做到。Class写法只是让对象原型的写法更加清晰、更像面向对象变成的语法而已。ES5 构造函数实例化对象 function Phone(brand, price) { this.brand = brand; this.price = price; } P

2020-11-30 19:41:45 656

原创 ES6语法特性（三）Set集合 Map

ES6Set(集合）ES6提供了新的数据结构Set，类似于数组，但成员的值是唯一的。集合实现了iterator接口，可以使用扩展运算符和for of 进行遍历。Set对象可以传入可迭代数据类型，传入数组可以实现去重 let s = new Set(); let arr = [1, 2, 1, 2, 3, 4, 2, 2, 34, 2, 4, 2, 4, 32, 2]; let s2 = new Set(arr); console.log(s, type

2020-11-28 15:57:19 224

原创 ES6语法特性（二）迭代器生成器 Promise

ES6迭代器迭代器就是为实现对不同集合进行统一遍历操作的一种机制，只要给需要遍历的数据结构部署Iterator接口，通过调用该接口，或者使用消耗该接口的API实现遍历操作。ES6为迭代器引入了一个隐式的标准化接口。Javascript许多内建的数据结构，例如Array、Map、Set、String、TypedArray、函数的 arguments 对象、NodeList 对象都具备 Iterator 接口。Iterator接口主要为for of 使用，for of（遍历的是value）不同于fo

2020-11-26 15:48:48 233

原创 ES6语法特性（一）let const 解构赋值模板字符串箭头函数 rest 扩展运算符 Symbol

ES6let特性变量不能重复声明块级作用域（if else while for…）全局、函数、eval（严格模式）不存在变量提示不影响作用域链{ let name = 'wufeng'; const fn = () => { console.log(name); // wufeng }; fn();}案例点击方块变色（var let）<!DOCTYPE html><html lang="en"> <head>

2020-11-24 14:40:54 408

原创 Vue 组件调试工具组件间通信插槽

VUE组件组件 (Component) 是 Vue.js 最强大的功能之一组件可以扩展 HTML 元素，封装可重用的代组件注册全局注册Vue.component(‘组件名称’, { }) 第1个参数是标签名称，第2个参数是一个选项对象全局组件注册后，任何vue实例都可以用组件基础用<div id="example">  <my-component></

2020-10-08 09:11:15 114

原创 Vue 表单、自定义指令、计算属性、侦听器、过滤器、生命周期、数组方法

Vue常用特性表单基本操作获取单选框中的值通过v-model  <input type="radio" id="m

2020-10-07 14:41:14 357

原创 VUE 基础知识 MVVM v-model v-for v-if v-bind...

Vue 是什么？Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合使用Vue将helloworld 渲染到页面上指令本质就是自定义属性Vue中指定都是以 v- 开头v-cloak防止页面加载时出现闪烁问题 <style type="text/css"> /* 1、通过属性选择器选择到带有属性 v-cloak的标签让他隐藏 */

2020-10-07 14:37:38 219

原创部分可用常用api 天气、当前城市、全国城市、号码归属地等

api归属地1淘宝网（(精确到省份）Url:https://tcc.taobao.com/cc/json/mobile_tel_segment.htm?tel=手机号2 sogou(精确到地市)Url:http://service.sx.10086.cn/enhance/cust/queryPhoneArea.action POST phone_no=手机号码3 百度 (精确到地市)Url:https://sp0.baidu.com/8aQDcjqpAAV3otqbppnN2DJv/ap

2020-09-10 11:33:04 421

原创 Vue 接口异步 Promise fetch axios

接口调用方式原生ajax基于jQuery的ajaxfetchaxios异步JavaScript的执行环境是「单线程」所谓单线程，是指JS引擎中负责解释和执行JavaScript代码的线程只有一个，也就是一次只能完成一项任务，这个任务执行完后才能执行下一个，它会「阻塞」其他任务。这个任务可称为主线程异步模式可以一起执行多个任务JS中常见的异步调用定时任何ajax事件函数promise主要解决异步深层嵌套的问题promise 提供了简洁的API 使得异步操作更加容

2020-08-26 16:55:13 349

原创 ES6 let const 解构赋值箭头函数内置扩展方法 Set数据结构

ES6定义ES 的全称是 ECMAScript , 它是由 ECMA 国际标准化组织,制定的一项脚本语言的标准化规范。每一次标准的诞生都意味着语言的完善，功能的加强。JavaScript语言本身也有一些令人不满意的地方。变量提升特性增加了程序运行时的不可预测性语法过于松散，实现相同的功能，不同的人可能会写出不同的代码语法let 关键字1、let关键字就是用来声明变量的使用let关键字声明的变量具有块级作用域在一个大括号中使用let关键字声明的变量才具有块级作用域 var关键字是不具

2020-07-24 19:22:42 251

油猴护眼脚本-加强版.js

空空如也