JS控制语句及小练习

一.控制语句判断: ①if() {} ; if(){}else{} ; if(){}else if{};…… ② switch(){ case "": break; } 循环: ①for(var i=0; i<10; i++){ console.log(i); } 初始化变量条件判断改变变量循环体 While(表达式){ 代码 } 用法:for(循环次数确定) ②while(循环次数不确定) 关键字:break(跳出循环):continue(跳过本次循环): 停止循环:加…

html+js 的一些小问题

html+js 的一些小问题: 选择器+遍历函数: $("#taskStatusList tr:gt(0)").find("td:eq(3)").find("a").each(function () {} "#taskStatusList tr:gt(0)":取id为taskStatusList的table的tr标签的index大于0的元素 "td:eq(3)":取取id为taskStatusList的ta…

用js实现2048小游戏

用js实现2048小游戏笔记仓库:https://github.com/nnngu/LearningNotes 1.游戏简介 2048是一款休闲益智类的数字叠加小游戏.(文末给出源代码和演示地址) 2.游戏玩法在 4*4 的16宫格中,您可以选择上.下.左.右四个方向进行操作,数字会按方向移动,相邻的两个数字相同就会合并,组成更大的数字,每次移动或合并后会自动增加一个数字. 当16宫格中没有空格子,且四个方向都无法操作时,游戏结束. 3.游戏目的目的是合并出 2048 这个数字,获得更高的…

用Vue.js开发微信小程序：开源框架mpvue解析

前言 mpvue 是一款使用 Vue.js 开发微信小程序的前端框架.使用此框架,开发者将得到完整的 Vue.js 开发体验,同时为 H5 和小程序提供了代码复用的能力.如果想将 H5 项目改造为小程序,或开发小程序后希望将其转换为 H5,mpvue 将是十分契合的一种解决方案. 目前, mpvue 已经在美团点评多个实际业务项目中得到了验证,因此我们决定将其开源,希望更多技术同行一起开发,应用到更广泛的场景里去.项目的地址在: https://github.com/Meituan-Dianpi…

【转】利用 three.js 开发微信小游戏的尝试

前言这是一次利用 three.js 开发微信小游戏的尝试,并不能算作是教程,只能算是一篇笔记吧. 微信 WeChat 6.6.1 开始引入了微信小游戏,初期上线了一批质量相当不错的小游戏.我在查阅各处的文章时候,发现其中有几款是基于 three.js 开发的,目前火爆朋友圈的<跳一跳>就是其中之一.这引起了我的注意,想起几年前也做过不少 WebGL 的尝试,于是禁不住想要弄到微信小游戏平台上试试. 准备工作最新版本的 three.js: 首先应该具有一定的 three.js 开发经验,有之…

js 数组去重小技巧

js 数组去重小技巧 Intro 今天遇到一个问题,需要对数据进行去重,想看一下有没有什么比较方便的方法,果然有些收获. Question 问题描述: 我有一个这样的数据: [ { "ProjectId": "94147992363ef910", "ProjectName": "新梅太古城中粮天悦澜庭", "ProjectAddress": "曲阜路966弄" }, { "Pr…

MPVUE - 使用vue.js开发微信小程序

MPVUE - 使用vue.js开发微信小程序什么是mpvue? mpvue 是美团点评前端团队开源的一款使用 Vue.js 开发微信小程序的前端框架.框架提供了完整的 Vue.js 开发体验,开发者编写 Vue.js 代码,mpvue 将其解析转换为小程序并确保其正确运行. 简单上手mpvue 官方提供了一套quickstart模板. vue init mpvue/mpvue-quickstart my-project 安装好依赖之后,执行npm run dev,将会将小程序文件打包进dis…

使用JS实现2048小游戏

JS实现2048小游戏源码效果图: 代码如下,复制即可使用: (适用浏览器:360.FireFox.Chrome.Opera.傲游.搜狗.世界之窗. 不支持Safari.IE8及以下浏览器.) <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name=&…

js中OOP小指南

js中OOP小指南在指南中,我将尝试解析以面向对象规范聚焦的es6的新特性. 首先, 什么是设计模式范例是某个事务的例子或模型,在某种情况下,按照一种模式创建了计算机程序. 什么是面向对象显然你意识到这是一种设计模式,像已经存在的这个模式,我们还有许多其它的设计模式,比如函数式编程和反应式编程. 这种模式的特点我们在这个模式中所做的是以更接近实际的方式编程,我们使用类,对象,方法,属性等进行编程,并且集成了抽象,封装,模块化,隐私,多态和继承等术语. javascript的问题是,它不是…

js 回调函数小例子

js 回调函数小例子 <script> //将函数作为另一个函数的参数 function test1(){ alert("我是test1"); } function test2(f){ f() } //test2(test1) //将函数作为参数 function test(x,u){ return x+u() } function fu(){ return 100; } //alert(test(10,fu)) //将有参函数作为参数 function test2(x,u…

js写个小时钟

原生js写个小时钟一.代码今天美化博客园自学的哈,分享一下  <div id="Header1_HeaderTitle"></div> <script> function get_time() { var obj = new Date(); var hour = obj.getHours(); var min = obj.getMinutes(); var seconds = obj.getSeconds()…

js实现一个小游戏（飞翔的jj）

js实现一个小游戏(飞翔的jj) 源代码+素材图片在我的仓库 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>飞翔的林俊杰&…

JS控制语句（if、for等）、数组（例题）、方法（常用方法介绍）

控制语句 If if (1>2){ alert() } var a= parseInt(prompt('请输入数字')); if (isNaN(a)) { alert("输入的不是数字"); } else if (a >= 0 && a <= 100){ alert('范围内'); } else { alert('超出'); } ****************************************************** swith 1…

原生js完成拼图小游戏

废话不说,看代码,图片可以自己找,我这直接引用了百度的了 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport"…

Vue.js起手式+Vue小作品实战

本文是小羊根据Vue.js文档进行解读的第一篇文章,主要内容涵盖Vue.js的基础部分的知识的,文章顺序基本按照官方文档的顺序,每个知识点现附上代码,然后根据代码给予个人的一些理解,最后还放上在线编辑的代码以供练习和测试之用:在最后,我参考SegmentFault上的一篇技博,对Vue进行初入的实战,目的是将新鲜学到的知识立即派上用场:如果你还是前端的小白,相信这篇文章可能会对产生一些帮助和引起思想的碰撞,因为大家的学习历程是相似的,遇到的困惑也有一定的共通性,如果文章出现谬误之处,欢迎各位童鞋…

js 创建书签小工具之理论

我们一直在寻找增加浏览体验的方法,有的方法众所周知,有的则鲜为人知.我原本认为书签小工具属于后者,非常令人讨厌的东西.令我非常懊恼的是我发现在这个问题上我完全是错误的.它并不是令人厌烦的,而是以用户为中心的,能实现很多出色的功能,而且就像人们所预期的一样,它成为了我与浏览者以及网络交互的核心部分. 这里我想向你介绍开发书签小工具以实现一些精妙的书签的全过程.是的,书签,我们将创建不只一个书签,即使是非常小的书签.很好奇吗?我们开始吧! 究竟什么是书签小工具呢? 引用前文的话: 书签小工具是一个非…

一个简单用原生js实现的小游戏----FlappyBird

这是一个特别简单的用原生js实现的一个小鸟游戏,比较简单,适合新手练习这是html结构 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="game"> <div id="b…

JQuery&原生js ——实现剪刀石头布小游戏

前言 jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库( 或JavaScript框架).jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情.它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作.事件处理.动画设计和Ajax交互. 上一篇博客中,小编给大家展示了jQuery的一大优势,自定义插件.相信这个功能让各位都跃跃欲试,…

【翻译】了解Ext JS 5的小部件

原文:Understanding Widgets in Ext JS 5 在Ext JS 5,引入了新的"widgetcolumn",支持在网格的单元格中放置组件.同时,还在Ext JS 5引入了一种新的被称为"小部件"的轻量级组件.在Ext JS 5中,已包含了几个小部件,在本文将告诉你如何轻松的去打造自己的小部件.为了说明其中的关键概念,在文中将创建一个简单的名为"ratings"的如下图所示的小部件: 入门与常用的从Ext.Compone…

使用免费 mongodb数据库 + 免费node.js服务器搭建小程序接口

由于微信的小程序只支持不带端口的域名接口,不支持IP地址和接口,所以我们需要映射到80端口并绑定备案过的域名才能被微信小程序访问到.简单点就是接口需要 https 协议才行,找了许久的免费的数据库与node.js的环境,都不尽人意,下面是整理的可以考虑的免费的产品: 通过新浪云部署Node.js微信小程序商城(不用买域名.不用备案.不用配置https 如果已经有备案的网站但是没有配置SSL时,可以考虑阿里云免费证书DV SSL,这个免费的证书隐藏的比较隐蔽:证书类型选择 Symantec 品牌…

Ubuntu 16.04 下部署Node.js+MySQL微信小程序商城

转载于这篇文章关于pm2看这篇文章最近在研究小程序,申请了域名之后,再一次来配置环境,根据作者的步骤基本上完成了网站的架构,但由于环境路径等不同,配置上会有所不同,因此记录下来. 1.更新系统和安装 git.vim.curl apt update -y apt upgrade -y apt install curl git -y 2.通过 nvm 安装 Node.js 2.1 安装 nvm curl -o- https://raw.githubusercontent.com/creat…

js几个小技巧和坑

蝴蝶书看了,也知道充满了毒瘤和糟粕,但该用还是得用. 实际写了几天,小技巧记录下来.都是在py里有直接答案,不会遇到的问题,没想到js里这么费事. 还是要多读<ES6标准入门> 1判断object是[]还是{} 主要是转xml时是否正确,所以得判断这个.没想到这么麻烦. 抄这个答案,https://my.oschina.net/u/2436852/blog/609832 基本符合需要 if((Array.isArray(变量) && 变量.length === 0) || (O…

JS（微信小程序）处理银行卡号

其实这是一个小程序的项目,但是JS还是那个JS 在本项目中要实现两种效果: 每隔四位插入空格: <view class='item_list'> <label>银行卡号:</label> <input type='number' value='{{bankCard}}' bindinput='BankCardNoInput'></input> </view> BankCardNoInput(e) { var card = e.deta…

【js】走近小程序

一.什么是小程序? 基于微信的可以为用户提供一些服务的web项目,利用微信提供的接口可以让所有开发者使用到微信的原生能力,去完成一些之前做不到或者难以做到的事情. 二.小程序开发工具以及语言? 小程序需要用到微信提供的小程序开发工具,小程序的主要开发语言是 JavaScript . 三.小程序与普通网页开发的区别? 网页开发渲染线程和脚本线程是互斥的,这也是为什么长时间的脚本运行可能会导致页面失去响应,而在小程序中,二者是分开的,分别运行在不同的线程中.网页开发者可以使用到各种浏览器暴露出来…

JS原生带小白点轮播图

咱们刚刚说了js原生轮播图,现在给他加上可以随着一起走动的小圆点吧! css代码: *{ margin:0px; padding: 0px; } ul{ width: 2500px; height: 300px; position: absolute; } li{ float: left; list-style: none; } img{ width: 500px; height: 300px; } div{ width: 500px; height: 300px; margin: 50px a…

《Node入门》读书笔记——用Node.js开发一个小应用

Android APP的开发告一段落,一个稳定的.实现了基本功能的APP已经交付用户使用了!我和老板交流了下,接下来准备转战Node.js了,而且一部分前端的功能也要做进去!哈哈哈~~~接下来要朝一个全(zuo)栈(si)工程师进发了,想想都有点小激动呢!这几天一直在学新东西,HTML CSS JavaScript jQuery SQL bootstrap Node.js ··········· (好吧,看着这么多前端+后端的知识,我已经凌乱在风中了-.-·····) 要学的东西是蛮多的,时间又…