向全栈冲-CSDN博客

原创 git常用命令学习

一.在Windows上安装Git1.在Windows上使用Git，可以从Git官网直接下载安装程序，然后按默认选项安装即可。2.安装完成后，在开始菜单里找到“Git”->“Git Bash”，蹦出一个类似命令行窗口的东西，就说明Git安装成功！3.安装完成后，还需要最后一步设置，在命令行输入：git config --global user.name “Your Name”git config --global user.email “email@example.com”注意：git co

2021-11-30 10:07:34 372

原创布局定位的两个重要等式

水平布局margin-letf + border-left + padding-left + width + padding-right + border-right + margin-right = 其包含块的内容区的宽度当我们开启了绝对定位后：水平方向的布局等式就需要添加 left 和 right 两个值：left + margin-letf + border-left + padding-left + width + padding-right + border-right + margin-r

2021-09-18 14:56:43 132

原创 js高级--手写ToDoList

先上代码看效果： <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } li{ list-style: none; } body{ background-colo

2021-07-17 15:48:25 397 1

转载 js高级--jQuery二

jQuery元素操作创建一个元素var div = $('<div></div>')内部插入元素// 向 div 元素中插入一个 p 元素，放在最后$('div').append($('<p></p>'))// 把 p 元素插入到 div 中去，放在最后$('<p>hello</p>').appendTo($('div'))// 向 div 元素中插入一个 p 元素，放在最前$('div').prepe

2021-07-16 19:45:12 75

转载 js高级--jQuery

jQueryjQuery 是一个前端库，也是一个方法库（99%都是方法）他里面封装着一些列的方法供我们使用我们常用的一些方法它里面都有，我们可以直接拿来使用就行了jQuery 之所以好用，很多人愿意使用，是因为他的几个优点太强大了优质的选择器和筛选器好用的隐式迭代（不用循环）强大的链式编程因为这些东西的出现，很多时候我们要做的事情被 “一行代码解决”接下来我们就来认识一下 jQuery框架：Vue React库：jquery zeptojQuery 的使用jQuer

2021-07-15 20:33:09 83

转载 js高级--本地存储和设计模式

localstorage和sessionStoragelocalStorage 类似 sessionStorage，但其区别在于：存储在 localStorage 的数据可以长期保留；而当页面会话结束——也就是说，当页面被关闭时，存储在 sessionStorage 的数据会被清除。localStorage 中的键值对总是以字符串的形式存储。(需要注意, 和js对象相比, 键值对总是以字符串的形式存储意味着数值类型会自动转化为字符串类型).下面的代码片段访问了当前域名下的本地 Storage 对象

2021-07-15 16:45:48 90

转载 js高级--原型

构造函数与原型1.静态成员和实例化成员实例成员就是构造函数内部通过this添加的成员；静态成员：在构造函数本身上添加的成员,静态成员只能通过构造函数来访问；2.构造函数的问题通过构造函数实例化对象虽然很好用，但是他也存在一些问题，首先一个就是内存浪费的问题。我们可以给函数的原型添加函数，这样的话，函数所有的实例化对象都可以使用这个函数，大大减少函数重复占用内存。3.构造函数原型prototype构造函数通过原型分配的函数是所有对象所共享的。JavaScript 规定，每一个构造函数都有一个

2021-07-13 17:23:21 75

原创 js高级--jsonp跨域

一．ajax的同源策略Ajax请求限制：Ajax 只能向自己的服务器发送请求。比如现在有一个A网站、有一个B网站，A网站中的 HTML 文件只能向A网站服务器中发送 Ajax 请求，B网站中的 HTML 文件只能向 B 网站中发送 Ajax 请求，但是 A 网站是不能向 B 网站发送 Ajax请求的，同理，B 网站也不能向 A 网站发送 Ajax请求。XMLHttpRequestfetch() 封装了ajax同源策略：什么叫做同源如果两个页面拥有相同的协议、域名和端口，那么这两个页面就属于同

2021-07-13 17:08:48 581

原创 js高级--异步函数，回调函数与Promise对象

Promise对象在说promise之前先谈谈异步，前面学习了ajax就是一个异步方法，在ES6之前为了获取异步代码里面的数据用的是回调函数：function getTi(callback){ setTimeout(function(){ callback('喝茶') },2000) } getTi(function(data){ console.log(data); })这里再说下，js是单线程，所以在代码执行过程中，遇到异步代码会先放到队列里面

2021-07-13 16:55:50 401

原创 js高级--Http协议与cookie会话技术

一、HTTP协议程序员必备基础知识：通信协议——Http、TCP、UDP1.1 通信协议都是通信协议，也就是通信时所遵守的规则，只有双方按照这个规则“说话”，对方才能理解1.2 常见的网络协议常见的网络协议：HTTP，TCP，UDP，FTP Http是基于TCP的面向连接的一种协议。 Http是一种基于请求/响应模式的、无状态的协议。即我们通常所说的Request/Response。前端向后端发请求，需要建立连接（三次握手），如果数据传输完成，就需要断开连接（四次挥手）

2021-07-12 21:19:31 275 2

原创 js高级--ajax

AJAX一、AJAX的概念什么是AJAXAJAX( Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下，对网页的某部分进行更新。传统网站（不使用ajax），如果需要更新内容，必须重载整个网页页面。二、AJAX的优势优点：1、用户体验好，对用户的操作做出及时的响应2、不中断用户的操作的情况下与服务器通信3、大大提升web程序的性能4、大大减轻web服务器和

2021-07-12 19:58:52 278 1

原创 js高级--Mysql数据库

数据库一、数据库的概念概念：数据库是按照数据结构来组织，存储和管理数据的仓库。库：仓库表：一个仓库被分为了很多的部分，很像类字段：很像类的属性每个字段的数据类型：int-->整数类型char--> 定长字符串varchar--->变长字符串blob--->二进制类型date-->日期类型二、常见的数据库关系型数据库oracle、mysql、SQLServer、DB2、sybase非关系型数据库Redis、HBAse、CouchDb、MongoD

2021-07-12 16:18:03 301

原创 js高级--PHP

PHP语言B/S架构例如：比如：我们浏览一个新闻网站1）用户输入网址2）前端人员就要把对应的页面给到用户，在页面打开的过程中，想后端人员索要新闻信息3)后端人员接收到前端人员索要新闻信息以后，就去数据库中找到对应的新闻信息数据给前端人员4)前端人员接收到后端人员给的新闻信息以后，使用我们的办法吧新闻信息数据渲染在页面上5)页面就打开了，用户就可以看到一个新闻网站了再比如：用户登陆一个网站1) 当用户书写完表单内容以后，点击提交按钮的时候2) 前端人员拿到用户填写的内容，把数据整合

