前端
关注
分享
扫一扫
web
TANKING-
前端开发，php开发，微信开发，小程序开发者！
展开
-
jQuery国内大厂CDN加速链接
jQuery的CDN有很多，但都很不稳定，例如国内的bootcdn经常抽风，还有其他的常见的例如jQuery官方的jsDeliverstaticfile，这些都是经常抽风的。导致使用了线上的CDN的页面打开受到影响，那么就没有国内好用的CDN吗？下面是我汇总的一些大厂的！原创 2024-09-21 22:08:36 · 528 阅读 · 0 评论 -
前端发起网络请求的几种常见方式（XMLHttpRequest、FetchApi、jQueryAjax、Axios）
这是最传统和最常见的方式之一。它允许客户端与服务器进行异步通信。XHR API提供了一个在后台发送HTTP请求和接收响应的机制，使得页面能够在不刷新的情况下更新部分内容。Fetch API是一种新的Web API，提供了一种更强大、更灵活的方式来发起网络请求。它使用Promise对象，简化了对网络请求的处理，并且提供了更友好的API。jQuery是一个流行的JavaScript库，其中包含了简化Ajax调用的方法。通过jQuery的Ajax方法，可以方便地发送各种类型的HTTP请求，并处理响应。Axios。原创 2024-04-30 11:27:22 · 1406 阅读 · 1 评论 -
Vue3+Vue Router使用＜transition＞过渡动画实现左右分栏后台布局
利用Vue3及其配套的Vue Router实现后台管理系统中的页面过渡动画。文章首先简要介绍了Vue3的特性和Vue Router的基本用法，利用Vue3提供的组件以及Vue Router的路由钩子函数来实现页面过渡效果。在 里有4个组件，其中 是左右分栏垂直布局组件， 分别是三个单独的页面，用于渲染在左右分栏布局的右侧，对应的是左侧导航的点击。Layout.vue一般 Vue 路由设置如下所示：在旧版本的 路由中，我们可以简单地用 组件包装 但是，在较新版本的 路由中则必须用 来解构原创 2024-03-06 23:18:03 · 952 阅读 · 0 评论 -
无需公众号实现微信JSSDK分享卡片！Safari浏览器分享到微信自动成卡片！
要在微信分享卡片，需要接入微信自家的JSSDK，比较麻烦，还需要认证公众号，但是如果你没有这样的条件，那么你也可以试试使用iOS的Safari浏览器轻松实现，只需要在html中加入3个meta即可。原创 2023-11-17 19:45:53 · 909 阅读 · 2 评论 -
uni-app提交表单数据到后端
要想接收表单数据，首先要在表单进行数据的绑定，我们可以使用v-model="keyword"进行绑定。 然后在js获取这个绑定的值。index.vue<template><view> <view class="search-con"> <view class="form-con"> <form class="search-form"> <input原创 2020-08-19 10:57:32 · 6593 阅读 · 2 评论 -
原生JavaScript实现的SPA单页应用（hash路由）
单页Web应用 （single page web application，SPA） ，就是只有一张Web页面的应用，是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。单页应用的说法是在JavaScript和AJAX技术比较成熟以后才出现的，指的是通过浏览器访问一个网站时，只需要加载一个入口页面，此后显示的内容和数据都不会再刷新浏览器页面。有了单页应用之后，传统的网站就被称为多页应用了。原创 2023-10-26 18:26:58 · 429 阅读 · 0 评论 -
Vue3项目创建+组合式API使用+组件通信+渲染微博热搜+打包上线
Vue3的组合式API大大减少了代码量，以及使用也方便了很多，本案例使用Vite创建一个Vue3示例，简单介绍Vue3的组合式API使用以及父传子组件传参示例。原创 2023-10-26 18:19:12 · 309 阅读 · 0 评论 -
fetch异步上传图片（附html+JavaScript+php代码）
注意，需要在同一目录下建立upload目录以存放上传的文件。原创 2023-08-10 16:48:49 · 479 阅读 · 0 评论 -
JavaScript写一个最简单的富文本编辑器
当用户点击按钮时，对应的 JavaScript 函数会调用。方法，它会将当前选中文本的样式或属性修改为函数指定的值。方法，从而改变当前选中的文本的样式或属性。方法在一些浏览器中已经被废弃，我们需要考虑使用其他替代方案。当用户点击按钮时，对应的函数会被调用，然后执行。原创 2023-03-21 17:06:35 · 1251 阅读 · 5 评论 -
js写一个路由监听
需要注意的是，在这个示例中我们只监听了 URL 的路径部分，如果需要监听整个 URL，包括查询参数和 hash 值，可以使用。要实现一个简单的路由监听，可以使用浏览器自带的。原创 2023-03-21 16:56:23 · 2250 阅读 · 0 评论 -
html2canvas将指定区域导出为图片（js将div导出为图片）
如何使用JS截取HTML页面为图片呢，html2canvas.js这个插件可以轻松实现。这个原理很简单，就是html2canvas.js可以将当页面渲染成一个Canvas图片，然后保存下来即可。它不需要来自服务器任何渲染，整张图片都是在客户端浏览器创建。原创 2022-12-15 17:42:41 · 1898 阅读 · 1 评论 -
JavaScript一键复制内容（document.execCommand原生JS设置剪贴板）
有时候为了方便用户快速复制页面的内容，一般的做法就是添加一个按钮给用户点击一下就复制下来了，这边使用JavaScript原生的方法进行设置剪贴板。原创 2022-12-15 17:40:24 · 431 阅读 · 0 评论 -
开源作品：引流宝！集活码、短网址等功能为一体的工具！致力于提高引流效率，减少资源流失！
这是一个开源的、免费的、便于协助自己、他人，进行微信私域流量资源获取的工具，更有效率地开展营销推广活动！降低运营成本，提高工作效率，获取更多资源。原创 2022-11-15 11:21:40 · 2282 阅读 · 0 评论 -
llqrcode.js识别二维码，解析二维码信息
llqrcode.js具有扫描二维码功能，用来进行从图片中识别二维码，可解析二维码的信息。作者：TANKING。原创 2022-11-08 10:57:36 · 1545 阅读 · 0 评论 -
使用Vite构建工具快速创建Vue项目
更高效，更快速，更省心的构建vue项目的方法原创 2022-06-06 11:59:32 · 261 阅读 · 0 评论 -
原生Js调用Fetch Api请求接口（新的Ajax解决方案）
Fetch Api是新的ajax解决方案，Fetch会返回Promise；Fetch不是ajax的进一步封装，而是原生js，没有使用XMLHttpRequest对象。原创 2022-06-06 11:55:54 · 1405 阅读 · 0 评论 -
AJAX+PHP上传图片，Jquery无刷新上传图片
index.html<!DOCTYPE html><html><head> <title>AJAX上传图片</title> <meta charset="utf-8"> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script></head><body> <..原创 2021-05-31 11:31:51 · 397 阅读 · 2 评论 -
微信群活码生成系统，群活码、客服活码、一套非常棒的免费开源群活码系统
微信群二维码活码工具，生成微信群活码，随时可以切换二维码！微信官方群二维码有效期是7天，过期后无法扫码进群，或者是群人数满200人就无法扫码进群，如果我们在推广的时候，群满人或者过期了，别人还想进群，我们将会失去很多推广效果，所以有了群活码，可以在不更换链接和二维码的前提下，切换扫码后显示的内容，灵活变换！有人会问这个有什么用？答：例如你需要做一个推广，需要建很多群，群二维码生成之后，到处进行推广，但是群内有人捣乱，踢了还进，这时候你需要把群关了或者把二维码弄失效了，那么你推广出去的二维码就不能用了原创 2021-05-24 12:05:35 · 3122 阅读 · 2 评论 -
【全新官方接口】php检测微信域名拦截，检测微信域名被封
你的域名在微信被拦截的3种常见情况1、域名因违规或有风险被拦截（红色拦截）2、类似taobao.com，douyin.com这种的恶意竞争式拦截，淘宝、抖音等微信的竞争对手一般都是白色拦截（白色拦截）3、有一个中间页的拦截，需要多次点击按钮才可以跳转到你的域名的，多是一些新型域名后缀，例如.top .xyz .link后缀，这种情况，备案后可以解决（备案拦截）通过php get_headers()函数就可以分析到结果这个下标为6是一个URL，在微信访问后正是这个讨厌的页面！如果切换为原创 2021-01-16 17:27:12 · 2166 阅读 · 5 评论 -
InstantClick.js插件，让网页提前预加载，网站无刷新跳转页面
InstantClick，让网站的访问速度获得更大的提升，这是一个js插件，只需要简单配置到你的网站，即可实现网站页面的预加载。演示上面是我的演示，当点击a标签的时候，跳转到一个页面，我们可以看到，浏览器是没有刷新页面的，而是直接更改了浏览器url，全程没有刷新的动作，但是内容已经是另一个页面了。这里提供我的网站给大家操作查看一下演示：https://www.likeyun.cn/pc/代码index.html<!DOCTYPE html><meta cha原创 2021-01-16 17:25:16 · 924 阅读 · 1 评论 -
iframe无刷新提交表单，iframe仿ajax提交表单
本文摘要使用ajax可以实现无刷新提交表单，但有人表示ajax的效率不行，或者是其他缺点，例如客户端臃肿，太多客户段代码造成开发上的成本，如果网速慢，则会出现ajax请求缓慢，页面空白的情况，对客户的体验不好。ajax请求不利于搜索引擎优化，一般搜不到ajax添加到页面的信息。这次就介绍一下iframe仿造ajax异步请求，实际上iframe是同步请求，只是把提交的跳转，发生在iframe的可视区域内。代码index.html<!DOCTYPE html><html原创 2021-01-16 17:23:52 · 338 阅读 · 0 评论 -
原生Js表单验证，Js验证表单是否为空，Js前端验证空值
为了缓解服务器压力，一般先在前端进行验证表单，当然后端也要做验证，后端的验证主要是在技术人员突破前端限制而设计的，是为了整个安全，前端的验证是第一道防线，主要也是可以缓解服务器压力，为了前端能够快速验证，不引入其他库，所以采用原生js验证。<!DOCTYPE html><html><head> <title>原生JS表单验证</title> <meta charset="utf-8"></head>.原创 2020-12-08 22:42:57 · 1124 阅读 · 0 评论 -
Ajax实现搜索联想 搜索关键词提醒 无刷新搜索
搜索联想应用非常广泛，百度，谷歌，搜狗，淘宝，天猫，京东，以及很多网站都有，只需要打上几个字，就有相关的搜索提示。实现方法通过javascript监听搜索框的内容，调用后端即可。（1）javascript监听搜索框的内容（2）把搜索框的关键词传给后端进行搜索（3）搜索到结果，遍历到页面演示代码index.html<!DOCTYPE html><html><head> <title>test</title原创 2020-11-14 18:36:21 · 736 阅读 · 0 评论 -
Html5 Canvas生成淘宝客海报，生成手机海报
现在海报已经是很常见的，毕竟用来做引流推广都是非常方便的，所以我们可以使用Canvas快速绘制海报，下面是我写的一个实例。<!DOCTYPE html><html><head> <title>Canvas</title> <meta charset="utf-8"></head><style type="text/css"> *{ margin:0;原创 2020-08-28 16:21:49 · 1196 阅读 · 1 评论 -
微信小程序Canvas绘制图案（生成海报、朋友圈海报）
现在小程序生成海报是很常见的，例如生成打卡海报、生成文案、生成宣传图、生成推广图等，都是少不了一个技术，就是图片绘制，有些是通过前端Canvas绘制，有些是通过后端绘制，当然前端Canvas绘制是比较节省成本的，效率也高，也相对门槛低，技术也容易实现，后端是会消耗服务器资源，增加服务器压力。index.wxml<!-- 创建一个Canvas组件 --><canvas canvas-id='MyCanvas' class='MyCanvas' style="width:{{scr原创 2020-08-27 18:24:42 · 2938 阅读 · 0 评论 -
微信小程序wx.getUserInfo授权获取用户信息（头像、昵称）
这个接口只能获得一些非敏感信息，例如用户昵称，用户头像，经过用户授权允许获取的情况下即可获得用户信息，至于openid这些，需要调取wx.login来获取。index.wxml<!-- 当已经授权的时候 --><view wx:if="{{result == 'ok'}}" class="result"> <view class="headimg"> <image src="{{avatarUrl}}"></image>原创 2020-08-19 10:52:23 · 20656 阅读 · 4 评论 -
全网 API 最全的图床 ajax图片上传 ajax上传图片
一个第三方图片服务器图片上传储存工具，为个人网站运营者提供图片储存，图片外链生成。提供免服务器的图床上传工具，开发者无法准备图片服务器，使用我们提供的第三方图片服务器，稳定，大厂，均来源各稳定的互联网企业服务器，快速，无服务器压力，多个 API 接口上传，一键上传，一键复制，任意调用，无防盗链等优点。demo:http://upload.likeyunba.com/...原创 2020-07-09 18:26:22 · 852 阅读 · 0 评论 -
Css+Jquery实现点击图片放大缩小预览 图片预览 查看大图
要求点击一张图片，图片就会放大，查看大图，点击空白处就会隐藏大图，回到缩略图。技术要点主要是Jquery进行元素的显示与隐藏。代码<!DOCTYPE html><html><head> <title>qqq</title> <meta charset="utf-8"> <style ...原创 2020-04-16 18:06:36 · 2712 阅读 · 0 评论 -
Html+Css+Jquery实现左侧活动拉伸导航菜单栏
PC端移动端代码<!DOCTYPE html><html><head> <title>左侧导航</title> <meta charset="utf-8"> <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.mi...原创 2020-03-17 11:27:40 · 1557 阅读 · 0 评论 -
.htaccess实现php网站伪静态，百分百可用！
伪静态是啥？很简单，就是假的静态网页...例如有个网页是：www.xxx.com/index.php?id=1这是动态网页，php后缀的如果改成：www.xxx.com/index-1.html那么这是静态网页从.php变成.html就是伪静态那么怎么变呢？需要在网站代码做手脚吗？不需要。。。我们需要在自己的服务器根目录加一个.htaccess文件即可文件里面的代码如下RewriteEngine ...原创 2018-05-07 22:49:32 · 11970 阅读 · 0 评论 -
html+js(swiper.js)+css左右滑动切换页面效果，适配移动端
demo：截图：结构：1、swiper-progress.html2、css文件夹-swiper.css-swiper.min.css3、js文件夹-swiper.min.js-swiper.jsswiper-progress.html<!DOCTYPE html><html lang="en"><head><meta http-equiv="C...原创 2018-05-03 17:24:41 · 16515 阅读 · 1 评论 -
CSS引入外部字体方法，附可用demo
有时候我们做的页面需要用到一些更好看的字体又不想用图片代替，图片会影响加载速度则使用外部字体来显示但是直接通过font-family又不一定全部都行这就需要我们在css中进行定义并且引入字体文件路径然后再使用外部字体直接上代码：font.html<!DOCTYPE html><html><head> <meta ch...原创 2018-02-24 10:22:54 · 56068 阅读 · 1 评论 -
jQuery+PHP实现点击按钮加载更多，不刷新页面加载更多数据！附：可用源码+demo
先上效果：刚打开页面的时候，只显示部分数据，点击加载更多的时候，就会加载我们预先定义的加载数量显示出来！当数据库里面的所有数据都显示出来，就提示全部加载了！新建index.php<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-...原创 2018-02-23 16:05:11 · 2731 阅读 · 3 评论 -
js实现微信禁止h5网页下拉，禁止微信内置浏览器下拉网页，附：demo
在微信里面打开的链接页面如果没有经过特殊处理，下拉的话，会出现这样的情况：大概就是一个深灰色的背景，还有一个源站的域名。本人觉得这个非常丑，并且有时候就不想别人下拉看到我们的源站域名。所以我这里做了一个demo让大家看看：微信扫码：代码：<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type...原创 2018-02-23 14:23:19 · 34185 阅读 · 8 评论 -
ajax提交form表单到数据库(无刷新)
在静态页面提交表单到数据库很简单就是单纯的<form action="test.php" method="post"></form>这个缺点是会刷新页面，会跳转页面的。今天给大家带来的技术就是ajax提交表单优点是不刷新页面，不跳转页面，静默提交的。至于什么是ajax，自己去百度了解。首先我们得要有一个表单提交页面：index.html这个页面由两个部分组成1、表单控件2、...原创 2018-02-16 20:35:01 · 10905 阅读 · 3 评论 -
jQuery+Ajax+js请求json格式数据并渲染到html页面
json格式的数据文件有两种方式一种是xxx.json文件一种是xxx.php文件前者是json格式的文件后者是输出json格式的文件前者是本地的文件后者是获取数据库的数据再输出成json格式的php文件先说前者例如有一个json格式的文件data.json[ { "id":"001", "title":"百度", "ur原创 2018-01-20 11:38:53 · 29972 阅读 · 3 评论 -
ajax实现下拉刷新+上拉加载，附可用demo
上面动图是实现的效果。全程无需重新加载整个页面，只需要上下拉即可刷新数据！index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>上拉加载</title> <me原创 2018-05-29 21:20:36 · 6668 阅读 · 2 评论 -
最新的QQ跳转支付宝并自动领红包脚本。
大半夜的有个哥们缠着我帮他写的（还硬塞300块给我）丢给我一个别人的可用的demo给我，我研究一下就搞出来了代码：alipay.html<html lang="zh-cmn-hans"><head> <meta charset="UTF-8"> <meta name="viewport" content="w原创 2018-06-21 01:03:00 · 16933 阅读 · 12 评论 -
美化文件上传按钮自定义input file样式
input file的样式不能直接用css来美化，我们可以曲线救国，把input file的透明度降低为0，相当于把这个控件隐藏了，实际上只是透明度为0，还是存在的，然后把div套上去，让div充当file的按钮。所以这个办法很简单，但是，把input file的透明度降低，连选择文件后的文件名也被隐藏了，这下可怎么办？那就只能用jquery获取file的文件名了。<!DOCT...原创 2019-08-16 12:21:36 · 1515 阅读 · 0 评论 -
jQuery实现记住帐号密码功能
记住密码是每个有帐号登录的网站必备的，现在说一下通过COOKIE实现的记住密码功能。<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>COOKIE</title></head><body><scrip...原创 2019-03-09 15:05:04 · 1823 阅读 · 1 评论