最近工作中用到了jQuery UI中排序和拖拽功能,花了大概一天的时间,搞清楚了大概的参数配置,以及遇到的一些问题,总结如下。...// 拖动时使用的是clone的元素。如果值设置为"clone", 那么该元素将会被复制,并且被复制的元素将被拖动。...// 之所以不使用 helper: 'clone', 是因为clone的元素没有样式,所以我们需要自定义样式,所以使用了自定义函数。...selector = '.ptype-'+me.selectedSubType; $(selector).droppable("destroy"); }, 参考链接 https://www.html.cn/jquery-ui-api.../sortable/ https://www.html.cn/jquery-ui-api/draggable/ https://www.html.cn/jquery-ui-api/droppable
一、什么是 Mint UI 1、Mint UI 包含丰富的 CSS 和 JS 组件,可以提升移动端开发效率 2、Mint UI 按需加载组件 3、Mint UI 轻量化 二、Mint UI 的安装 1、...在项目根目录终端引入: npm i mint-ui -S 2、在 main.js 中加入: import MintUI from 'mint-ui' import 'mint-ui/lib/style.css...' 同时在 main.js 中通过全局方法 Vue.use() 使用 MintUI Vue.use(MintUI) 完整示例: main.js 文件: import Vue from 'vue' import...$mount('#app') 三、Mint UI 的使用 这里引用 Mint UI 的 Toast 组件作为例子 (1)在页面的 script 中导入 Toast 组件 import { Toast...Mint UI import { Toast } from 'mint-ui' export default
当然一般的企业开发或者web开发中,使用到2个或3个数就足够了。太多了树形结构对于用户来说,也非常复杂。...个人推荐不是非常复杂的需求都可以考虑使用zTree,因为它的授权许可是MIT,你可以自由获取,修改和分发给他人。...项目中主要使用到jQuery UI里面的draggable和droppable,因为很多老的浏览器都不值html5的drag api。...我自己也没有去查看zTree的源代码,所以也不知道zTree底层拖拽实现是否也是使用了jQuery UI的draggable和droppable方法。...第三部分--方案思路: 1.了解jQuery draggable和droppable方法和工作原理 2.递归思想 3.各个击破 4.熟练使用jQuery操作dom结构 第四部分--参考网址: 1.http
介绍 Element UI 是一个基于 Vue 2.0 的桌面端组件库,主要用于构建快速、简洁的用户界面。...注意事项: Vue 版本兼容性:Element UI 主要与 Vue 2.x 版本兼容,如果你在使用 Vue 3.x,可能需要考虑其他 UI 框架,或者使用 Element Plus,它是 Element...维护性:由于 Element UI 是一个由社区维护的开源项目,在使用中可能会出现一些问题或 bug,在生产环境中使用时,务必要测试所有的用例,并关注官方的更新和通知。...查看项目结构,Element UI组件都被安装在node_modules下,至此Element UI安装成功 3-2 引入Element UI组件库 1.打开main.js,添加下面红色内容内容至红色方框...,记得安装Vetur扩展 5.运行,查看结果,显示按钮成功 结语:以上就是Element UI 组件的快速入门使用,希望对各位看官有所帮助,感谢各位看官的观看,谢谢~
在你的网站上使用图标可以让你有效地与你的访问者交流:它们增加了可读性,突出了重要的内容,加强了功能或特性,增强了设计。因此,使用现成图标是很好的一个选择。...image.png 最佳图标库的列表 Flaticon 网址:https://www.flaticon.com/packs 格式和类型:PNG, SVG, EPS, PSD, and BASE 64,...此外,还可以将 Fontisto 与适合的软件包管理器一起使用:npm,yarn,bower等。...如果找不到自己喜欢的东西,或者只是想要专门为我们品牌设计的自定义图标,也可以与网站上的一些最佳设计师合作。...我们可以使用纯CSS3更改颜色,阴影,背景渐变以及几乎所有其他内容。 使用此库的另一个原因是,它已完全优化,并且完全不需要JavaScript,因此没有兼容性问题。
jQuery,让我们控制页面元素更加方便快捷,让我们在编写js的时候不需要过多地考虑浏览器特性问题了。但是jQuery功能越强大,它本身的文件也越大。...Google挺够意思,就提供了jQuery库,通过使用Google提供的jQuery库,Google的服务器和线路品质那自然是不在话下的。即提高了下载速度又减少了自己服务器的并发连接数。...我们只需要在页面里引用一个js文件,就可以根据需要实时加载用到的js库了。...,可以这样使用: google.load("jquery","1.3.2"); 这样我们就从Google的最近的CDN镜像上加载了jQuery 1.3.2版的js库,接下来就可以正常写js代码了。...可以参考:google AJAX 库 API 除了jQuery,Google还提供供了以下这些js框架/库的API: jQuery UI Prototype script.aculo.us
而在jQuery中用attr()与removeAttr()就可以全部搞定了,包括兼容问题 attr()获取和设置元素属性 attr(传入属性名):获取属性的值 attr(属性名, 属性值):设置属性的值...为了属性操作封装的,直接在一个 jQuery 对象上调用该方法,很容易对属性进行操作,也不需要去特意的理解浏览器的属性名不同的问题 dom概念的区分: Attribute和Property翻译出来都是...()方法内部使用的是DOM的innerHTML属性来处理的,所以在设置与获取上需要注意的一个最重要的问题,这个操作是针对整个HTML内容(不仅仅只是文本内容) .text() .text() 得到匹配元素集合中每个元素的合并文本...()结果返回一个字符串,包含所有匹配元素的合并文本 .html与.text的异同: .html与.text的方法操作是一样,只是在具体针对处理对象不同 .html处理的是元素内容,.text处理的是文本内容....html只能使用在HTML文档中,.text 在XML 和 HTML 文档中都能使用 如果处理的对象只有一个子文本节点,那么html处理的结果与text是一样的 火狐不支持innerText属性
目录 使用jQuery js与jQuery代码对比 jQuery选择器:用来选中元素 基本方法 ---- js与jQuery代码对比 jQuery选择器:用来选中元素 基本方法 使用jQuery jQuery...是什么:jQuery是JavaScript的类库,封装了很多js代码。...3.3.1 建议下载开发版本 2、HBuilder使用 创建项目 3、把jQuery库复制到项目中的js文件夹中 4、引入jQuery库文件: 注意:script标签中不要写内容,写jQuery代码就再写一对...script标签 js与jQuery代码对比 案例1:点击按钮获取文本框中的值(JS对比jQuery),如下图 JS版: jQuery版: 先引入jQuery库 jQuery选择器:用来选中元素 ...选择器还可以组合多个一起使用,可以分为并集和交集。
一起学习PHP中GD库的使用(一) 又到了一个大家非常熟悉的库了,对于图像图形的处理来说,GD 库是 PHPer 们绕不过去的一道坎。...获取图片基本信息 getimagesize(),获取图片信息的这个函数,从名字上看是获取图片大小的一个函数但也包含一些其它的信息,而且这个函数其实和 GD 库没什么太大的关系,也就是说不需要 GD 库的扩展其实这个函数也是可以使用的...3) 和 IMAGETYPE_PNG 与之后的结果就是 IMAGETYPE_PNG 本身的值,这就说明当前系统中是支持这个图片类型的操作的。...这个最终生成的图片中,中文也是乱码的,不过它已经是可以当做一个图片验证码来使用了,是不是非常地简单? 总结 今天的内容不多,也都是比较基础浅显的一些函数的使用。...测试代码: https://github.com/zhangyue0503/dev-blog/blob/master/php/202012/source/1.一起学习PHP中GD库的使用(一).php
一起学习PHP中GD库的使用(二) 在日常的开发过程中,GD 库最常用的功能就是帮我们对图片进行一些处理,当然,除了处理已有的图片之外,它也可以直接来画图,就像我们最常见的图片验证码。...它们为画布填充颜色的流程不一样,imagecreate() 不需要使用 imagefill() 进行填充背景色,直接使用 imagecolorallocate() 就会以第一次调用的 imagecolorallocate...填充背景色 接下来,由于我们使用的是 imagecreatetruecolor() ,所以我们要对画布进行背景色的填充。...最后,我们再使用 imagedestroy() 释放掉图片句柄解除图片文件的内存占用。...测试代码: https://github.com/zhangyue0503/dev-blog/blob/master/php/202012/source/2.一起学习PHP中GD库的使用(二).php
一起学习PHP中GD库的使用(三) 上篇文章我们已经学习了一个 GD 库的应用,那就是非常常用的制作验证码的功能。...不过在现实的业务开发中,这种简单的二维码已经使用得不多了,大家会制作出更加复杂的二维码来使用。毕竟现在的各种外挂软件已经能够轻松地破解这种简单的图片验证码了。...当然,我们也可以简单地对他进行变形,比如使用中文然后按顺序点击之类的,这些都比较简单地就能实现。更复杂的二维码则推荐使用一些开源的库或者api来实现。 今天,我们将继续学习 GD 库的一些常用的应用。...总结 关于图片 GD 库的功能函数还有很多,但说实话,笔者现在都已经用得不多了。为什么呢?在实际的业务开发中,大家其实都已经习惯使用 oss 、七牛、upyun 之类的云存储了。...测试代码: https://github.com/zhangyue0503/dev-blog/blob/master/php/202012/source/3.一起学习PHP中GD库的使用(三).php
jQuery简介 jQuery是继Prototype之后又一个优秀的JavaScript库,是一个由John Resig创建与2006年1月的开源项目。...现在的jQuery团队主要包括核心库、UI、插件和jQuery Mobile 等开发人员以及推广和网站设计、维护人员。...这种将行为层与结构层完全分离的思想,可以使jQuery开发人员和HTML或其他页面开发人员各司其职,摆脱过去开发冲突或个人单干的开发模式。...使用jQuery的选择器 在开始使用jQuery之前,首先应该明确一点,在jQuery库中,\就是jQuery的一个简写形式,例如\("#foo") 等价于 jQuery("#foo"),\.ajax...传入标签的id值,然后在值的前面加上 # (与css中的选择器命名一样)即可,无论css中是否有定义该id选择器都可以这么使用,示例: <!
安装Postcode 使用postcode测试get接口 使用postcode测试post接口 接口文档 ...什么是接口文档 接口文档的组成部分 接口文档示例 ---- 接口 接口的概念 使用Ajax请求数据时,被请求的url地址...方式请求接口的过程 接口测试工具 什么是接口测试工具 为了验证接口能否被正常访问,我们常常需要使用接口测试工具,来对数据接口进行检测。...安装失败的话,会提示手动安装,手动安装再导入也可以, 使用postcode测试get接口 步骤 选择请求的方式 填写请求的URL地址 填写请求的参数 点击Send按钮发起...使用postcode测试post接口 步骤 选择请求的方式 填写请求的URL地址 选择Body面板并勾选数据格式 填写要发送到服务器的数据 点击Send按钮发起POST请求 查看结果 提交数据 要选择
Vue官网对于插槽的介绍比较简略,插槽本身也比较“烧脑”,很容易看晕,我就一直没看懂,直到 使用了element-plus的组件的插槽。 其实我们可以换一个角度来理解插槽,就会豁然开朗了。...我们可以参考一下UI库的组件,他们有很多插槽的实际应用,比如 el-input、el-table等。 具名插槽。 “具名”是个啥意思?感觉用“命名插槽”更好理解一些。...如果一个组件只有一个插槽,那么不用写名称,Vue会使用默认名称:default 。 如果一个组件有多个插槽的话,那么就需要起名来区分不同的插槽。...还是看看UI库组件 el-table 的插槽 。 父组件设置列表数据,传递给子组件,子组件渲染 table 表格。 为了更灵活,组件提供了自定义列的功能,采用的就是作用域的插槽。...UI库的 table 的二次封装 不用自定义列: 使用自定义列
现代数据库系统在应用中面临性能瓶颈和数据一致性保障的双重挑战,尤其是在海量数据环境下,如何确保数据的安全性和可恢复性成为核心问题。有效的备份与恢复策略是保障数据库稳定运行、避免数据丢失的重要手段。...本文围绕YashanDB数据库的备份与恢复机制展开深入技术解析,旨在帮助数据库管理员(DBA)、系统运维以及开发人员理解和掌握YashanDB的备份恢复技术特点与最佳实践。1....备份分为全库备份、增量备份和归档备份三大类型,满足不同恢复与性能需求:全库备份:完整复制整个数据库所有物理文件,实现数据完整快照,适用于灾难恢复的基础方案。...恢复策略与流程恢复流程分为全库恢复、增量恢复及归档恢复,支持基于时间点的恢复(PITR)。恢复时,可按如下步骤执行:全库恢复:从备份集中恢复控制文件、数据文件及归档日志,完成数据库结构及数据的还原。...正确配置备份并发线程数参数,平衡服务器资源负载,确保备份速度及数据库业务性能。遵循备份恢复操作规范,避免直接操作物理文件,使用官方运维工具进行管理,防止数据损坏。
在本文中,我们将探索在构建下一个项目时使用UI组件库或CSS框架的主要好处,然后我们将介绍一些目前市场上免费选项的绝佳选择! 为什么要使用UI组件库?...下面我们将更详细地介绍使用UI组件库的好处,但总的来说,它有很多原因可以带来好处: 用户友好:当你开始使用库时,你不需要从头开始了解样式和创建元素的所有来点——只需使用库中已有的内容!...原型允许你在投入太多时间之前测试不同的设计,并查看哪种设计效果最佳。...无论UI组件库有多有用,在决定使用UI组件库之前,它仍然会附带一些你需要了解的注意事项: 一些UI库的自定义选项比其他库少,这意味着它们可能不够灵活,以满足你的需求。...它提供了一组预构建的UI组件,可用于任何Web项目。它建立在普通CSS和jquery之上,为你的应用程序提供了干净一致的基础。 Semantic UI是一个免费的开源库,可帮助你自信地构建用户界面。
针对YashanDB数据库,本文梳理其系统架构及核心模块的技术特性,深入分析监控指标与运维流程,旨在为数据库管理员和运维工程师提供全面、科学的技术指导。...YashanDB的逻辑架构 包括客户端驱动、SQL引擎、PL引擎、存储引擎及基础设施库,模块化设计满足灵活运维与性能优化所需。...线程资源:捕获工作线程、后台线程及网络通讯线程的负载及异常状态,防止线程饥饿。存储性能:监测数据文件和表空间使用率、表和索引的空间碎片及膨胀,及时触发表/索引重建。...最佳技术建议合理选择部署形态,依据业务规模和性能需求选择单机、分布式或共享集群。根据业务特点调整内存配置参数,确保共享缓存和数据缓存充裕,减少物理I/O。...监控关键性能指标,建立包括实例状态、内存使用、线程活跃度、存储空间、事务锁情况和日志同步状态的监控体系。定期收集和刷新统计信息,优化查询计划,避免因统计信息过旧导致的执行计划失效。
在现代数据库管理系统中,API的设计对于确保数据库的可操作性和易用性至关重要。如何设计一个高效、易用且可扩展的API,成为了开发人员和DBA们迫切需要解决的问题。...设计不佳的API不仅会导致开发过程中的不便,也会影响最终用户的应用体验。因此,合理的API设计原则和最佳实践显得尤为重要。1....在文档中提供关于版本变化的重要更新提示以及迁移指南,会使用户在适应新版本时更加顺利。3. 兼容性与稳定性随着业务需求的变化,API可能需要进行更新和改进。然而,对既有的用户造成影响的变更应当尽量避免。...总结综上所述,YashanDB数据库的API设计应遵循清晰的接口设计、充分的文档支持、兼容性与稳定性、性能考量、安全性考虑以及社区反馈等原则。...实施这些最佳实践有助于提升API的可用性、可维护性和安全性,从而增强开发人员及最终用户的技术体验和效率。
在使用现代数据库技术时,如何优化查询速度是开发人员和架构师面临的重要挑战之一。这不仅影响应用程序的性能,还直接关系到用户体验和系统的可扩展性。...本文将分析并提出改进YashanDB数据库在微型服务架构下的查询效率的最佳实践。YashanDB架构分析YashanDB是一款支持高性能、高可用的分布式数据库,具备丰富的数据存储和处理能力。...核心技术与功能解析YashanDB通过高效的SQL引擎、存储引擎和PL引擎相结合,实现数据处理的高效性。...同时,PL引擎可以定义复杂的数据操作,提高了数据处理的灵活性和效率。优化查询速度的最佳实践1. 数据库设计优化在微型服务架构中,每个服务对应独立的数据库或数据库实例,设计合理的数据库结构至关重要。...自定义其他复杂业务逻辑时,建议使用PL语言实现。4. 数据库连接管理在微型服务架构中,每个服务可能会频繁建立和销毁数据库连接。使用连接池等技术,可以减少重复的连接操作带来的开销,提高系统整体性能。
一、索引的本质与价值定位数据库索引如同图书馆的目录系统,其核心价值在于通过空间换时间的策略加速数据检索。...但需要明确的是:索引并非越多越好,每条索引都会带来额外的维护成本(写入时B+树结构调整)和存储开销。据阿里云数据库团队统计,不合理索引导致的性能下降案例中,68%源于过度索引引发的写放大问题。...二、索引性能的持续优化体系2.1 智能监控系统构建(1) 索引使用率追踪通过INFORMATION_SCHEMA.STATISTICS与performance_schema联动分析: -- 查看索引使用频次...让技术经验流动起来 ▌▍▎▏ 你的每个互动都在为技术社区蓄能 ▏▎▍▌ ✅ 点赞 → 让优质经验被更多人看见 收藏 → 构建你的专属知识库 转发 → 与技术伙伴共享避坑指南 点赞 ➕ 收藏... ➕ 转发,助力更多小伙伴一起成长!