<!DOCTYPE html> <html> <head lang="en"><meta charset="UTF-8"><title></title><style>#box {width: 100px;height: 100px;background-color: greenyellow;position: absolute;}</style> </head> <body> <input type="button" value="按钮" id="btn"/><div id="box"></div> <script>var btn = document.getElementById("btn");btn.onclick = function () {animate(box, {"height": 400, "width": 400, "borderRadius": 150, "left...
在rsc文件夹下新建model文件夹,再新建storage.jsstorage.js代码: 1var storage={2 set(key,value){3 localStorage.setItem(key,JSON.stringify(value));4 5 },6 get(key){7return JSON.parse(localStorage.getItem(key)); 8 9 }, 10 remove(key){ 11 localStorage.removeItem(key); 12 } 13} 14 export default storage;下面是app.vue 1 <template>2 <div id="app">3 4 <input type=‘...
对于熟悉C#和Java的兄弟们,面向对象的三大思想(封装,继承,多态)肯定是了解的,那么如何在Javascript中利用封装这个特性呢?我们会把现实中的一些事物抽象成一个Class并且把事物的属性(名词)作为Class的Property把事物的动作(动词)作为Class的methods。在面向对象的语言中(C#等)都会有一些关键字来修饰类或者属性(Private,public,protect),这些关键词描述了访问的权限,不多做解释。泗阳县民用航空局我们来看看Java...
Javascript 面向对象编程(一):封装Javascript是一种基于对象(object-based)的语言,你遇到的所有东西几乎都是对象。但是,它又不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有class(类)。那么,如果我们要把"属性"(property)和"方法"(method),封装成一个对象,甚至要从原型对象生成一个实例对象,我们应该怎么做呢?一、 生成实例对象的原始模式假定我们把猫看成一个对象,它有"名字"和"颜色"两个属性。 ...
1、在我们开发程序中,经常会用到生成一些报表,比方说饼状图,条形图,折线图等。不多说了,直接上封装好的代码,如下Echarts.js所示以下代码是封装在Echarts.js文件中/*** Created by Administrator on 2015/8/7.*/var charec; // 路径配置require.config({paths: {echarts: ‘http://echarts.baidu.com/build/dist‘} }); // 按需加载所需图表require([‘echarts‘,‘echarts/chart/bar‘, //按需加载条形图‘echarts/chart/lin...
通过className调用元素Elementfunction getByClass(oParent,classn) //oParent,classn 为封装函数getByClass()中的两个形式参数 { var aEl=oParent.getElementsByTagName(‘*‘); //因为还不知道调用哪个元素,所以用通配符* var aResult=[]; for(var i=0;i<aEl.length;i++) { if(aEl[i].className==classn) //如果数组aEl中存在className与classn一致,则添加进入数组aResult中 aResult.push(aEl[i]);...
我发现轮播在很多网站里面都用到过,一个绚丽的轮播可以为网页增色不少,最近闲来无事,也用原生js封装了一个轮播,可能不像网上的插件那么炫,但是也有用心去做。主要用了闭包的思想。需要传递的参数有:图片地址的数组,图片宽度,上一页,下一页的id,图片列表即ul的id(这儿使用无序列表排列的图片),自动轮播间隔的时间。功能:实现了轮播的自动轮播,可以点击上一页,下一页进行切换。下面是html中的代码,只需要把存放的容器写好...
/***************************************************************** 表单校验工具类 (linjq) *****************************************************************//** * 判断整数num是否等于0 * * @param num * @return * @author jiqinlin */function isIntEqZero(num){ return num==0;}/** * 判断整数num是否大于0 * * @param num * @return * @author jiqinlin */function isIntGtZero(num)...
前言:之前的一篇介绍了下如何封装自己的组件,这篇再次来体验下自己封装组件的乐趣。看过博主博客的园友应该记得之前分享过一篇树形菜单的使用JS组件系列——Bootstrap 树控件使用经验分享,这篇里面第一个Jquery Tree,只是用简单样式和js去实现了效果,没有给出一个系统的封装,这篇博主就来试试在此样式的基础上封装一个稍微完整点的树形组件。一、组件效果预览其实效果和之前的那个差不多,博主只是在之前的基础上加了一个选中...
//cookiefunction setCookie(name, value, iDay) {if(iDay!==false){var oDate=new Date();oDate.setDate(oDate.getDate()+iDay);document.cookie=name+‘=‘+value+‘;expires=‘+oDate+‘;path=/‘;}else{document.cookie=name+‘=‘+value;} }function getCookie(name) {var arr=document.cookie.split(‘; ‘);var i=0;for(i=0;i<arr.length;i++){var arr2=arr[i].split(‘=‘);if(arr2[0]==name){return arr2[1];}}return ‘‘...
/** * Created by dongjingya on 16/4/6. */function SunboxCheckout() { this.elements = { pickupCenter: { modal: ‘#pickupCenterModal‘, province: ‘#pc-province‘, city: ‘#pc-city‘, country: ‘#pc-country‘, place: ‘#pc-place‘, date: ‘#pc-date‘, save: ‘#pc-save‘ }, checkout: { chan...
1/* 2 源码作者: 石不易(Louis Shi)3 联系方式: http://www.shibuyi.net4 ===================================================================================================5 程序名称: JavaScript 封装库 BETA 1.0 版6 迭代版本: Prototype7 功能总数: 44 个8 新增总数: 30 个9 删除总数: 0 个10 追加功能: 11 1. 元素隐藏与显示12 2. 表单 value 属性获取13 3. 实现 mo...
使用方法简单,只需要放在你的 utils.js 工具文件中,直接export const 加上下面封装方法,在别的文件中使用 {方法1,方法2,方法3...}引用后直接使用即可。01、输入一个值、返回其数据类型type = para =>{return Object.toString.call(para).slice(8,-1)}02、冒泡排序升序 bubbleAsSort()bubbleAsSort = arr =>{for(let i=0;i<arr.length -1;i++ ){for(let j=0;j<arr.length -1 -i;j++){if(arr[i] >arr[j + i]){let temp = arr [j...
原生JavaScript封装的jsonp跨域请求 <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>跨域的jsonp请求</title> </head> <body><script>(function(window,document){//该函数接受三个参数,请求的地址,请求的数据(对象格式),回调函数// 回调函数可接受一个参数用来返回请求到的信息var jsonp = function(url,data,callback){// 第一步:挂载回调函数//cbFuncName为回调函数名var cbFuncName = "my_jsonp_...
/* * Map对象,实现Map功能 * size() 获取Map元素个数 * isEmpty() 判断Map是否为空 * clear() 删除Map所有元素 * put(key, value) 向Map中增加元素(key, value) * remove(key) 删除指定key的元素,成功返回true,失败返回false * get(key) 获取指定key的元素值value,失败返回null * element(index) 获取指定索引的元素(使用element.key,element.value获取key和value),失败返回null * containsKey(key) 判...