当前位置: 首页 > news >正文

日期区间选择器插件的操作流程

 我们知道,在开发过程中,为了能够在规定时间内完成项目,有时候我们都会使用插件来大大提高我们的开发效率,有些插件是可以直接拿来用,但是有些插件拿过来之后是需要进行修改,在使用插件的时候还有很多的注意事项,我们来看一下是如何获取到插件的

   一、插件地址
        地址为:jQuery插件库-收集最全最新最好的jQuery插件 (jq22.com)

   二、如何将插件从中获取出来 
       我这里用的是jQuery插件库,接下来我会随便找一个来给大家进行演示如何将插件获取出来。

       首先,我们找到我们对应的插件

      然后,点击进入到页面中,找到查看演示,不点立即下载的原因是因为要钱,有实力的可以买,我是没那个资金,

      点击查看演示进入到页面中我们发现有很多的选择器,这时候我们点击鼠标右键,会有一个查看页面源码,这里没有办法截屏,当我们进入到页面源码后,将代码进行复制到我们的编辑器中,

      然后我们打开网页,查看日历选择器

      我们可以发现这个插件的页面中有些不相关的东西,这时候我们可以打开F12控制台通过选择器,

      选中我们需要的那一部分,然后回到编辑器中将其余没用的代码进行删除。

      这是删除后的效果图 我们发现在编辑器中就连JS代码都删除完毕了还是会有很多,

      这是因为iframe框架路径的原因,现在我们只是用了他的路径来实现的日期选择器,当他那边发生改变的时候我们这边也会收到影响,所以下一步,我们将上面标记iframe框架中的地址进行复制在浏览器中打开

https://www.jq22.com/demo/pickerDateRange20150807

 当我们进到这个页面之后再次点击右键获取源码这才是真正能将我们想要的插件弄到手

 这才是获取到这页面的所有源码

 这时候我们再打开F12 去找到我们要用的插件

 我们将其余没用的代码进行一点点删除之后,只剩下我们要用的插件代码 

效果图如下

  接下来,我们将实现如何将插件引入到我们的页面中

  第一步:

      我们要先在页面中进行引入jQuery插件库,这里是jQuery插件下载的地方

https://code.jquery.com/jquery-3.7.1.js

第二步: 

      将插件中的HTML 放入到我们指定的地方

       将css样式放到我们对应的文件中

     然后将js放入到对应的文件中

 这样我们就将我们需要的插件引入到页面中啦!


      以上就是如何将一个插件引入到页面中的操作

http://www.lryc.cn/news/507754.html

相关文章:

  • 【WRF教程第3.2期】预处理系统 WPS详解:以4.5版本为例
  • 深度学习的DataLoader是什么数据类型,为什么不可用来索引
  • 物理信息神经网络(PINN)八课时教案
  • Linux setfacl 命令详解
  • 电商环境下的财务ERP系统架构
  • Linux相关概念和易错知识点(25)(信号原理、操作系统的原理、volatile)
  • 线上问题——频繁 Full GC 问题的排查思路
  • 《探秘 Qt Creator Manual 4.11.1》
  • level2逐笔委托查询接口
  • 在Linux系统安装配置 MySQL 和 hive,hive配置为远程模式
  • 如何写好一份科技报告
  • ARM学习(38)多进程多线程之间的通信方式
  • 《图解机器学习》(杉山将著)第一部分绪论学习笔记
  • 【WPF】RenderTargetBitmap的使用
  • 编辑, 抽成组件
  • 使用C#绘制具有平滑阴影颜色的曼德布洛特集分形
  • 【批量生成WORD和PDF文件】根据表格内容和模板文件批量创建word文件,一次性生成多个word文档和批量创建PDF文件
  • 低延迟!实时处理!中软高科AI边缘服务器,解决边缘计算多样化需求!
  • 内旋风铣削知识再学习
  • Redis 7.x如何安装与配置?保姆级教程
  • SLAAC如何工作?
  • 电脑丢失dll文件一键修复的多种方法分析,电脑故障修复攻略
  • Docker容器命令
  • 【Leetcode 每日一题】3291. 形成目标字符串需要的最少字符串数 I
  • Windows聚焦壁纸代理不更新——解除UWP应用回环限制
  • 电脑开机提示error loading operating system怎么修复?
  • javaFX.(蜜雪冰城点餐小程序)MySQL数据库
  • Unity Apple Vision Pro 开发教程:物体识别跟踪
  • nano编辑器的使用
  • 框架问题学习