- 博客(85)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 OTS parsing error: invalid version tag解决方法
使用webpack打包css/less/scss/ttf等字体文件，总是会遇到出现很多的问题，程序语音语法每月都在变化，比如去年的语法结构可能在今天使用就会出现各种问题，毕竟语法是不断完善的，遇到纠结时。过多纠缠真的没必要，直到有一天做的多了，然后把前边的稍微变通一下，竟然达到想要的结果。多看多练，多思考，多做笔记自然是好。你得到的东西自然不是别人的。目标：打包字体文件 png|woff|woff2|svg|ttf|eot工具： 就是使用webpack工具基础：适合具有node基础的开发人员.
2022-04-21 13:53:06
4202
原创 export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue‘解决
webpack在打包Vue是出现imported as Vue was not found in Vue问题的解决
2022-04-20 22:32:29
10596
4
原创 Vue实例父子之间的互相传值
本示例需要用到Vue.js[具体的可以访问官网，替换]子类获取父类的变量的值 <coml v-bind:parent-Msg='msg'></coml> //---------- //在子类中使用 props:['parentMsg'] //可以在子组件中使用子类获取父类的方法<coml @func='getDataMsgFormat'></coml>//getDataMsgFormat 是父类的函数方法//------在子类触发的方
2022-04-15 23:01:30
467
原创 钩子函数模拟小球半动画
@before-enter=“beforeEnter”@enter=“enter”@after-enter=“afterEnter”这是只实现入场动画 出场动画还请各位小伙伴自行搜索vue.js官方文档查阅当点击按钮时，小球会自动移动到指定的位置，然后消失，当再次点击按钮，小球继续从原点抛出到指定位置<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <met.
2022-04-14 18:05:40
651
原创 从服务器主动发送请求http.request(options[, callback])
从服务器主动发送请求从服务器主动发送请求调用接口-查询数据const http = require('http');//這是已知的并且已經存在的服務器 ---【獲取展示目錄下的頁面】let option = { protocol:'http:', hostname:'localhost', port:3000, path:'/'}let req = http.request(option,(res)=>{ let info = ''; res.on('data',(chunk)
2022-04-09 13:15:40
1048
原创 node使用express基础实例
Express基于 Node.js 平台，快速、开放、极简的 Web 开发框架引入express框架新建项目文件夹npm命令初始化 npm init安装express到项目生产环境 npm install express --save打开package.json[出现以下 “express”: “^4.17.3” 代表项目初始化并且安装express框架完成]{ "name": "myexpress", "version": "1.0.0", "description":
2022-04-03 23:55:10
291
原创 node操作mysql数据基本增删改查功能笔记
安装mysql框架npm install mysqlmysql第一个实例数据库连接*///加载数据库驱动const db = require('mysql');//创建数据库连接const connecttion = db.createConnection({ host:'localhost', // 数据库所在的服务器的域名或者IP地址 user:'root', //登录数据库的账号 password:'', //登录数据库的密码 database:'storedb' //数
2022-04-02 23:09:39
1104
原创 mysql基础笔记
mysql启动：mysql -u root -pmysql -u pEnter password: [这总方式看不到密码，更好的保护好密码]2.退出 mysqlexitquit查看数据库表[列出 MySQL 数据库管理系统的数据库列表]show databasecreate database 数据库名[studb];create database studb;use 数据库表use studb;创建表[stu]create table stu
2022-04-01 23:19:19
642
原创 php操作mysql数据笔记
mysql启动：mysql -u root -pmysql -u pEnter password: [这总方式看不到密码，更好的保护好密码]2.退出 mysqlexitquit查看数据库表[列出 MySQL 数据库管理系统的数据库列表]show databasecreate database 数据库名[studb];create database studb;use 数据库表use studb;创建表[stu]create table stu
2022-03-31 23:52:05
408
原创 art-template模板引擎实例以及路由分发笔记
了解更多的相关的知识，请浏览搜索art-template等api，使用yarn 安装mode-modules初始化[不支持中文文件夹，否则会报包文件名编码异常] yarn init使用yarn添加express到生产环境中 yarn add express --savenext()将请求转发到下一个环节/* 中间件：就是处理过程中的一个环节（本质上就是一个函数）*/const express = require('express');const app = express().
2022-03-30 22:11:18
347
原创 node实现get与post请求简单的服务器
在了解这篇之前，您的电脑环境一定要配置node的环境，使用node命令可以搭建一个简单的服务器。这是登录页面负责提交数据，实现get与post请求<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <h1>get请求&l.
2022-03-29 19:01:45
883
原创 node.js引入模板以及使用模板引擎笔记
路径操作以下操作都需要引入const path = require(‘path’);/* 路径操作*/const path = require('path');// 获取路径的最后一部分console.log(path.basename('/foo/bar/baz/asdf/quux.html')); //quux.htmlconsole.log(path.basename('/foo/bar/baz/asdf/quux.html', '.html')); //quux
2022-03-28 22:56:18
3106
原创 node基础基础以及模块导出笔记
cd命令进入d盘输入 d: C:\Users\Administrator>D: D:\> 返回上一级目录H:\网页前端\移动开发\第四章\第二章>cd ..H:\网页前端\移动开发\第四章>包含文件名称的全路径console.log(__filename);文件的路径（不包含文件名称）console.log(__dirname);在Node.js中没有window对象，但是有一个类似的对象global，访问全局成员的时候可以省略
2022-03-27 23:31:13
2900
原创 函数\箭头函数参数解析笔记
使用nodejs编译js文件使用cd 命令进入存放需要编译js的文件node 文件名.js知识：1、javascript本质上是什么？就是一门编程语言，解释执行的2、浏览器的内核包括两部分核心：1、DOM渲染引擎；2、js解析器（js引擎）3、js运行在浏览器中的内核中的js引擎内部4、是否js只能运行在浏览器中？不是的5、实现动态网站的技术：java php .net python nodejs…6、基于Node.js和第三方工具electron可以开发桌面应用
2022-03-26 23:23:24
1211
原创 移动基础笔记
emem:就是一种长度单位，它是参照当前元素的字号，如果没有设置，就参照父容器或者当前浏览器的默认字号remrem是css3新增的一种长度单位，它是参照根元素(html)的字号获取宽度 获取宽度的方法的说明： * width():它只能得到当前元素的内容的宽度 * innerWidth():它能获取当前元素的内容的宽度+padding * outerWidth():获取当前元素的内容的宽度+padding+border移动事件console.log(e.touches);c
2022-03-25 22:14:54
1213
原创 js移动设备基础笔记
获取独立像素与物理像素比例值// 像素和设备独立像素的一个关系 alert(window.devicePixelRatio);获取设备物理像素比// 以像素计，屏幕的大小 var screenWidth = window.screen.width; var screenHeight = window.screen.height; console.log('屏幕的宽度为: ' + screenWidth); console.log('屏幕的高度为: ' + s
2022-03-24 22:48:01
421
原创 自定义js脚本处理同域请求与跨域请求js脚本
处理同域请求与跨域请求，默认是异步get请求，可以实现获取同步请求//实现跨域与同域请求function ajax(obj){ var defaults = { type:'get', async:true, url:'#', dataType:'text', jsonp:'callback', data:{}, success:function(data){console.log(data)} } for(var key in obj){ defaults[key
2022-03-23 21:50:54
418
原创 jquery同域与跨域笔记
php 输出 table<body> <?php sleep(3);//执行到这里的时候等待3秒 /*这里的数据是假数据，真正的场景中数据基本上都是来自数据库。*/ $arr = array(); $arr[0] = array('name'=>'三国演义','auhor'=>'罗贯中','category'=>'古典文学','desc'=>'一个群雄争霸的年代'); $arr[1] = array('name'=>'水浒传','auh
2022-03-22 23:41:44
508
原创 php后端请求基础知识笔记
php输出<?php//后台接口echo 1;?>php输出 html元素<?phpheader('Content-Type:text/html; charset=utf-8');echo '<div style="color:red;"><span>测试数据</span><span>测试数据</span><span>测试数据</span></div>';?>输出
2022-03-21 21:33:14
670
原创 template模板使用笔记
自定义模板 <script> window.onload=function(){ function success(data){ // 这里就相当于之前的回调函数 var title = data.title; var books = data.books; var tag = '<h1>'+title+'</h1>'; for(var i=0;i<books.length;i++){ tag+='<div>
2022-03-20 23:45:56
299
原创 jquery解绑、绑定笔记
解绑事件 <script> // $(function(){ // //第一个按钮通过on的方式绑定点击事件 // $("#btn1").on('click',function(){ // alert('我被点击了'); // }); // //第二个按钮把第一个按钮的点击事件解绑 // $('#btn2').on('click',function(){ // //off() 参数： 要解绑的事件的名字 // $('#btn1').of
2022-03-19 23:17:30
282
原创 JQuery基础笔记
jQuery 框架 //JavaScript框架库:就是一个普通的js文件,封装了很多的函数,封装了很多兼容的代码//jQuery是JavaScript框架库中的一种//jQuery的好处:写的少,做的多,链式编程,隐式迭代等...//jQuery可以解决js兼容的问题通过id获取元素 window.onload=function () { document.getElementById("btn").onclick=function () { //获取div根据id的方
2022-03-18 23:22:06
828
原创 用一个盒子包裹起来，就不是同一个BFC，不会出现塌陷问题
BFC 块级格式化上下文 (Block Fromatting Context)是按照块级盒子布局当两个块元素出现在一个父元素中，如果给子元素添加外边距就会产生边距塌陷，解决这种问题的办法就是给另一个子元素在套一个盒子。外边距塌陷，以最大的外边距为主，失去最小的外边距。例如上下两个元素，一个外边距是100px 另一个是50px，就会失去50px外边距，从而外边距实际距离是100px 这种状态被成为外边距塌陷。<!DOCTYPE html><html lang="en">.
2022-03-17 23:18:58
174
原创 使用面向对象思维创建table
对象右自己的属性和方法，将标签tr td 可以看作是一个对象 innerHTML可以看作是他们的方法按照层级关系，table->thead>tr>td 看到这里大概也知道了tabel元素的层级关系。实例代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body.
2022-03-16 23:24:06
191
原创 小实例js实现飞机游戏简单入门
需求：背景飞机[坐标 长度 图片路径]敌机[坐标 长度 图片路径]子弹[坐标 长度 图片路径]运动飞机 y轴不断减小敌机 y轴不断增大子弹 y轴不断增小需求：当 子弹的top值在敌机范围内 子弹从子弹数组中移除 敌机从敌机数组移除 同时也要从doc节点上移除元素。当敌机或子弹超出屏幕就从数组中移除，并且从doc上移除节点元素控制使用鼠标可以控制飞机的位置<!DOCTYPE html><html lang="zh">.
2022-03-15 22:41:10
4374
原创 css背景以及伸缩模式布局笔记
引入外部字体@font-face{font-family: myFirstFont;src: url('font/icomoon.ttf') ,url('font/icomoon.eot') ; /* IE9 */ }div::after{ font-family:myFirstFont;/*一定要和声明的font-family: "myFirstFont"相同 否则没有效果;*/ /* content: '\e909'; */ content: '\e90b'; font-size
2022-03-14 23:30:36
430
原创 css样式、渐变、响应式布局笔记
线性h1 {text-decoration:overline;}h2 {text-decoration:line-through;}h3 {text-decoration:underline;}字母转换p.uppercase {text-transform:uppercase;} 全部转换为大写p.lowercase {text-transform:lowercase;} 全部转换为小写p.capitalize {text-transform:capitalize;} 首字母大写字体
2022-03-13 23:36:37
310
原创 动态响应布局、iconfont笔记
clip:rect矩形剪裁功能rect(30px 200px 200px 20px)rect(top right bottom left)参数：top right bottom left分别指最终剪裁可见区域的上边，右边，下边与左边。而所有的数值都表示位置，且是相对于原始元素的左上角而言的。说明：裁剪矩形上边距上边的距离是30px 裁剪矩形右边距左边的距离是200px 裁剪矩形下边距上边的距离是200px 裁剪矩形左边距左边的距离20px:notli a:hover:not(.ac
2022-03-12 23:45:42
538
原创 HTML表格、字符标记等笔记
插件 嵌入Objectfirefox<object width="400" height="100" data="test.html"></object><object width="100%" height="500px" data="test.html"></object><object data="test.html"></object>插件 嵌入embed元素已经出现很长一段时间了，但是在 HTML5 前并未
2022-03-11 23:27:08
187
原创 js定位\存储\websql笔记
定位判断浏览器是否支持 if (navigator.geolocation){ navigator.geolocation.getCurrentPosition(showPosition); }else{ x.innerHTML="该浏览器不支持获取地理位置。"; }获取定位的经纬度 function showPosition(position){ x.innerHTML="纬度: " + position.coords.latitude + "<br>经度: " +
2022-03-10 23:26:38
859
原创 css选择器、权重
线性渐变 background: linear-gradientbackground: -webkit-linear-gradient(top,red,green); 参数: 渐变起始位置 起始颜色 结束颜色background: -moz-linear-gradient(top,pink,yellow);background: -webkit-linear-gradient(top,red 20%,green 50%,orange 75%,pink 100%);background: -moz
2022-03-09 21:55:15
112
原创 js实现微信界面
布局 思路需求：两个用户聊天会切换头像点击发送会将用户输入的信息输出到界面上消息页面布局对方发送信息的布局自己 发送消息的布局顶部的bar显示昵称显示当前时间内容区域展示自己和对方的发送的结果信息信息高度到达最大高度，实现内容当前信息向上滚动展示三大区域 展示用户昵称和时间的Bar 展示用户发送的信息显示的内容content[如果需要实现自动滚动效果，需要在套上一个div，定位模式relative——子绝父相] 底部展示输入框和发送按钮。.
2022-03-08 23:38:25
897
原创 js实现滚动条长度随着内容长度变化而变断
实现最终效果：滚动条Bar自身的长度随着内容的增多，会变短拖动bar可以滚动文字的内容高度思路算法滚动条bar的高度/scroll高度=box高度/内容的高度barHeight = box.clientHeight/conten.offsetHeightscroll.clientHeight;内容滚动的距离/内容最大滚动的距离=滚动条bar滚动的距离/滚动条bar最大的滚动距离内容最大的滚动距离var contentMax = conten.scrollHeight-box.client..
2022-03-07 23:04:22
1201
原创 CSS+HTML基本常用笔记
了解CSS常用基本命令paddingpadding:20px; 上 下 左 右 距离都是20pxpadding:20px 30px; 上、下 距离20px 左、右距离都是30pxpadding:20px 30px 50px; 上内边距离20px 左右内边距离30Px 下内边距里 50pxpadding:20px 30px 50px 80px; 上内边距离20px 右内边距离30Px 下内边距离50Px 左内边距里 50px内边距padding行内元素没有宽高，但是有内边距..
2022-03-06 23:34:23
417
原创 onmouseenter与mouseover的区别
// mouseenter 和 mouseover的区别 var box1 = document.getElementById('box1'); var i = 0; // 触发子元素的mouseover，会冒泡到父元素上 // box1.onmouseover = function () { // i++; // console.log(i); // } // // 此事件不触发事件冒泡 box1.onmo...
2022-03-04 23:24:09
229
原创 select移动总是移不干净
document.getElementById(id); 获取元素element.children(); 获取子元素的数组Element.appendChildren(option); 添加新的元素则会先从父类上删除该子节点 然后添加到新的父类节点上<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style&.
2022-03-03 22:22:28
72
原创 WebApi获取元素的三种方法
WebApiAPI(Application programming interface)[应用程序编成接口]作用：定义一些预先定义的函数。目的是提供应用程序与开发人员基于某种软件得以访问的一组编程的能力，而无需访问密码，或理解内部工作机制细节特点：任何开发语言都有自己的APIAPI的特征输入和输出API使用方法(conslote.log)*** 浏览器 *** 提供一套操作浏览器功能和页面的元素的API(BOM和DOM)javascript由三部分组成EC
2022-03-02 20:44:35
553
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人