js代码

js高级-面向对象继承

狂风中的少年 提交于 2020-04-07 12:13:20
一、工厂模式创建对象及优缺点   继承就是把公共的部分抽象出来作为父类,基类。吃饭,跑步等   var a = {};  //批量创建不方便,不能重复设置公共属性的代码   //工厂模式出现了,创建10个Cat对象 每个对象都有年龄、姓名的属性,包括run方法   注意区分 js高级-函数的四种调用模式   function createCat(age,name){     var o = new Object();     o.age = age;     o.name = name;     o.run = function (){       console.log(o.name + 'running...')     }     return o;   }   var c = createCat(19,'xixi')   //缺点 c的原型 构造函数是Object 方法不共享 二、构造函数模式创建对象   function Cat(age,name){     this.name = name;     this.age = age;     this.run = function(){       console.log(this.name + 'running..')     }   }   var c1 = new Cat(19,'kk')  /

js 实现动画功能,完整解析插件版 可更改配置参数 (正在更新....)

Deadly 提交于 2020-04-07 09:47:50
前言: 本人纯小白一个,有很多地方理解的没有各位大牛那么透彻,如有错误,请各位大牛指出斧正!小弟感激不尽。 本篇文章为您分析一下原生JS写一个运动插件 基本功能: 补充中...... 补充中...... HTML结构 <div class="container"></div> <p> <button id="start">开始</button> <button id="stop">结束</button> </p> html的结构只是为了调试运动插件而随意创建的。 CSS样式 <style> .container { width: 100px; height: 100px; background-color: aqua; position: absolute; left: 0; top: 0; } p{ position: absolute; top: 50px; left: 100px; } </style> 页面效果如下: JS行为 需求分析: 动画: 某些元素的某些CSS属性,在一段时间内,从一个值变化到另一个值 动画插件: 某些数据(数字),在一段时间内,从一个值变化到另一个值 不考虑DOM元素,DOM元素由用户传入 创建一个构造函数,让用户传入一些必须的参数(值、函数) 引入helper.js插件(自己封装的),使用对象混合 计算运动的总次数 获取当前的运动状态

【Android】java中调用JS的方法

风格不统一 提交于 2020-04-07 08:47:45
最近因为学校换了新的教务系统,想做一个模拟登陆功能,发现登陆的账号和密码有一个js脚本来进行加密 整理了一下java中执行JS的方法 智强教务 账号 密码 加密方法 var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/="; function encodeInp(input) { var output = ""; var chr1, chr2, chr3 = ""; var enc1, enc2, enc3, enc4 = ""; var i = 0; do { chr1 = input.charCodeAt(i++); chr2 = input.charCodeAt(i++); chr3 = input.charCodeAt(i++); enc1 = chr1 >> 2; enc2 = ((chr1 & 3) << 4) | (chr2 >> 4); enc3 = ((chr2 & 15) << 2) | (chr3 >> 6); enc4 = chr3 & 63; if (isNaN(chr2)) { enc3 = enc4 = 64 } else if (isNaN(chr3)) { enc4 = 64 } output = output + keyStr.charAt

图片滚动js 实现图片无缝滚动

时光怂恿深爱的人放手 提交于 2020-04-07 07:43:59
在改章节中,我们主要介绍图片滚动的内容,自我感觉有个不错的建议和大家分享下 非常平滑的JS图片滚动特效代码,无缝循环,速度可自定义,鼠标悬停时停止。它的特点是JS和图片地址分离,这样做你就经易的从数据库动态调用每张图片的地址,方便控制,因此它非常的适用。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>图片滚动</title> </head> <body> <style type="text/css"> <!-- #demo { background: #FFF; overflow:hidden; border: 1px dashed #CCC; width: 500px; } #demo img { border: 3px solid #F2F2F2; } #indemo { float: left; width: 800%; }

python之路-----前端之js(一)

一笑奈何 提交于 2020-04-07 07:25:36
  一.JS发展历史 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEnvi软件中).后将其改名ScriptEase.(客户端执行的语言) Netscape(网景)接收Nombas的理念,(Brendan Eich)在其Netscape Navigator 2.0产品中开发出一套livescript的脚本语言.Sun和Netscape共同完成.后改名叫Javascript 微软随后模仿在其IE3.0的产品中搭载了一个JavaScript的克隆版叫Jscript. 为了统一三家,ECMA(欧洲计算机制造协会)定义了ECMA-262规范.国际标准化组织及国际电工委员会(ISO/IEC)也采纳 ECMAScript 作为标准(ISO/IEC-16262)。从此,Web 浏览器就开始努力(虽然有着不同的程度的成功和失败)将 ECMAScript 作为 JavaScript 实现的基础。EcmaScript是规范. 二.JS的简介   JS主要由ECMAScript ,DOM,BOM三部分组成。其中ECMAScript是基础,规定了js中的基本语法,例如变量,函数的定义。DOM是最重要的部分,它整合js,css,html,将三者关联起来。BOM将浏览器和JS整合起来。   JS的基于对象的语言,它内含众多类,我们可以进行实例化,使用它们。   

Prestashop中文模版制作指南

