大前端
文章平均质量分 64
h5、css3、js、ts
jackletter
这个作者很懒,什么都没留下…
展开
-
nodejs 中的require加载模块的顺序
首先nodejs中加载模块的书写方式:1. require("fs") 内核模块2. require("./demo")或require("../demo")或require("/demo")相对地址模式3. require("demo") 类似内核模块写法require函数在执行的时候顺序为(忽略调缓存):1. 首先查看是否是内核,是就直接返回2. 解析要查找的目录 如果是相对地址模式,...原创 2018-07-05 12:48:27 · 3627 阅读 · 0 评论 -
如何在Chrome DevTools 中对Node程序进行调试
转自:https://www.jianshu.com/p/198a9cf83aae相信有很多人和我一样,习惯了使用chrome调试js程序,然而node刚开始提供的调试方式只用Debugger,只能通过node --debug xxx.js启动命令行调试工具,及其的不方便。当然也有一些插件在此基础上,使用websocket进行通信,使其可以在chrome浏览器中调试。体验和直接在chrome上...转载 2019-04-12 09:25:03 · 693 阅读 · 0 评论 -
nodejs:window10下的nodejs基本知识
环境:window10x64 专业版node-v14.15.1-x64.msi一、安装包的下载官网:https://nodejs.org/en/download/网盘:链接:https://pan.baidu.com/s/1KbBPHA369Wm71Dy5Q4Eizw提取码:1s4x二、安装过程傻瓜式安装,除了修改一下安装目录,其他的用默认即可。安装目录最好不要有空格,我这里选的是 D:\nodejs三、安装后的变化3.1 安装后的目录如下安装后已经自带原创 2020-11-20 00:38:04 · 779 阅读 · 0 评论 -
linux下安装nodejs
一、linux下安装nodejs下载安装包(node-v10.15.0-linux-x64.tar.xz)使用winSCP上传到/software目录下解压到当前目录[root@localhost software]# tar -Jxvf node-v10.15.0-linux-x64.tar.xz[root@localhost software]# lsapache-tomcat-...原创 2019-01-23 10:03:08 · 629 阅读 · 0 评论 -
使用:after制作图标
转自:https://www.cnblogs.com/starof/p/4459991.html首先看效果图:代码如下:<!doctype html><html><head> <title>伪类标签使用</title></head><style type="text/css"&原创 2018-08-04 08:47:47 · 1610 阅读 · 0 评论 -
3d圆锥
效果:代码:<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title&g原创 2018-04-30 12:46:34 · 411 阅读 · 0 评论 -
css3d六面体
用到的css知识:flex布局、transition动画、transform3d效果:代码:<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=ut...原创 2018-04-29 13:17:07 · 1017 阅读 · 0 评论 -
chrome调用本地摄像头
代码下载:试验条件:chrome: 版本 73.0.3683.86(正式版本) (32 位)window7前端代码<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text...原创 2019-06-27 10:22:20 · 11125 阅读 · 6 评论 -
css中的counter、counter-increment、counter-reset
counter-reset:h1; dom中遇到这个就回重置计数器"h1"counter-increment:h1; dom中遇到这个就回在计数器"h1"上加1content: counter(h1) "、"; before或after伪元素中使用content显示出计数器的值示例代码:<!DOCTYPE html><html lang=...原创 2018-08-03 17:21:41 · 440 阅读 · 0 评论 -
使用:after创建浮动图片效果
代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&g原创 2018-08-03 18:06:00 · 747 阅读 · 0 评论 -
使用::after清除浮动
1、首先给浮动的元素加一个父容器2、给这个父容器添加一个样式 clearfixclearfix的设置如下:.clearfix::after{ content: ""; display: block; clear: both; }下面是示例:<!DOCTYPE html><html lang="en">...原创 2018-08-03 17:51:46 · 7930 阅读 · 0 评论 -
babel使用入门
参照:https://blog.csdn.net/mm19931027/article/details/78741128前言:随着ES6普及的范围越来越广,学习并使用它是势在必行的,在正式学习ES6之前,必须对ES6的转换器要熟悉,知名度比较大的是Traceur和babel,今天我就来整理一下我在学习配置babel时的步骤以及遇到的坑,因为刚开始学习,所以写的并不全,之后遇到的坑以及心得,也都...转载 2018-08-17 17:30:47 · 301 阅读 · 0 评论 -
jquery.parser源码解析
/** * parser - jQuery EasyUI * * Licensed under the GPL terms * To use it on other terms please contact us * * Copyright(c) 2009-2012 stworthy [ stworthy@gmail.com ] * *//** * 解析器,首先会根据自原创 2017-06-08 02:01:18 · 1652 阅读 · 1 评论 -
easyui之combo控件分析
/** * combo - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * Copyright 2010 stworthy [ stworthy@gmail.com ] * * Dependencies: * panel * validate原创 2017-06-18 14:01:18 · 2610 阅读 · 0 评论 -
easyui之pagination控件分析
/** * pagination - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * Copyright 2010 stworthy [ stworthy@gmail.com ] * * Dependencies: * linkbutton * *原创 2017-06-19 01:08:14 · 2036 阅读 · 0 评论 -
easyui之panel控件分析
/** * panel - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * Copyright 2010 stworthy [ stworthy@gmail.com ] * *//** * 首先要明白面板的组成,面板的组成是由两部分组成,上面是header原创 2017-06-18 02:44:16 · 2460 阅读 · 0 评论 -
easyui之tree控件分析
/** * tree - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * Copyright 2010 stworthy [ stworthy@gmail.com ] * * Node is a javascript object which contains原创 2017-06-18 01:54:56 · 2555 阅读 · 1 评论 -
easyui之linkbutton控件分析
/** * linkbutton - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * Copyright 2010 stworthy [ stworthy@gmail.com ] *//** * 首先,一个按钮的html元素结构如下: * href原创 2017-06-09 00:43:22 · 1836 阅读 · 0 评论 -
easyui之datagrid控件分析
/** * datagrid - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * Copyright 2010 stworthy [ stworthy@gmail.com ] * * Dependencies: * resizable * li原创 2017-06-18 12:09:02 · 1630 阅读 · 0 评论 -
easyui之validatebox控件分析
/** * validatebox - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * Copyright 2010 stworthy [ stworthy@gmail.com ] * *//** * 太简单,不进行注释分析 */(function (原创 2017-06-19 01:20:21 · 929 阅读 · 0 评论 -
easyloader源码解析
/** * easyloader - jQuery EasyUI * * Licensed under the GPL terms * To use it on other terms please contact us * * Copyright(c) 2009-2012 stworthy [ stworthy@gmail.com ] * *//** * 首先要知道e原创 2017-06-08 01:22:49 · 429 阅读 · 0 评论 -
three.js入门二:相机的zoom参数
透视相机或正交相机都有一个zoom参数,它可以用来将相机排到的内容在canvas上缩放显示。原创 2023-07-26 10:30:31 · 11215 阅读 · 0 评论 -
three.js入门一:入门demo讲解
环境:threejs:129vscodewindowedge关于threejs:开源web3d引擎github:https://github.com/mrdoob/three.js/官网:https://threejs.org/中文教程:http://www.yanhuangxueyuan.com/WebGL/1. 入门Demo<!DOCTYPE html><html lang="en"><head> <meta cha原创 2022-01-20 14:52:41 · 2507 阅读 · 0 评论 -
前端:简单搭建vue3+vite工程
环境:Windows 11 专业版node v14.18.0npm 6.14.15nodejs基础知识:nodejs:window10下的nodejs基本知识之前搭建vue3工程使用:create-vite-app,如: create-vite-app vue3-demo但是这个包已经被丢弃了:所以,我们使用npm init vite@latest开始创建vite项目,如下:使用默认项目名称vite-project,直接回车:需要选择vue框架,然后回车:使用默认vue语法原创 2021-10-10 21:22:38 · 310 阅读 · 0 评论 -
nodejs: 安装全局命令行工具的原理
环境:Windows 11 专业版node v14.18.0npm 6.14.15nodejs基础知识:nodejs:window10下的nodejs基本知识命令行工具:当我们安装了nodejs后,我们可以使用npm install live-server -g来全局安装live-server。安装完成后,我们就可以在命令行中直接使用live-server了。live-server是一个优秀的命令行工具,可以在任意目录下运行 live-server以将这个目录变成web资源。那么,原创 2021-10-10 20:12:13 · 403 阅读 · 0 评论 -
nodejs: npm run xxx原理
环境:Windows 11 专业版node v14.18.0npm 6.14.15nodejs基础知识:nodejs:window10下的nodejs基本知识问题来源:当我们在前端项目中运行 npm run xxxx的时候,就会执行package.json里面scripts下的对应命令,如下:那么,如果我们不借助npm run xxxx的话直接运行可不可以呢?尝试过后是不行的!!!(注意:机器上并没有全局安装vite。)既然直接运行vite报错,那么npm run xxxx又是怎原创 2021-10-10 19:47:56 · 1855 阅读 · 0 评论 -
手机端预览pdf
环境:pdfjs-2.4.456华为nova2s时间:2020-05-09问题来源:系统中需要提供pdf预览的功能,在pc端可以使用浏览器直接打开,但在手机端浏览器不能直接打开、微信也不能直接打开!!!pdf.js:官网地址:https://mozilla.github.io/pdf.js/github地址:https://github.com/mozilla/pdf.js使用这个脚本可以在PC端和手机端打开pdf,这里只用在手机端即可。使用步骤:第一步:下载pdfjs包第二原创 2020-05-09 18:33:36 · 5008 阅读 · 2 评论 -
chrome浏览器启用es6语法支持,初次体验浏览器端模块化加载
参照:http://es6.ruanyifeng.com/#docs/module-loader注意:最新版本的chrome浏览器已支持module语法,需要在web服务器环境下运行!设置浏览器启用es6语法功能:1.在浏览器的url中输入:chrome://flags/设置下面选项为enable,重启浏览器。准备代码:2.index.html<!DOCTY...原创 2018-08-11 11:36:28 · 15820 阅读 · 3 评论 -
微信网页扫码登录的实现
未做实验,临时做个笔记,原文:https://www.cnblogs.com/martianShu/p/5947170.html微信网页扫码登录的实现 为了让用户登录网站的门槛更低,微信扫一扫登录变得越来越广泛,所以最近加紧赶制的项目中有用到这个功能,此篇文字的出发点基于微信开放平台已经配置好域名(80端口)并且认证成功获得app_id和secret并有权限调用微信的接口。好了,就先谈一...转载 2019-12-24 10:12:07 · 849 阅读 · 0 评论 -
chrome浏览器自定义滚动条样式
代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...原创 2019-12-01 18:18:33 · 404 阅读 · 0 评论 -
NodeJs代码调试1(inspector+chrome) 实现谷歌浏览器调试后台nodejs代码
环境:node 10、 谷歌浏览器参照:https://segmentfault.com/a/1190000012155919第一步:安装inspectornpm install -g node-inspector如果遇到错误:改用下面的命令:npm install -g node-inspector@0.7.5第二步:编写server.js文件'use strict';var http = r...原创 2018-05-01 20:33:18 · 3925 阅读 · 0 评论 -
NodeJs代码调试2(inspector+chrome) 实现谷歌浏览器调试后台nodejs代码
node inspector+chrome调试初篇:NodeJs代码调试1(inspector+chrome) 实现谷歌浏览器调试后台nodejs有两个问题:1. 如何在程序运行后立即进入断点而不是等待前台访问后再进入2. 怎样同时两个node程序问题1:代码如下:var http = require('http'); var port = 1337; http.createServ...原创 2018-05-05 23:10:59 · 862 阅读 · 0 评论 -
使用nexus3搭建npm私服
使用管理员账户登录nexus3:这里创建一个npm组、一个npm代理(代理到https://registry.npmjs.org/)、一个本地npm1. 创建npm代理2. 创建本地npm3. 创建npm组4. 配置node的仓库地址 1) 首先查看nodejs的默认仓库地址 2) 查看搭建好的npm私服地址 3) 设置npm私服地址:http://localhost:8081/...原创 2018-05-06 00:12:20 · 10778 阅读 · 9 评论 -
webpack使用
参照:https://segmentfault.com/a/1190000011882193一、准备环境1、安装nodejs 略2、安装webpacknpm i -g webpack安装成功,显示如下:3、安装webpack-clinpm install -g webpack-cli安装成功,显示如下:二、新建一个空工程找一个空的文件夹,命令行内执行:npm init一路回车即可,完成后目录内:安...原创 2018-05-20 18:30:40 · 635 阅读 · 0 评论 -
npm 模块安装机制简介
参照:http://www.ruanyifeng.com/blog/2016/01/npm-install.htmlnpm 是 Node 的模块管理器,功能极其强大。它是 Node 获得成功的重要原因之一。正因为有了npm,我们只要一行命令,就能安装别人写好的模块 。$ npm install 本文介绍 npm 模块安装机制的细节,以及如何解决安装速度慢的问题。一、从 npm install ...转载 2018-05-20 22:32:55 · 241 阅读 · 0 评论 -
详解defer和async的原理及应用
参照:https://blog.csdn.net/liuhe688/article/details/51247484defer和async是script标签的两个属性,用于在不阻塞页面文档解析的前提下,控制脚本的下载和执行。 在介绍他们之前,我们有必要先了解一下页面的加载和渲染过程: 1. 浏览器通过HTTP协议请求服务器,获取HMTL文档并开始从上到下解析,构建DOM; 2. 在构建D...转载 2018-07-23 11:33:05 · 1728 阅读 · 0 评论 -
jQuery之Deferred对象的使用
deferred对象就是jQuery的回调函数解决方案,它解决了如何处理耗时操作的问题,对那些操作提供了更好的控制,以及统一的编程接口/* 使用defered对象方式1var wait = function(){ var dtd = $.Deferred(); //在函数内部,新建一个Deferred对象 var tasks = function(){ a原创 2017-05-06 00:55:38 · 345 阅读 · 0 评论 -
javascript中的闭包
1.闭包的解释关于闭包具体的定义文献中给的概念很抽象,我认为闭包是一种使函数能够都去其它函数的局部变量的语法机制。举个例子:function outFunc(){ var name = "Vicfeel"; function inFunc(){ console.log(name); } return inF原创 2017-03-23 16:02:23 · 294 阅读 · 0 评论 -
原型链图示
1.基本函数原型链:代码:<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <原创 2018-05-01 13:38:46 · 1016 阅读 · 4 评论 -
JavaScript 之 ArrayBuffer
转自:http://www.cnblogs.com/copperhaze/p/6149041.htmlJS里的ArrayBuffer还记得某个晚上在做 canvas 像素级操作,发现存储像素的数据格式并不是Array类型,而是ArrayBuffer,心想这是什么鬼?后来查了一些资料,发现自己这半年来的JS是白学了,竟然才知道还有这么个东东。首先,这个 ArrayBuffer转载 2017-07-23 16:01:44 · 1039 阅读 · 0 评论