2021-07-12 16:12:53 72

原创 js高级---闭包

1.函数的定义方式方式一：函数声明式：function( ){ };方式二：函数表达式（匿名函数）var fn=function( ){ };方式三：new Function( )2.函数调用普通函数 function fn( ){ };fn();对象的方法：var o={say:function(){ }}o.say();构造函数：function Star() {};new Star();绑定事件函数写法一：btn.function(){};绑定事件函数写法二：funct

2021-07-12 14:51:40 71

转载鼠标转换成图片样式的方法

下面就来介绍下步骤方法：首页把鼠标图标格式转换成.ico格式，大小为32*32转换格式网址为：https://www.easyicon.net/covert/然后在CSS样式中增加代码：*{cursor:url(…/images/shubiao.ico),auto;}大功告成啦~~~说明：图片大小最好是32*32的大小Css中的cursor属性不仅仅需要将url（）书写正确，还需要填写一个备用样式。 cursor:url(‘图片地址’),备用选项;。缺一不可。...

2021-06-26 11:43:19 529

原创原生JS常见距离属性

js各种距离问题：e代表事件对象，obj代表元素1.obj.offsetWidth//返回元素的宽度（包括元素宽度，内边距和边框）；2.obj.offsetHeight//返回元素的高度（包括元素的高度，内边距和边距）；3.obj.offsetLeft//元素到开定位属性的父级元素的左偏移量；4.obj.offsetTop//元素到开定位属性的父级元素的上偏移量；5.obj.clientWidth//返回元素的可视宽（包括元素宽度，内边距，不包括边框）；6.obj.clientHei