▼魔方 西西 提交于 2020-04-07 07:14:15
Prestashop Css Layout 图 : 这是PrestaShop的Css Layout,方便大家知道主要的结构: 关于设计整合 PrestaShop 的介 绍 : 网页设计师只需要掌握好比较好的HTML和CSS技术便能改变Prestashop的外观,如果想进一步的改变,甚至加些比默认模版更绚丽的效果,你需要掌握好JQuery(Javascript库)和Smarty(PHP模版语言)。 听到这或许你会觉得非常的困难,甚至强调着“我只是个设计师,不是个程序员”。不用怕,把握JQuery和Smarty这两种工具其实是比你想象中的简单的,如果不想花精力去使外观和互动性能更出色、更多变的话,当然完全可以完整的用CSS来改变模版,下面将会提到是如何去实现的过程。 在这个设计者指导手册开始前,请确认你具备着比较好的XHTML和CSS这两种技术,如果你还不会的话,可以先从这两种技术慢慢学起再来看此篇手册。 在我们跳到Prestashop模版设计前,我们先来看看Prestashop的文件结构有些什么。当你计划去着手改变一个模版,清楚地了解文件的结构是非常重要的,我们接下来还会有一篇15分钟的文章引导,让你分别对Smarty 和JQuery 有个大概的了解,如果你从没有用过PHP Frameword 或者是Javascript 库德化,我建议你还是不要跳过这两篇文章引导。 准备好了么?好的

总结一下最近使用vue构建项目时遇到的坑

若如初见. 提交于 2020-04-07 02:34:06
虽然vue-cli提供了很方便的脚手架来构建自己的项目,但是在实际开发过程中,我还是遇到了一些问题,现将其摘要如下: 1、使用npm run build命令后会将我们的代码压缩至dist文件夹内,dist文件夹内目录如下: 此时直接打开index.html是无法打开的,我的解决办法是将其放在本地tomcat服务器内,然后通过启动bin/startup.bat启动服务器,即可以在浏览器正常调试。 2、打开后发现有一些图片没有显示,有一些压缩为base64,一些没有被压缩,检查后发现是图片文件过大,与build文件夹内webpack.base.conf.js配置不匹配有问题, { test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000000, name: utils.assetsPath('img/[name].[hash:7].[ext]') } }, 将此处的limit值变大后正常显示 3、index.html内的js文件路径报错, src=/static/js/manifest.4556eb0998075bdd0762.js> 此处将static前面的“/"删掉,解决。 本文所提的方法只是我在项目中的处理,如果有更好的办法,望指正 来源: https://www

常用 js代码集锦

时光总嘲笑我的痴心妄想 提交于 2020-04-07 02:30:29
1. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键 <table border oncontextmenu=return(false)><td>no</table> 可用于Table 2. <body onselectstart="return false"> 取消选取、防止复制 3. onpaste="return false" 不准粘贴 4. oncopy="return false;" oncut="return false;" 防止复制 5. <link rel="Shortcut Icon" href="favicon.ico"> IE地址栏前换成自己的图标 6. <link rel="Bookmark" href="favicon.ico"> 可以在收藏夹中显示出你的图标 7. <input style="ime-mode:disabled"> 关闭输入法 8. 永远都会带着框架 <script language="JavaScript"><!-- if (window == top)top.location.href = "frames.htm"; //frames.htm为框架网页 // --></script> 9. 防止被人frame <SCRIPT LANGUAGE=JAVASCRIPT><!

常用 js代码集锦

半世苍凉 提交于 2020-04-07 01:47:43
document方法: getElementById(id) 返回指定结点的引用 getElementsByTagName(name) 返回文档中所有匹配的元素的集合 createElement(name) 创建指定类型的新结点 createTextNode(text) 创建一个纯文本结点 element方法: getAttribute(id) 返回指定属性的值 setAttribute(id,value) 给属性赋值 removeAttribute(id) 移除指定属性和它的值 getElementsByTagName(name) 返回结点内所有匹配的元素的集合 node方法: appendChild(child) 给指定结点添加一个新的子结点 removeChild(child) 移除指定结点的子结点 replaceChild(newChild,oldChild) 替换指定结点的子结点 insertBefore(newChild,refChild) 在同一层级的结点前面插入新结点 hasChildNodes() 如果结点有子结点则返回true node属性: nodeName 以字符串的格式存放结点的名称 nodeType 以整型数据格式存放结点的类型 nodeValue 以可用的格式存放结点的值 parentNode 指向结点的父结点的引用 childNodes

Three.js 3D特效学习

纵饮孤独 提交于 2020-04-06 17:46:00
一、Three.js基本介绍 Three.js是JavaScript编写的WebGL第三方库。提供了非常多的3D显示功能。Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场景,包括了摄影机、光影、材质等各种对象。你可以在它的 主页 上看到许多精采的演示。不过,这款引擎目前还处在比较不成熟的开发阶段,其不够丰富的 API 以及匮乏的文档增加了初学者的学习难度(尤其是文档的匮乏,基本没有中文的)Three.js的代码托管在github上面。 二、基本 Demo 1.最基本的Hello World: http://stemkoski.github.io/Three.js/HelloWorld.html 2.在网页上调用摄像头: http://stemkoski.github.io/Three.js/Webcam-Texture.html 3.体感操作: http://stemkoski.github.io/Three.js/Webcam-Motion-Detection-Texture.html 4.支持游戏手柄: http://stemkoski.github.io/Three.js/Mesh-Movement-Gamepad.html 5.3D建模和方向键控制移动方向: http://stemkoski.github.io/Three.js/Model