关注
分享
hazyram
等风来，不如追风去！一枚前端老菜鸟！
github: https://github.com/hazyram
展开
-
js判断当前处于移动端还是PC端
使用js判断当前处于移动端还是PC端// 判断手机端还是PC端function browserJudge() { var userAgent = navigator.userAgent.toLowerCase(); if ( /ipad|iphone|midp|rv:1.2.3.4|ucweb|android|windows ce|windows mobile/.test(userAgent) ) { return "mobile"; } else { return "com原创 2022-05-07 16:03:42 · 615 阅读 · 0 评论 -
js直接上传文件到阿里云服务器
官方文档1.引入 ali-oss1）页面直接引入：<script type="text/javascript" src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.16.0.min.js"></script>2）安装npm模块npm install ali-oss(引用: const OSS = require("ali-oss"))2. 使用Ossconst client = new OSS({ region原创 2022-05-07 15:47:40 · 1183 阅读 · 0 评论 -
微信网页分享踩过的坑
微信公众号开发文档网上有很多资料配置前端和后端的代码，这里就写写踩过的几个坑① 实现网页分享，即自定义标题，描述以及图标，要使用 企业公众号，个人公众号是没有分享权限的！② 在配置JS接口安全域名时，如果自己还配置了nginx服务器的，需要在nginx的配置文件中，放开txt文件的访问，否则保存时，会出现 访问到www.xxx.com/xxx.txt内容与下载文件不符，请检查文件内容或重新上传原始文件③ 手机端打开页面时，弹出了[object object]，那是 error 函数中 alert 的原创 2021-06-30 14:08:02 · 1675 阅读 · 0 评论 -
nvm下载node版本后，node和npm指令无效
安装各个 node 版本之前（如已安装，先卸载），配置国内镜像：在 nvm 安装目录下的 setting.txt 中，补充如下两句。第一种情况：在安装nvm之后，下载完node的版本，但无法自动下载对应的npm包，导致 node 和 npm 指令失效。卸载 nvm 重新安装，安装路径不能存在空格，比如：Program Files，两个单词中间不能有空格。第二种情况：全部下载完成后，使用 node 版本无效，显示。原创 2021-06-15 11:07:57 · 3485 阅读 · 1 评论 -
element-ui 下载后本地使用
下载地址：vue: https://cdn.jsdelivr.net/npm/vue/dist/vue.jselement-ui-js: https://unpkg.com/element-ui/lib/index.jselement-ui-css: https://unpkg.com/element-ui/lib/theme-chalk/index.css注意：要使用 element-ui 中的字体图标，还要下载 ttf, woff 文件，版本要和 js、css的相对应(直接把上面的地址复制到原创 2021-06-09 16:40:30 · 3615 阅读 · 0 评论 -
because it violates the following Content Security Policy directive: “default-src ‘none‘“
在打开页面时浏览器报如下错误：Refused to load the script 'http://xx.xx.xx.xx:xxxxx/livereload.js?snipver=1' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'default-src' is原创 2021-05-25 15:38:59 · 5048 阅读 · 0 评论 -
justify-content属性无效
之前遇到这个情况，主轴为纵轴，没有设置 height: 100% ，导致属性无效。代码示例：<!--html代码--><div class="container"> <div>1</div> <div>2</div> <div>3</div></div>/*css代码*/.container { display: flex; flex-direction: colum原创 2021-06-09 16:13:13 · 2686 阅读 · 0 评论 -
js实现单个输入框内简单的加减乘除计算
代码示例：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div> <input type="text" id="comp" onchange="compute()"> <button onclick="clearInput()"&原创 2021-05-31 15:21:49 · 1868 阅读 · 3 评论 -
js实现div拖拽
代码示例：// css代码<style> body { // 防止文本选取 -webkit-user-select:none; -moz-user-select:none; -o-user-select:none; user-select:none; margin: 0; padding: 0; position: relative; } #test { position: absolute; width: 100px; height: 1原创 2021-05-27 10:54:21 · 358 阅读 · 0 评论 -
WebSocket的前端实现
关于WebSocket的介绍，网上有很多了，在此就不赘述了，如：菜鸟教程。这里写一下关于多页面实现WebSocket的方式代码示例：// 创建全局对象const websocket = { ws: null, // 保存WebSocket对象 url: "ws://localhost:8080", // 后端什么地址、端口号，这边就写什么，平时地址中写 http或https协议的地方，改成 ws localSocket(userId) { // 参数 userId，作为后端后续发送消息的凭证原创 2021-05-26 11:05:21 · 2816 阅读 · 3 评论 -
取消a标签的跳转行为并为其子元素添加点击事件
代码示例：<html> ... <body> <!-- 点击a标签时不进行任何操作 --> <a href="javascript:;"> <div id="child">xxx<div/> </a> <script> var childEl = document.getElementById('child') childEl.addEventListener(原创 2021-05-25 16:17:02 · 249 阅读 · 0 评论 -
vue-quill-editor的富文本编辑器提交内容时会清除空格以及html保留显示空格的解决方式
1、问题：在富文本编辑器里写完内容提交后，会把文章中的空格默认清空，导致打不打空格，换不换行一个样解决方式：第一次引用模板的时候，在 quill-editor 标签中添加：class="ql-editor"代码如下：<template> <div class="quill-editor"> <quill-editor class="ql-editor" ref="quillEditor" :value="quillContent"/> </d原创 2021-05-24 16:51:58 · 4532 阅读 · 5 评论 -
gulp: primordials is not defined
原因：因为项目是依赖于 gulp(3.9)，node(12)开发完成的，而自己的开发环境是 gulp 版本(3.9)与 node 版本(14)解决方式：第一种方式：重新下载对应的node和npm版本(好像要先卸载再安装)第二种方式：在项目根目录下新建文件：npm-shrinkwrap.json (在安装完所有依赖后，再新建该文件)并在该文件中输入以下内容：{ "dependencies": { "graceful-fs": { "version": "4.2.2" } }}原创 2021-05-21 16:04:07 · 672 阅读 · 0 评论 -
搭建vue脚手架或者创建vue项目时出现“无法加载文件***vue.ps1，因为在此系统上禁止“
解决方式：以管理员身份运行：Windows PowerShell 输入：set-ExecutionPolicy RemoteSigned回车后出现的选项中 选择 A原创 2021-05-21 15:47:05 · 220 阅读 · 0 评论 -
通过js改变input的value值来影响v-model双向绑定的值
通过js改变input的value值来影响v-model双向绑定的值解决方法解决方法/* el --- input 元素 dispatchEvent() --- 给节点分派一个合成事件； 该方法将分派一个合成事件，它由 Document.createEvent() 创建，由 Event 接口或它的某个子接口定义的初始化方法初始化。调用该方法的节点将成为事件的目标节点，该事件在捕捉阶段中第一次沿着文档树向下传播。如果该事件的 bubbles 属性为 true，那么在事件的目标节点自身处理事件后，它原创 2021-05-19 11:21:59 · 1758 阅读 · 0 评论 -
使用Element ui中的el-dialog时页面出现抖动
解决方式：// 全局配置样式body { padding-right: 0 !important}原创 2021-05-21 11:28:14 · 708 阅读 · 0 评论