前端
关注
分享
扫一扫
文章平均质量分 60
分享平时使用到的前端的技术。
Json____
万物OOP | www.wwwoop.com
展开
-
uni-app 框架 调用蓝牙，获取 iBeacon 定位信标的数据，实现室内定位场景
背景：最近需要对接了一个 叫 iBeacon 定位信标 硬件设备，这个设备主要的作用是，在信号不好的地方，或者室内实现定位，准确的找到某个东西。就比如 地下停车场，商城里，我们想知道这个停车场的某个位置，就可以利用这个设备 来找到我们要去的地方。这个设备大概就是长下面的样子，我们通过手机软件调用蓝牙接受这种设备广播出来的数据从而断定我们在什么位置。这也是第一次 和蓝牙打交道，记录一下怎么通过uni-app框架 来获取蓝牙返回的数据。原创 2025-04-02 22:00:04 · 1204 阅读 · 0 评论 -
使用uni-app框架 写电商商城前端h5静态网站模板项目-手机端-前端项目练习
通过 uni-app，开发者可以轻松构建响应式页面，并利用框架内置的 UI 组件快速搭建界面。该模板帮助开发者深入了解 uni-app 的使用方法，并快速实现常见的电商商城功能。以前用vue2 分享过一个电商商城前端静态网站项目-电脑端，需要的小伙伴还是很多的，最近又花了几天更新了一个 手机端的 电商商城h5项目，今天也分享一下实现方案。后续 如果有小伙伴需要 ，慢慢我把这套前端电商商城项目 再结合后端 写成一个完整的项目。今天我们主要来分享一下 uni-app 写的 手机端的 电商商城前端h5静态网站。原创 2025-03-31 23:06:15 · 497 阅读 · 0 评论 -
贪吃灵蛇-纯前端贪吃蛇网页游戏项目源码【2025年蛇年版】
过年这几天放假在家为2025年新的一年增添一些祝福 就 做了一个网页版的 贪吃蛇小游戏。灵蛇献瑞，希望满满，笑语迎春，福运连连。如果你是做IT的兄弟，希望对你有所帮助。祝大家新的一年，愿你每天都能活力满满，愿你生活之路宽又广，事业爱情双丰收。愿你在蛇年里，岁岁年年，富富年年。蛇年好运绵延长，家庭和乐福满堂。蛇年到，好运长，家庭和乐福满堂。生活之路宽又广，事业爱情双丰收。轻松攻克生活中的重重挑战！蛇年展宏图，万事皆胜意。愿吉星高照，蛇舞新春。携手蛇年，共迎新岁，原创 2025-01-30 22:13:42 · 292 阅读 · 0 评论 -
vue2 + element-ui 开发网站拼图小游戏-前端项目
如果我们想快速掌握一门编程语言，最好的办法就是多写代码，多练，然后多去看一些完整的项目，看看别人在开发项目的时候 都使用了什么技术，怎么设计一个软件项目，让项目更健壮稳定。随着关卡的提升，拼图块的数量增加，挑战难度逐步加大。我们在学习前端开发的时候，除了要学习基础编程知识，也需要项目来练习我们所学的编程知识，让我们学的知识有更深的体会，这样才可以做到学以致用。如果分享的这个拼图小游戏对你有所帮助，源码也已经整理好了，需要的可以去看看。项目目录结构还是比较简单的，实际一共做了两个页面 ，原创 2025-03-04 23:51:04 · 680 阅读 · 0 评论 -
使用 Trae Ai代码编辑器 0代码开发静态企业网站！！！
在分享我怎么使用 Trae AI编辑器 0代码开发出来一个前端网站之前，我必须先感慨一下，科技发展的真快啊！高科技真好用啊！我不知道 看到这篇文章的你 是什么时候入行程序员 这个行业的。我是2016年 年底开始接触 编程行业。如果有小伙伴是那个时间段，或者更早入行编程这个行业，尤其是做网站开发方向的程序员，在那个前端这个岗位还没有这么突出的时代，对于后端开发的人 是前端也要做，后端也要写，是那么的苦逼。原创 2025-02-28 00:08:38 · 553 阅读 · 0 评论 -
使用前端 html css 和js 开发一个AI智能平台官网模板-前端静态页面项目
随着人工智能技术的不断发展，越来越多的AI应用开始渗透到各行各业，为不同领域的用户提供智能化解决方案。本网站致力于展示最前沿的AI技术与应用，帮助用户更好地了解AI的潜力与实现方式。该平台的前端页面采用了HTML、CSS、JavaScript等基础前端技术，并结合现代前端开发工具，呈现一个简洁、易于导航、互动性强的用户界面。ChatGPT：介绍ChatGPT的应用场景与技术，强调其在对话生成与智能交互中的优势。解决方案：详细介绍AI技术在各行业中的应用方案，帮助用户理解AI的实际价值。原创 2025-02-26 23:23:50 · 486 阅读 · 0 评论 -
使用html css js 来实现一个服装行业的企业站源码-静态网站模板
该模板包括了多个常见网页页面，如首页、工厂介绍、公司信息、产品展示和联系我们等页面。每个页面都按照实际需求设计，首页展示了简洁的导航和基础信息，工厂介绍和公司页面展示了公司相关内容，产品展示页面用于展示不同的产品，而“联系我们”页面则提供了联系方式和表单功能。HTML 用于构建网站的基础结构，CSS 用于设计网站的样式，包括页面布局、颜色搭配等，JavaScript 则可以用于一些简单的交互效果，如表单验证、图片切换等功能。前端初学者：对于刚接触前端开发的人来说，这是一个理想的编程练习项目。原创 2025-02-18 22:41:22 · 479 阅读 · 0 评论 -
使用vue2 脚手架 结合 Element UI 写一个电商商城前端静态网站模板-前端项目练习
本模板使用了 Vue2 作为前端框架，并集成了 Element UI 组件库，提供了响应式的用户界面和丰富的组件，帮助开发者快速搭建功能齐全的电商商城页面。通过这个模板，用户能够掌握 Vue2 的基本用法和如何使用 Element UI 创建交互式页面。通过实现这些基础功能，用户可以锻炼自己在 HTML、CSS、JavaScript 以及 Vue.js 开发中的实际应用能力，为后续更复杂的项目奠定基础。结算页：展示用户选择的商品和结算信息，支持填写地址、支付方式等。商品搜索页：用户可以搜索和筛选商品。原创 2025-02-18 22:33:45 · 807 阅读 · 0 评论 -
宠物企业宣传网站静态模板 – 前端静态页面开发实例
导航栏、按钮、字体、颜色等细节都经过精心设计，增强了品牌的视觉吸引力。该宠物宣传企业站是一个基于前端技术构建的静态网站，旨在为宠物行业的企业提供一个简洁、现代的在线展示平台。通过开发这样一个静态页面，学习者可以掌握HTML、CSS和JavaScript的基本用法，提升自己的前端开发能力。HTML：HTML负责构建网站的基本结构，包括页面的头部、导航栏、内容区域和页脚等。宠物行业官网：对于宠物相关企业，尤其是初创公司或中小型企业，该网站能够快速搭建并展示品牌形象、服务项目、产品信息等，是一个理想的宣传工具。原创 2025-02-14 21:43:08 · 747 阅读 · 0 评论 -
网页单机版【拼图小游戏】项目练习-初学前端可用于练习~
HTML 是构建网页的基础语言，它的主要作用是定义网页的结构和内容。通过 HTML，可以描述网页上的文本、图片、链接、表格等元素，让页面内容具有明确的层次结构。它可以实现用户与网页的实时互动，如表单验证、动画效果、游戏逻辑等，是前端开发的核心技术之一。三者的有机结合构成了现代网页的三大支柱，是前端开发中必不可少的技术栈。CSS 用于控制网页的样式和外观，它可以使网页更加美观和富有设计感。游戏使用简单明了的 HTML、CSS 和 JavaScript 编写，代码清晰易懂，非常适合作为前端初学者的练手项目。原创 2025-01-01 17:01:01 · 502 阅读 · 0 评论 -
网页单机版五子棋小游戏项目练习-初学前端可用于练习~
HTML 是构建网页的基础语言，它的主要作用是定义网页的结构和内容。通过 HTML，可以描述网页上的文本、图片、链接、表格等元素，让页面内容具有明确的层次结构。它可以实现用户与网页的实时互动，如表单验证、动画效果、游戏逻辑等，是前端开发的核心技术之一。三者的有机结合构成了现代网页的三大支柱，是前端开发中必不可少的技术栈。今天给大家分享一个 前端练习的项目，技术使用的是 html css 和javascrpit。CSS 用于控制网页的样式和外观，它可以使网页更加美观和富有设计感。具体代码 已经打包好了。原创 2025-01-01 16:36:47 · 738 阅读 · 0 评论 -
前端node环境安装：nvm安装详细教程（安装nvm、node、npm、cnpm、yarn及环境变量配置）
需求：在做前端开发的时候，有的时候 这个项目需要 node 14 那个项目需要 node 16，我们也不能卸载 安装。这个时候 就需要 一个工具 来管理我们的 node 版本和 npm 版本。百度后 又是 让给 自己创建的文件夹 权限 又是 清除 c盘下的 .npmrc 文件。大家不要用混了~ 哈哈。如果有C:\Users\用户名\AppData\Roaming\npm，修改为D:\app\nodejs\nvm\nodeGlobal。就新建D:\app\nodejs\nvm\nodeGlobal。原创 2024-12-10 11:41:40 · 1159 阅读 · 0 评论 -
微信公众号开发 短视频 去水印 抖音 快手
学习QQ：870422471实现内容：1、用户模块 2、短视频解析去水印 3、回复模板消息/被动回复消息 4、小程序视频下载 5、自定义回复需要材料：1、微信服务号 2、相同主体小程序 3、商户主要实现思路：用户关注公众号后，通过被动回复指引进行登录操作。登录完成后，解析用户发送的文本内容。开发者可使用正则对内容进行匹配，匹配出视频连接后进行解析。并使用模板消息进行回复...原创 2019-08-12 11:38:18 · 1521 阅读 · 0 评论 -
Chrome 谷歌浏览器清除HTTPS证书缓存
在地址栏输入chrome://net-internals/#hsts输入对于的域名执行删除就行了原创 2019-09-16 16:42:35 · 7985 阅读 · 0 评论 -
Vue的生命周期
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue的生命周期</title> <script type="text/ja原创 2018-07-19 09:29:09 · 255 阅读 · 0 评论 -
Vue v-for指令
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>v-for</title> <script type="text/javas原创 2018-07-18 11:59:05 · 348 阅读 · 0 评论 -
谷歌浏览器插件-多语言翻译插件-免费好用简单开源
打开浏览器 ——打开管理扩展程序，如果不知道 “管理扩展程序”在哪，百度即可。点击加载已解压的扩展程序 ，页面出现“多语言翻译插件”扩展程序， 则安装成功。谷歌浏览器翻译插件，支持中、英、日、韩、俄、中文繁体多种语言翻译~基于translate.js 实现的 免费 谷歌多语言翻译插件。安装成功后 ，浏览器右上角会出现一个“ 译” 字，点击即可使用。点击你要翻译的语言即可，注意如果切换语言，需要点两下。把收到的压缩包解压出来，放到任意磁盘里。原创 2024-07-16 23:26:05 · 5894 阅读 · 0 评论 -
JS处理支付宝和微信(同步提交/异步提交)方式
PHP交流群:294088839Python交流群:652376983GO交流群:874512552<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>个人信息</title> </head>原创 2018-11-08 10:20:46 · 872 阅读 · 0 评论 -
利用NativeShare.js实现移动端分享功能
原文地址 https://github.com/fa-ge/NativeShare/blob/master/README.md下载地址：https://github.com/fa-ge/NativeShare起因最近有一个活动页需要在移动端浏览器分享网页到微信，QQ。虽然每一个浏览器都有分享到微信的能力，但不是每个都提供接口供网页来调用。及时有提供，浏览器暴露出的api也各不相同，而我写...转载 2019-02-23 17:13:07 · 1752 阅读 · 0 评论 -
js倒计时小功能
PHP交流群:294088839,Python交流群:652376983function timeD(){ var num=$(".goTel").text()-0; console.log(num); num--; if(num==0 || isNaN(num)){ console.log('进来了'); $(".goTe...原创 2018-09-29 11:48:16 · 376 阅读 · 0 评论 -
使用百度的富文本编辑器UEditor遇到的问题总结
1、下载地址：http://ueditor.baidu.com/website/download.html（我下载的是.net版本）下载后要先看一下ueditor.config.js和 net/config.json的文件，里面是关于图片上传和其他方法的一些路径配置2、显示编辑页面（一定要看使用文档：http://fex.baidu.com/ueditor/#server-depl...转载 2018-12-12 11:00:32 · 1696 阅读 · 0 评论 -
Vue制作模板
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue制作模板</title> <script type="text/jav原创 2018-07-19 09:29:39 · 621 阅读 · 0 评论 -
Vue v-model指令
技术QQ交流群:294088839 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>v-model</title> <script type="text/原创 2018-07-18 12:00:37 · 753 阅读 · 0 评论 -
jQuery中利用递归思想练习自定义动画
技术QQ交流群:294088839 自定义动画 div{ width: 100px; height: 100px; background:red; position: absolute; top: 50原创 2017-06-23 00:55:55 · 766 阅读 · 6 评论 -
Vue v-if v-else v-show指令
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>v-if v-else v-show</title> <script type=&qu原创 2018-07-18 11:59:39 · 228 阅读 · 0 评论 -
jS写一个倒计时天数练习
Document var dateLOa=new Date(); var dateLOa1=new Date('2017/5/1'); var dateLOa2=dateLOa1-dateLOa; var dateLOa3=dateLOa2/1000; var dateLOa4=parseInt(dateLOa3/(60*60原创 2017-06-16 21:42:05 · 1082 阅读 · 0 评论 -
Vue cli项目目录详解
技术QQ交流群:2940888391.build目录 核心目录 webpack有关的2.config目录 项目开发配置3.node_modules 这个一般不用管4.src 最重要的 我们所有开发都在里面5.static 静态文件目录|-- build // 项目构建(webpack)相关代码| |-- build.js ...原创 2018-07-21 16:16:01 · 554 阅读 · 0 评论 -
使用JS写一个计算器练习
小小计算器+-*/%=开始计算function calc(){var num1=Number(document.getElementById('num1').value);var num3=document.getElementById('num3').value;var num2=Number(document.ge原创 2017-06-16 21:20:34 · 889 阅读 · 0 评论 -
Vue 构造器 Vue.extend
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>构造器 Vue.extend</title> <script type="t原创 2018-07-18 11:57:16 · 313 阅读 · 0 评论 -
Vue 实例方法
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue 实例方法</title> <script type="text/ja原创 2018-07-20 17:32:56 · 376 阅读 · 0 评论 -
JS中的apply和arguments小练习
apply和arguments Function.apply(obj,args)方法能接收两个参数 obj：这个对象将代替Function类里this对象 args：这个是数组，它将作为参数传给Function（argsarguments) -->可能都得费一会功夫,借助apply的这点特性,所以就有了以下高效率的方法 --> v原创 2017-06-16 21:09:39 · 705 阅读 · 0 评论 -
实例入门 实例属性
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>实例入门 实例属性</title> <script type="text/j原创 2018-07-20 17:32:29 · 246 阅读 · 0 评论 -
Vue Methods Option 方法选项
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue Methods Option</title> <script type=&qu原创 2018-07-19 16:06:43 · 1033 阅读 · 0 评论 -
JS中的冒泡简洁理解
事件冒泡微软提出了名为事件冒泡(event bubbling)的事件流。事件冒泡可以形象地比喻为把一颗石头投入水中，泡泡会一直从水底冒出水面。也就是说，事件会从最内层的元素开始发生，一直向上传播，直到document对象。JS事件冒泡 点击我function ad(){ alert('我是最外层');}fu原创 2017-06-16 21:34:09 · 1131 阅读 · 0 评论 -
Vue v-bind指令
技术QQ交流群:294088839 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>v-bind</title> <script type="text/j原创 2018-07-18 11:58:32 · 460 阅读 · 0 评论 -
Vue 自定义指令
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>自定义指令</title> <script type="text/javas原创 2018-07-19 09:28:31 · 273 阅读 · 0 评论 -
Vue 初识Hello word
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Hello word</title> <script type="text/原创 2018-07-18 11:58:01 · 303 阅读 · 0 评论 -
Vue 内置组件 -slot讲解
技术QQ交流群:294088839<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue 内置组件 -slot讲解</title> <script type="原创 2018-07-21 12:09:09 · 424 阅读 · 0 评论 -
使用JS写一个用鼠标拖动DIV到任意地方
Document div{ width:200px; height:200px; background:red; }原创 2017-06-16 21:26:03 · 2364 阅读 · 0 评论 -
jQuery选项卡小练习
选项卡 *{ margin:0; border:0; padding:0; } .box{ width: 1000px; margin:50px auto; }原创 2017-06-22 00:57:09 · 435 阅读 · 0 评论