2021-06-26 10:31:32 212 1

原创简化版打地鼠

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <style type="text/css"> body{ background-color: black; } </style> <body> <button onclick="start1()

2021-06-26 09:57:42 64

原创原生JS常见兼容性问题

常见的兼容性问题总结：1.获取非行内样式function getStyle（obj，attr）{if（obj.currentStyle）returen obj.currentStyle[attr];else{return getComputerStyle(obj,false)[attr];}}2.获取事件对象function getEVent(e){return e||window.event;}3.阻止事件冒泡function stopBubble(e){if(e.st

2021-06-26 09:53:34 129

原创 JavaScript13

day131.事件委托：利用冒泡机制，将时间统一交给父级处理，利用target找到点击的事件源兼容性写法：var t=e.target||e.srcEvent;这里t为事件源2.正则表达式：是用于匹配字符串中字符组合的模式，正则实质也是对象创建方法：1.构建对象var reg=new RegExp(/adc/)2.字面量var reg=/asd/3.检测方法text用法：var reg=/asd/；建立正则表达式reg.text（str）；检测是否符合正则表达式，符合返回true，

2021-06-25 08:44:27 103

原创 JavaScript12

day121.解绑DOM0级解绑：odiv.οnclick=null;DOM2级解绑：odiv.addEventListener(type,fn,false);function fn(){代码}odiv.removeEventListener(type,fn);2.事件流：页面接受事件的顺序3.DOM事件流：事件在元素节点之间按照特定的顺序进行传播特定的顺序：IE：冒泡，最具体的元素向上逐层传播，直到最顶级元素网景：捕获，事件触发时，是从最顶层向下传播，直达最具体元素W3C:D

2021-06-23 21:00:47 68

原创 JavaScript11

day111.offsetoffsetWidth 占位宽（包括border和padding）offsetHeight 占位高（包括border和padding）clientWidth可视宽（不包括border）clientHeight可视高offsetLeft：获取具有定位属性父元素的左距离offsetTop：：获取具有定位属性父元素的上距离2.事件：onclick onmouseover onmouseout onresize onscroll onload事件的组成：odiv.onX

2021-06-22 17:19:01 83

原创 JavaScript10

day101.获取页面滚出去的高document.scrollTop/document.documentElement.scrollTop；兼容性写法：document.scrollTop||document.documentElement.scrollToponscroll：页面滚动触发2.固有属性和自定义属性固有属性：input的固有属性有value，type…设置固有属性：元素.属性名=属性值注意：类名方法为,元素.classname=‘属性值’自定义属性：自己定义的属性语法：设

2021-06-22 08:49:30 190

原创 JS点名器

点名器<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ padding: 0; margin: 0; } body{ background:black url(imges/a.png); } h2{

2021-06-19 16:52:08 846

原创 JavaScript08

BOM一.BOM:浏览器对象模型1.BOM的子对象包括：window，location，navigator，screen，history，document二.window对象：window对象是BOM的核心，它表示浏览器的实例，在浏览器中我们可以通过window对象来访问操作浏览器，同时window也可以作为全局对象存在，在全局作用域中声明的变量，对象，函数都会变成window对象的属性和方法；1.窗口大小网页窗口大小：innerWidth/innerHeight浏览器本身尺寸：outerWi

2021-06-19 16:36:42 57

原创 JavaScript07

day08一.String字符串常见的API和属性length：长度charAt（下标）：返回当前下标所对应的字符charCodeAt（下标）：返回当前下标所对应字符的ASCll码值fromCharCode：功能：编码转换为字符；参数（String.fromCharCode(asc1,[asc2,asc3…]) 返回值：返回asc对应的字符indexof（）：查找字符串第一次出现的位置lastIndexOf（）：查找字符串最后一次出现的位置，如果没找到返回-1

2021-06-17 21:25:04 97

原创 JavaScript06

数组（Array）- 数组也是一个对象，是一个用来存储数据的对象和Object类似，但是它的存储效率比普通对象要高- 数组中保存的内容我们称为元素- 数组使用索引（index）来操作元素- 索引指由0开始的整数- 数组的操作：- 创建数组- var arr = new Array();- var arr = [];向数组中添加元素- 语法；数组对象[索引] = 值;arr[0] = 123;arr[1] = “hello”;创建数组时直接添加元素- 语法：var arr =

2021-06-16 20:12:30 244

原创 JavaScript05

day05对象（Object）- 对象是JS中的引用数据类型- 对象是一种复合数据类型，在对象中可以保存多个不同数据类型的属性- 使用typeof检查一个对象时，会返回object- 创建对象- 方式一：- var obj = new Object();- 方式二：- var obj = {};向对象中添加属性- 语法：对象.属性名 = 属性值;对象[“属性名”] = 属性值;-对象的属性名没有任何要求，不需要遵守标识符的规范，但是在开发中，尽量按照标识符的要求去写。- 属性值

2021-06-16 19:57:30 46

原创 JavaScript04

day041．函数的概念及作用~函数是一个对象，也具有普通对象功能，函数中可以封装一些代码，在需要的时候可以调用函数来执行这些代码；~使用typeof检查函数时会返回function2.创建函数：方法一：~函数声明 functio 函数名（[形参1，形参2...]）{ 语句...}方法二：~函数表达式 var 函数名=function([形参1，形参2...] ）{ 语句...}；3.调用函数：~语法：函数对象（[实参1，实参2...]）；~函数

2021-06-11 09:11:38 81 2

原创 JavaScript03

1.for循环for(初始化变量；条件表达式；操作表达式){//循环体}初始化变量：通常用于初始化一个计数器，该表达式可以使用var关键字声明新的变量；条件表达式：用于确定每一次循环是否能执行，如果是true就继续循环，否则退出循环；操作表达式：用于确定每一次循环是否能被执行。如果是true就继续执行，否则退出。2.打断点3.双重for循环循环嵌套是指在一个循环语句中再定义一个循环语句的语法结构，例如在for循环语句中，可以再嵌套一个for 循环，这样的 for 循环语句我们称之为双

2021-06-10 08:36:12 61 1

原创 JavaScript02

day021.条件语句：通过判定指定表达式的值来决定执行还是跳过某些语句；2.条件语句分为：if…else：一种最基本的控制语句方式一：if（条件）{ 代码块1； }方式二：if（条件）{ 代码块1； }else{ 代码块2； }方式三：除了if和else还可以使用else if来创建多个条件分支；if（条件1）{ }else if（条件2）{ }else{ }switch…cas

2021-06-08 19:07:34 33

原创 JavaScript01

Day011.js概念：js是运行在浏览器中的解释型脚本语言；2.js组成包括：ECMAScript（语法）,Dom（页面）,Bom（浏览器的头包括滚动条等）3.js可以书写在三个位置：a.行内（以on开头）b.内嵌（一般放在body底部）c.外部外部js文件的script标签中间不可以写代码4. 浏览器本身并不会执行JS代码，而是通过内置 JavaScript 引擎(解释器) 来执行 JS 代码。JS 引擎执行代码时逐行解释每一句源码（转换为机器语言），然后由计算机去执行，所以 JavaScr

2021-06-07 19:41:29 60

原创 HTML+CSS基础17

1.雪碧图/精灵图主要应用的是背景图位置background-position优点：（1）减少图片请求次数（2）减少图片的大小2.透明度opacity：0-10完全透明，1不透明，值越小越透明rgba（0-255，0-255，0-255，0-1）区别：raga只透明背景，不会使文字透明专门针对ie的透明写法filter：alpha（opacity=50）取值为1-100之间，1完全透明，100为不透明3.权重！important：所有选择器中权重值最高，无限大浏览器的内核（解析代

2021-05-07 17:34:48 56

原创 HTML+CSS基础16

1.弹性盒父元素：主轴的方向flex-directionrow从左到右row-reverse从右向左column从上到下column-reverse从下往上子元素：单独子元素在交叉轴的对齐方式 align-selfflex-strat交叉轴的起点flex-end交叉轴的终点center交叉轴的中心放大比例flex-grow：数值分配父元素剩余的空间子项宽度flex-basis子项压缩flex-shrink 数值0不压缩数值1压缩排序order 数值复合写法flex：flex-

2021-05-06 20:46:29 104

原创 HTML+CSS基础15

1.BFC->块级格式化上下文->独立渲染的区域触发条件：a.overflow的值设置为hidden/auto/scrollb.float的值为left/rightc.position的值为absolute/fixedd.display的值table-caption（表格标题）/table-cell（单元格）/inline-block/flex（弹性盒）/inline-flex（行内弹性盒）特性：a.在BFC区域，浮动元素的高度不会计算在内b.BFC区域不会和浮动盒子重叠c.在

2021-05-05 13:57:12 39

原创 HTML+CSS基础14

1.背景图的固定（默认情况下背景图跟着滚动条滚动，固定的话内容跟着滚，但是背景图是固定的）background-attachment：scroll（滚动）/fixed（固定）2.背景图大小background-size：宽度高度；a.数值/百分比（百分比设置会导致图片变形）b.关键字：cover：图片不断延伸，直到充满整个盒子，可能会出现背景图裁切contain：图片不断拉伸，拉伸到碰到某个边缘的时候就停止拉伸，可能会出现六百的情况复合写法background：pink url（） no

2021-05-05 13:55:40 47

原创 HTML+CSS基础13

1.渐变A.线性渐变background-image：linear-gradient（方向，颜色1，颜色2…）方向：to bottom向下 to right向右 to top向上 to left 向左to left top左上角 to right top 右上角to left bottom左下角 to right bottom 右下角角度+degB.重复性线性渐变默认方向向下，高度为200： 0-40红色 40-60红色到黄色渐变 60-200黄色background-image：

2021-05-05 13:49:25 47

原创 HTML+CSS12

补充:实现透明的方法:一:透明属性opacity:0-1;0:完全透明1:不透明值越小,越透明,且设置该属性后标签内所有显示都跟着变化二:background-colorrgbd(x,y,z,t)rgb()为三元素设置颜色,rgbd()则增加了透明度,只会修改背景色的透明度;1.固定定位position:fixed参考物:浏览器窗口移动:left/top/bottom/right+数值px特点:(1)脱离文档流(2)margin:auto;会失效2.粘性定位position:st

2021-04-27 20:23:37 104

原创 HTML+CSS11

1.定位属性:positionA.static默认值静态定位B.relative 相对定位a.参考物:自己本身的位置b.移动:left/right/top/bottom:数值+pxc.特点:移动之后依然占位俗家记忆:向一个方向移动,采用的移动属性与移动方向一致时,移动属性值为父;移动方向与移动属性相反时,则移动属性值为正.C.absolute 绝对定位a.参考物:(1)有定位属性;(2)祖先元素(子绝父相)设置绝对定位的元素,会一层层向上找有属性的祖先元素,谁有就参考谁,如果找到bo

2021-04-26 19:36:30 68

原创 HTML+CSS基础10

1.内容补充A.引入外部样式表的方法a.在head标签里面生成一个style双标签b.@import url（css路径）两种样式表的区别a.@import只能引入css文件，link可以引入除css外的其他文件b.加载顺序的区别@import先加载结构，后加载样式；link结构和样式同时加载c.浏览器的支持性，link支持所有的浏览器，@import只有在ie6以上才支持拿图片：http://(网址)+favicon.icoB.css层叠样式表层叠行：当样式产生冲突的时候，会根据权

2021-04-25 22:31:39 51

原创 HTML+CSS基础09

1.表格新增的标签表格的标题：caption表格列标题th（需要将第一行的列标题里面的td换成th即可）行分组（表格结构更清晰一点）thead表头，一般只有一个tbody表体，可以有多个tfoot表尾，一般只有一个表单新增CSS属性：边框间的距离：border-spacing：一般为0边框合并：border-collapse：collapse；合并后，边框不会变粗表格固定：table-layout：fixed；单元格不会因为里面的内容而变高变宽（）2.表单集form（块元素）act

2021-04-25 08:51:36 81

空空如也

空空如也