Js
SSSkyCong
这个作者很懒,什么都没留下…
展开
-
Js实现随机点击单个div颜色位置大小随机在浏览器页面出现
效果:——————————————————————————————————————————————————————————————————————————————————————————————————————————————————代码:<!DOCTYPE html><html lang="en"><head> &...原创 2018-12-13 18:55:05 · 2595 阅读 · 0 评论 -
Js实现简单的打印表格
效果如下:代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>打印表格</title></head><body>原创 2018-12-13 18:58:13 · 7379 阅读 · 0 评论 -
Js实现一个div块点击一下更换一次移动方向
效果如下:小块一开始在浏览器左上方,点击一下,开始移动:——————————————————————————————————————点击一下,开始向下移动: 点击一下,开始向左移动,再点击向上。。。。。。实现代码:<!DOCTYPE html><html lang="en"><head> <meta cha...原创 2018-12-13 19:04:06 · 1864 阅读 · 0 评论 -
Js实现随机div颜色位置——满天星效果
效果如下:————————————————————————————————————————————————————————————————————————————————————————————————代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset=...原创 2018-12-13 18:48:56 · 2484 阅读 · 0 评论 -
innerHTML在JS中用法
转载——https://blog.csdn.net/qq_27918787/article/details/52628311innerHTML在JS是双向功能:获取对象的内容 或 向对象插入内容;如:<div id="aa">这是内容</div> ,我们可以通过 document.getElementById('aa').innerHTML 来获取id为aa的...转载 2018-12-13 20:44:01 · 17039 阅读 · 0 评论 -
Js实现中文的实时时钟
效果:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body>&原创 2018-12-19 19:46:06 · 585 阅读 · 0 评论 -
Js实现数字时钟 纯css样式
效果:描述:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, m原创 2018-12-19 19:48:25 · 1901 阅读 · 1 评论 -
JS的十大经典算法排序
转载https://www.cnblogs.com/dushao/p/6004883.html十大经典算法排序总结对比图示:名词解释:n: 数据规模k:“桶”的个数In-place: 占用常数内存,不占用额外内存Out-place: 占用额外内存稳定性:排序后2个相等键值的顺序和排序之前它们的顺序相同冒泡排序(Bubble Sort)冒泡排序须知:作为最简单的排序算...转载 2018-12-14 22:09:40 · 206 阅读 · 0 评论 -
js
在开发中,数组的使用场景非常多,平日中也涉及到很多数组的api/相关操作,一直也没有对这块内容进行一块整理总结,很多时候就算用过几次这个api,在开发中也很容易忘记,还是要谷歌一下。所以就希望对这块内容有一个比较系统性的总结,在这背景下,就有了本篇文章,如果喜欢的话可以点波赞/关注,支持一下,希望大家看完本文可以有所收获。创建一个数组:// 字面量方式:// 这个方法也是我们最常用的...转载 2018-12-15 15:54:10 · 205 阅读 · 0 评论 -
Javascript面试题总结1221
原创 IT168企业级2017-04-13 17:02近年来,从事JavaScript的程序员越来越多,JavaScript的曝光率也越来越高,如果你想转行试试JavaScript,不妨收下这份面试题及答案,没准用得上。当然,如果针对这些问题,你有更棒的答案,欢迎移步至评论区。1、什么是JavaScript?(这是基本题,对很多程序员来说也是送分题!)JavaScript是客户端和服务...转载 2018-12-21 08:19:05 · 245 阅读 · 0 评论 -
Js ——CloneNode()用法
描述:cloneNode() 方法可创建指定的节点的精确拷贝。cloneNode() 方法 拷贝所有属性和值。该方法将复制并返回调用它的节点的副本。如果传递给它的参数是 true,它还将递归复制当前节点的所有子孙节点。否则(也就是默认值,或者false),它只复制当前节点。案例:代码:<!DOCTYPE html><html><...原创 2018-12-26 20:06:40 · 24016 阅读 · 5 评论 -
Js——键盘事件实现人物的行走
描述:小时候喜欢玩的一个游戏,魔塔,实现了人物的行走,以及跳跃,当然是2D的效果。用到的图:效果:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title&a原创 2018-12-26 20:37:31 · 1460 阅读 · 0 评论 -
Js面试总结
技术面试:****JS原生基础****兼容性问题****前后端架构****HTTP基础****ES5/ES6****性能优化问题****webpack原理2017春招https://segmentfault.com/a/1190000010631325?_ea=2359607http://blog.csdn.net/lunaqi/article/detail...原创 2018-12-27 10:58:59 · 2847 阅读 · 0 评论 -
正则表达式
转载——正则表达式是一种查找以及字符串替换操作。正则表达式在文本编辑器中广泛使用,比如正则表达式被用于:检查文本中是否含有指定的特征词 找出文中匹配特征词的位置 从文本中提取信息,比如:字符串的子串 修改文本与文本编辑器相似,几乎所有的高级编程语言都支持正则表达式。在这样的语境下,“文本”也就是一个字符串,可以执行的操作都是类似的。一些编程语言(比如Perl,JavaScript)...转载 2018-12-27 19:03:37 · 410 阅读 · 0 评论 -
Js——滚轮事件 自定义滚动条的实现
描述:自定义滚动条的实现效果:实现:<!DOCTYPE html><html lang=""><head> <meta charset="utf-8"> <title></title> <style> * {原创 2018-12-27 21:01:25 · 1057 阅读 · 0 评论 -
Js实现求一个数由几个数的平方构成,并打印出来(求平方数)
描述:费马四平方数猜想指出,任意自然数都可以分解成不超过四个完全平方数的和。例如:245 = 225+16+4 =15的平方+4的平方+2的平方现在给出自然数N,希望知道N最少可以分解成多少个完全平方数。代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-...原创 2018-12-17 19:42:17 · 1816 阅读 · 0 评论 -
Js实现4位随机码(要求2数字,2字母,位置随机)
打印效果:等等.....字母大小写+数字的随机排序,2字母+2数字。代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>随机码</title> <原创 2018-12-17 19:46:05 · 1042 阅读 · 0 评论 -
Js随机生成一个五位以内的数,然后输出该数共有多少位,每位分别是什么
描述:随机生成一个五位以内的数,然后输出该数共有多少位,每位分别是什么。代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>5位随机</title></head&原创 2018-12-17 19:50:36 · 6315 阅读 · 1 评论 -
HashMap实现原理及源码分析
作者: dreamcatcher-cx出处: <http://www.cnblogs.com/chengxiao/> 哈希表(hash table)也叫散列表,是一种非常重要的数据结构,应用场景及其丰富,许多缓存技术(比如memcached)的核心其实就是在内存中维护一张大的哈希表,而HashMap的实现原理也常常出现在各类的面试题中,重要性可见一斑。本文会对java集...转载 2018-12-17 19:56:52 · 126 阅读 · 0 评论 -
Js实现抓取网址数据
描述: "http://www.163.com/index.html?user=xie&pass=123456&age=30&sex=man&interest=看书|游戏"; 将上述网址信息,塞选抓取转化为以下效果:user:"xie",pass:123456,age:30,sex:"man",interest:["看书","游戏原创 2018-12-17 20:04:16 · 7888 阅读 · 1 评论 -
Js实现图片做的实时时钟
描述:将下图作为时间的背景,实现随时时钟的效果。效果:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style原创 2018-12-17 20:09:37 · 1019 阅读 · 0 评论 -
Js实现简单的秒表
描述:实现一个简单的秒表,点击启动按钮时开始计时,随后启动按钮变为暂停,点击暂停暂停计时,点击复位回到最初始状态。效果:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title&原创 2018-12-17 20:12:59 · 5853 阅读 · 2 评论 -
Js实现的只有当前这个月的日历
转载——https://www.cnblogs.com/stella1024/p/7246246.html如何实现一个很简单的只有当前这个月的日历,具体效果如下图: ( 截图时间是 2017-7-27 ),下面展示一下实现的代码: .wrap { font-size: 0; } .weeks span { display: inline-blo...转载 2018-12-17 20:34:17 · 1863 阅读 · 0 评论 -
clientHeight , scrollHeight , offsetHeight之间的区别及兼容方案
转自——http://www.cnblogs.com/nanshanlaoyao/p/5964730.htmlclientHeight , scrollHeight , offsetHeight相信每个人都用过,可是每次用都要查一下到底哪个是文档大小哪个是视口大小,还有头疼的兼容问题。先来官方的了解一下这三个属性:clientHeight:元素客户区的大小,指的是元素内容及其边框...转载 2018-12-23 15:44:41 · 339 阅读 · 0 评论 -
JS中的call()方法和apply()方法
转发——https://blog.csdn.net/ganyingxie123456/article/details/70855586JacvaScript中的call()方法和apply()方法,而在某些时候这两个方法还确实是十分重要的,那么就让我总结这两个方法的使用和区别吧。1. 每个函数都包含两个非继承而来的方法:call()方法和apply()方法。2. 相同点:这两个方法的作用...转载 2019-01-10 14:04:49 · 452 阅读 · 0 评论 -
Js事件案例——实现div色块拖动录制
描述:实现一个div50*50的色块,拖动它生成一个轨迹,松手后,这个div会重复你刚才拖动的这个路径。效果:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</tit原创 2018-12-25 19:39:40 · 643 阅读 · 1 评论 -
Js事件案例——div色块碰撞
描述:生成两个div色块,一个可以拖动,一个不可以,用拖动的去撞击不能动的,会将这个色块随机撞到一个位置,改变颜色。效果:实现:js文件:function DragObj(_obj) { this.obj=_obj; this.point={}; this.moveBool=false; this.obj.self=this; ...原创 2018-12-25 19:47:08 · 1217 阅读 · 0 评论 -
Js事件案例——点击生成随机div
描述:鼠标点击页面,在哪里点击就在那个位置创建一个div,宽高50,颜色随机,div在鼠标点击的正中间效果:实现:js:var Method=(function () { return { EVENT_ID:"event_id", loadImage:function (arr) { var img=new...原创 2018-12-25 19:50:45 · 1871 阅读 · 0 评论 -
Js实现——右键出现菜单,菜单中有新建,复制,剪切,粘贴,删除
描述: 单击右键出现菜单,菜单中有新建,复制,剪切,粘贴,删除 选择新建时,创建第一个div,宽高50,颜色随机,并且放在鼠标点击的位置 点击div,div被选中,加边线,如果被选中,div可以被拖动,当选择别的div时 原div取消被选中状态,不可以拖动。 复制可以复制被选中的div 剪切可以剪切被选中的div 粘贴可以将复制或者剪切的div粘贴在点击...原创 2018-12-25 19:59:25 · 3728 阅读 · 0 评论 -
Js事件案例——上下左右键盘控制div移动
描述:div通过键盘事件上下左右实现div块的移动效果: 实现:js:var Method=(function () { return { EVENT_ID:"event_id", loadImage:function (arr) { var img=new Image(); ...原创 2018-12-25 20:01:54 · 4315 阅读 · 1 评论 -
JS的事件绑定、事件流模型
转载——https://www.cnblogs.com/gcywj/archive/2018/05/13/9030668.html一、JS事件(一)JS事件分类1.鼠标事件:click/dbclick/mouseover/mouseout2.HTML事件: onload/onunload/onsubmit/onresize/onchange/onfoucs/onscroll3....转载 2018-12-25 20:05:44 · 149 阅读 · 0 评论 -
深入浅出js事件
转载——https://www.cnblogs.com/jingwhale/p/4656869.html一.事件流事件冒泡和事件捕获分别由微软和网景公司提出,这两个概念是为了解决页面中事件流(事件发生顺序)的问题。<div id="outer"> <p id="inner">Click me!</p></div>上面的代码...转载 2018-12-25 20:07:55 · 160 阅读 · 0 评论 -
JS中的bind()方法
Function.prototype.bind()方法转自——https://blog.csdn.net/kongjunchao159/article/details/59113129bind()方法主要就是将函数绑定到某个对象,bind()会创建一个函数,函数体内的this对象的值会被绑定到传入bind()第一个参数的值,例如,f.bind(obj),实际上可以理解为obj.f(),这时...转载 2019-01-10 22:52:11 · 67021 阅读 · 4 评论 -
Js WebSorage案例——跨页面传输数据 button控制div变色
描述:button页面选择颜色按钮,另一界面div变色效果:实现:点击button:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title>&am原创 2018-12-26 10:58:14 · 233 阅读 · 0 评论 -
JS——jquery重写随机div
描述:鼠标点击页面,在哪里点击就在那个位置创建一个div,宽高50,颜色随机,div在鼠标点击的正中间使用jquery后更方便了效果:实现:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Titl原创 2019-01-17 11:29:42 · 503 阅读 · 0 评论 -
JS——jquery对hover的操作
描述:简单的表格的hover效果,鼠标滑过变色效果: 实现:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <scrip原创 2019-01-17 15:34:34 · 1212 阅读 · 0 评论 -
JS面向对象——类和原型
描述:JS面向对象——类和原型实现: /* * * prototype 原型 基因 * 原型是有类当中创建,是由父代传入的 * 针对对象来说,这个原型就是自身根本原始属性 * 对象的__proto__ 他与类的prototype相同 * prototype就是类中对于自身基因的...原创 2019-01-11 20:24:26 · 229 阅读 · 0 评论 -
JS面向对象——多选框的实现
描述:JS面向对象——多选框的实现效果:实现:Utile.js(function () { Object.prototype.addProto=function (sourceObj) { var names=Object.getOwnPropertyNames(sourceObj); for(var i=0;i<names....原创 2019-01-11 20:28:05 · 325 阅读 · 0 评论 -
JS面向对象——单选框的实现
描述:JS面向对象——单选框的实现效果: 实现:Utile.js(function () { Object.prototype.addProto=function (sourceObj) { var names=Object.getOwnPropertyNames(sourceObj); for(var i=0;i<nam...原创 2019-01-11 20:31:01 · 2540 阅读 · 0 评论 -
JS面向对象——ES5的继承
描述:JS面向对象——ES5的继承实现:Utile.js(function () { Object.prototype.addProto=function (sourceObj) { var names=Object.getOwnPropertyNames(sourceObj); for(var i=0;i<names.length;...原创 2019-01-11 20:33:26 · 173 阅读 · 0 评论