实战
文章平均质量分 68
岛泪
这个作者很懒,什么都没留下…
展开
-
ThinkPHP 远程一对多关联
php// 不是默认主键名称记得定义 pk 属性// 获取商品详情以及商品的评论// 第二个参数是所用到的关联方法的方法名// 远程一对多关联获取商品的所有评论// 完整写法。原创 2023-07-19 11:23:02 · 444 阅读 · 0 评论 -
PHP 造轮子 之 模板引擎
缓存功能还没开发。<?phpnamespace s;class Template{ private static $content = null; private static $app_path = null; private static $public_path = null; public static function compi...原创 2020-03-08 00:22:43 · 349 阅读 · 0 评论 -
基于节点创建虚拟DOM
该算法通过递归已存在的节点从而创建出虚拟DOM。function createVNode(node, vNode) { let props = {}; let children = []; if(node.nodeType === 1){ Array.from(node.attributes).forEach((key) =>{ ...原创 2020-01-22 20:37:01 · 515 阅读 · 0 评论 -
基于节点的 Diff 算法
该算法比较新旧两个节点的差异,在最大程度复用旧节点的基础上把旧节点更新为新节点。该算法的策略和 React 的tree diff 一样,只比较同级节点,并且不移动节点,应该说不需要移动节点,因为新节点已经是真实的节点,而不是虚拟的节点。function diff(oldNode,newNode){ if(oldNode.isEqualNode(newNode)){ ...原创 2020-01-21 15:59:03 · 381 阅读 · 0 评论 -
手写一个不需要虚拟DOM的MVVM框架 —— Sue.js
我手写了一个 不需要虚拟DOM 的 MVVM 框架,已经实现v-htmlv-textv-ifv-showv-model绑定事件现在在做 v-for感觉已经做不下去了。原创 2020-01-14 15:41:12 · 301 阅读 · 1 评论 -
造轮子之 高性能滚动监听 + 导航高亮 + 点击导航滚动跳转 + sroll节流
基于浏览器窗口滚动监听↑离开检测↑进入页面时会检测一遍有没有符合条件的元素 ↑点击导航滚动跳转↑基于DOM元素滚动监听 + 离开检测↑点击导航滚动跳转↑也有进入页面时检测一遍有没有符合条件的元素的功能,就不上图了开发过程最近喜欢造轮子,滚动监听是我造轮子计划中的一部分,因为它太常见了。一开始我研究了B...原创 2019-12-27 22:13:35 · 588 阅读 · 1 评论 -
造轮子之 高性能轮播图
实现的功能有(图片看起来有点卡,但事实上是非常非常流畅的轮播图)无缝轮播。实现原理:如上图所示,这里有5张图片,而事实上这里有7张图片。在最开头有一张最末尾的图片,在最末尾有一张最开头的图片,所以总共7张图片,队列上就像是这样的6- 1 - 2 - 3 - 4 - 5 - 1 排列,当5移向末尾的1时,视觉上就像回到首位的1一样,移动完成时一瞬间把位置移回首位的1即可。...原创 2019-12-21 01:29:17 · 454 阅读 · 0 评论 -
造轮子之 确认框
确认框是模态框的一种具体用途,非常常见也非常实用。第一种是没有遮罩层的确认框第二种是有遮罩层的确认框(并隐藏掉右边滚动条)第二种确认框源码下载地址https://gitee.com/island_tears/confirmation_box使用说明引入 confirm.js 和 confirm.css 文件。 使用前先实例化 confirm 对象...原创 2019-12-11 22:19:59 · 425 阅读 · 0 评论 -
ul、li 标签实现完美表格
第一种是没有缺口的,如下图第二种是有缺口的,如下图两种表格的最大特点就是不用给表格里的每个 li 元素都单独设置 css 样式,要用的时候直接闭着眼睛循环 li 标签即可。第一种的特点是1、内边框的大小是一致的。2、内边框的大小和外边框的大小可以分别设置。3、内边框和外边框的颜色可以分别设置。4、每个小方框的白色部分大小是一致的(空缺部分不算)。...原创 2019-12-03 22:52:07 · 4617 阅读 · 0 评论 -
仿造虎扑步行街首页。
原网站https://bbs.hupu.com/all-gambia我非常喜欢虎扑,所以我打算仿造一个虎扑论坛,这是仿造的第一个网页,也是虎扑步行街的首页,我仿造这个页面并对这个页面进行了优化,比如1.放弃了浮动布局,全部采用了flex布局。2.网站布局和特效纯采用html+css的方式实现,比原网站流畅了许多,比如关注虎扑、消息、重点是左边导航栏的特效比原网站流畅非常多。3.加...原创 2019-12-03 02:07:14 · 3855 阅读 · 1 评论 -
原生 javascript 实现 分页条
黑色方框只是为了更好地演示而加上去的。该分页条最大的特点就是即可以把分页条的高度和宽度条设成固定的高度和宽度,也可设置成随父元素的高度和宽度。当把分页条的宽度设置成随父元素的宽度时,只要父元素的宽度是可以随屏幕变化,则分页条的宽度也可以随屏幕变化,这样分页条就可以实现自适应屏幕宽度了。<!DOCTYPE html><html lang="zh...原创 2019-10-19 00:02:34 · 483 阅读 · 0 评论 -
多个Div拖动(加强版)
https://blog.csdn.net/weixin_44161401/article/details/89629340上面这个是最开始的实现方案,但是有一个缺点,就是鼠标移出滑块的时候,滑块会停止移动,而这次的加强版利用全局变量的方式,克服了这个缺点,这次就算速度拉得再快,滑块照样会跟着鼠标移动。<!DOCTYPE html><html lang="zh-CN"...原创 2019-04-29 23:24:51 · 1347 阅读 · 0 评论 -
拖动验证(前端+后端)
按照自己的思路写了一个拖动验证,不知道别人是不是这样写的,我觉得方法应该差不多。不废话,上代码。<?php require_once 'Check.php'; if($data = Check::create()){ $x = $data['x']; $y = ($data['y'] - 5).'px'; $name = $data['na...原创 2019-05-05 01:59:11 · 2852 阅读 · 0 评论 -
多个Div拖动
<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv=...原创 2019-04-28 01:31:29 · 925 阅读 · 0 评论 -
使用javascript 和 $.ajax 实现文件(图片)上传。
<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv=...原创 2019-04-22 00:40:27 · 321 阅读 · 0 评论 -
Div 拖动
解决思路就是想办法获得滑块距离左边元素的距离。方法一<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1....原创 2019-04-26 00:30:30 · 578 阅读 · 0 评论