首页
学习
活动
专区
工具
TVP
发布

前端之攻略

专栏作者
375
文章
794526
阅读量
37
订阅数
vue 项目引入基于jQuery的第三方插件
先安装 jQuery  npm install jquery 在 vue 页面中引入 import $ from "jquery" import * as SpriteSpin from "spritespin";  // 基于 jQuery 的插件 之前在 vue.config.js 中配置过     configureWebpack: {       plugins: [         new webpack.ProvidePlugin({           $: "jquery",        
tianyawhl
2022-08-07
8720
js 语音播报
<el-button  @ click = " speak " > 播放 </el-button>
tianyawhl
2022-05-06
2.6K0
Hightcharts 在vue中实现多图联动
官网有一个例子关于Highcharts 多图联动,链接地址,但是例子不是在vue中实现的,如何在vue中实现多图联动呢?
tianyawhl
2020-11-24
1.3K0
vue中引入Jquery
之前我是在main.js直接引入的jQuery  //import './assets/js/jQuery-2.1.4.min.js 后来不知为什么页面总是提示$ undefind  后来就换成安装jquery   第一步:npm install jquery @2.1.4 第二步:配置插件 vue.config.js const path = require('path'); const webpack = require('webpack') function resolve (dir) {
tianyawhl
2020-07-06
1.4K0
Element Tabs 标签页 展示Echart 并随窗口变化自适应
1、如何在一个div中展示不同的图表  (点击tab时为Chart组件赋值,并传给子组件,子组件监听数据变化并在 $nextTick 中重新绘制表格)
tianyawhl
2020-03-09
1.8K0
bootstrap中表格固定头部: 原
使用chromatable在bootstrap中的使用,首先引用css样式与js <link rel="stylesheet" href="../../plugins/jquery.chromatable-1.3.0/css/style.css">
tianyawhl
2019-04-04
9490
含有echart 图表的报表打印 原
最近需要打印含有echart图表的报表,采用jqprint插件打印,直接用jqprint打印echart的图不显示,这里需要借助img 来实现
tianyawhl
2019-04-04
1.6K0
几种js 方法实现倒计时 原
1、用js  setInterval  实现,每间隔一秒调用一次倒计时函数,在函数里面设置为0 时,取消定时器
tianyawhl
2019-04-04
4.5K0
js的匿名函数 转
js的匿名函数 jQueryJavaScript编程浏览器 对javascript匿名函数的理解(透彻版)网上很多解释,我无法理解,我想知道原理。。。这篇文章应该可以透彻一点  Query片段
tianyawhl
2019-04-04
3.7K0
jquery 与javascript 获取元素尺寸大小的对比
jquery获取尺寸的方法 width() 方法设置或返回元素的宽度(不包括内边距、边框或外边距)。 height() 方法设置或返回元素的高度(不包括内边距、边框或外边距)。
tianyawhl
2019-04-04
1.7K0
掌握jQuery插件开发 这篇文章就够了 转
在实际开发工作中,总会碰到像滚动,分页,日历等展示效果的业务需求,对于接触过jQuery以及熟悉jQuery使用的人来说,首先想到的肯定是寻找现有的jQuery插件来满足相应的展示需求。目前页面中常用的一些组件,都有多种jQuery插件可供选择,网络上也有很多专门收集jQuery插件的网站。利用jQuery插件确实可以给我们的开发工作带来便捷,但是如果只是会简单使用,而对其中的原理不甚了解,那么在使用过程中碰到问题或者对插件进行定制开发时就会有诸多疑惑。本文的目的就是可以快速了解jQuery插件的开发原理以及掌握jQuery开发的基本技能。 进行jQuery插件开发前,首先要知道两个问题:什么是jQuery插件?jQuery插件如何使用? 第一个问题,jQuery插件就是用来扩展jQuery原型对象的一个方法,简单来说就是jQuery插件是jQuery对象的一个方法。其实回答了第一个问题,也就知道第二个问题的答案了,jQuery插件的使用方式就是jQuery对象方法的调用。 我们先看个例子:$("a").css("color","red")。我们知道每个jQuery对象都会包含jQuery中定义的DOM操作方法,这里使用$方法来选择a元素,返回一个a元素的jQuery对象,这个对象就可以使用jQuery中定义的DOM操作方法。那么jQuery对象是如何获取这些方法的呢?其实jQuery内部定义了一个jQuery.fn对象,查看jQuery源码可以发现jQuery.fn=jQuery.prototype,也就是说jQuery.fn对象是jQuery的原型对象,jQuery的DOM操作方法都在jQuery.fn对象上定义的,然后jQuery对象就可以通过原型继承这些方法。 基础版jQuery插件 知道了上面这些知识,我们就可以来写一个简单的jQuery插件。假如我现在需要一个jQuery插件用来改变标签内容颜色,就可以按下面的方式来实现这个插件: $.fn.changeStyle = function(colorStr){          this.css("color",colorStr); } 然后按下面的方式来使用插件: $("p").changeStyle("red"); 插件调用的时候,插件内部的this就是当前调用插件的jQuery对象,这样的话每个使用$()方法选择的标签,在调用changeStyle()插件时都会使用css()方法重设color样式。 满足链式调用的jQuery插件 链式调用时jQuery的一大特色,一个通用的插件应该遵循jQuery风格,满足链式调用要求。实现链式调用的方式也很简单: $.fn.changeStyle = function(colorStr){          this.css("color",colorStr);          return this; } 然后使用的时候就可以链式调用其他方法了: $("p").changeStyle("red").addClass("red-color"); 实现链式调用的关键点就一行代码return this,插件中加了这行代码,那么在插件执行完之后,就会把当前的jQuery对象返回,然后就可以在插件方法后面继续调用其它jQuery方法。 防止$符号污染的jQuery插件 有很多js库都会使用$符号,虽然jQuery可以使用jQuery.noConflict()方法交出$符号的使用权,但是如果定义插件的时候,使用$.fn对象来定义的,那么这些插件使用的时候就会受到其它使用$变量的js库的影响。对于这种情况,我们可以使用立即执行函数通过传参的方式封装插件。形式如下: (function($){      $.fn.changeStyle = function(colorStr){          this.css("color",colorStr);                  return this;      } })(jQuery); 因为使用了立即执行函数,所以此时的$只属于这个立即执行函数的函数作用域,这样就可以避免$符号的污染。 可以接受参数的jQuery插件 继续上面的例子,假如我还想为这个插件添加一个设置标签元素内容文字大小的功能,那么我可以这么来实现: (function($){      $.fn.changeStyle = function(colorStr,fontSize){          this.css("color",colorStr).css("fontSize",fontSize+"px");                  return this;      } })
tianyawhl
2019-04-04
4020
基于jquery.fixedheadertable 表格插件左侧固定 对齐
jquery.fixedheadertable 经测试在固定1列和2列时是对齐的,2列以上明显不对齐,需要js做调整
tianyawhl
2019-04-04
1.8K0
jqprint 在高版本jquery中的应用 原
网上下载的jqprint只能在低版本的jquery的基础上使用,jquery-1.4.4.min.js,如果用高版本的jquery则不支持,下载jquery-migrate-1.2.1.js,即可解决问题
tianyawhl
2019-04-04
1.6K0
显示隐藏切换同时变化文字jquery与js实现
(adsbygoogle = window.adsbygoogle || []).push({});
tianyawhl
2019-04-04
7.5K0
bootstrap-table 数据导出excel格式
我们经常会需要将表格的数据导出excel格式,bootstrap-table有个导出的扩展插件
tianyawhl
2019-04-04
6.6K0
Vue cli 资源文件的引用 原
      assets下含有image , js ,css3个文件, 分别放各个资源文件
tianyawhl
2019-04-04
9760
滚动插件SuperSlide的用法 原
(adsbygoogle = window.adsbygoogle || []).push({});
tianyawhl
2019-04-04
7090
Jquery如何删除table里面checkbox选中的多个行与多个列
(adsbygoogle = window.adsbygoogle || []).push({});
tianyawhl
2019-04-04
4.1K0
没有更多了
社区活动
Python精品学习库
代码在线跑,知识轻松学
【玩转EdgeOne】征文进行中
限时免费体验,发文即有奖~
博客搬家 | 分享价值百万资源包
自行/邀约他人一键搬运博客,速成社区影响力并领取好礼
技术创作特训营·精选知识专栏
往期视频·干货材料·成员作品·最新动态
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档