web前端-Javascript
JinmyHe
每天记录一点滴
展开
-
前端插件收藏
1.Swiper是纯javascript打造的滑动特效插件,面向手机、平板电脑等移动终端。https://www.swiper.com.cn/2.WOW.js – 让页面滚动更有趣https://www.delac.io/wow/3.animate.css 动画库https://animate.style/4.hover.csshttp://ianlunn.github.io/Hover/5.Magic.css一款独特的CSS3动画特效包http://www.jq22..原创 2020-07-06 13:10:36 · 170 阅读 · 0 评论 -
JavaScript 函数
。。。原创 2020-03-08 03:57:34 · 198 阅读 · 0 评论 -
JavaScript 数组
数组是值 的有序集合。每个值叫做一个元素,而每个元素在数组中有一个位置,以数字表示,称为索引。JS数组是无类型的,数组 可以是任意类型。数组的元素可能是对象也可能是数组。JS数组的索引是基于零的32位数值:第一个索引是0,最大索引是4294967294。数组继承自Array.prototype中的属性。创建数组使用数组直接量是创建数组最简单的方法,在方括号中将数组元素...原创 2020-03-05 08:35:31 · 230 阅读 · 0 评论 -
JavaScript 对象
对象是js的基本数据类型。对象是一种复合值:它将很多值 聚合在一起,可通过名字访问这些值 。对象也可看种是属性的无序集合,每个属性都是一个名/值对。属性名是字符串,因此我们可以把对象看成是从字符串到值的映射。JS对象还可以从一个称为原型的对象继承属性。对象的方法通常是继承的属性。对象最常见的用法是创建create,设置set,查找query,删除delete,检测test ,枚举 ...原创 2020-03-03 22:15:21 · 323 阅读 · 0 评论 -
JavaScript 语句
表达式在JS中是短语,语句(statement)是JS的整句或命令。诸如赋值和函数调用这些表达式,称做为表达式语句,还有声明语句,条件语句等。表达式语句赋值语句是比较重要的表达式语句:greeting = "Hello" + name;i *= 1;复合语句和空语句可以用逗号运算符将几个表达式连接在一起,形成一个表达式。还可以将多条语句联合在一起,形成...原创 2020-03-03 15:22:18 · 435 阅读 · 0 评论 -
JavaScript 的一些运算符
条件运算符 (?:)也称做条件运算符。第一个操作数在"?"之前,第二个操作数在"?"和":"之间,第三个操作数在":"之后。x > 0 ? x : -x ;typeof运算符typeof是元运算符,放在其单个操作符的前面,操作数可以是任意类型。返回值为表示 操作类型的一个字符串。delete运算符delete是一元操作符,它用来删除对象属性或者数组元素。它是用...原创 2020-03-03 12:34:57 · 73 阅读 · 0 评论 -
JavaScript 关系表达式
1.相等和不相等运算符“=” 得到或赋值“==” 相等“===” 严格相等“!=” 不相等“!==” 不严格相等2.in运算符in运算符希望它的左操作是一个字符串或可以转换为字符串,希望它的右操作数是一个对象。如果右侧的对象拥有一个名为左操作数值的属性名,那么表达式返回true,例如:var point = { x:1,y:2};"x" in poi...原创 2020-03-03 12:17:00 · 391 阅读 · 0 评论 -
Javascript 类和原型 例子
在JS中,类的所有实例对象都从同一个原型对象上继承属性。因此,原型对象是类的核心如果定义一个原型对象,然后通过inherit()函数创建一个继承自它的对象,这就定义了一个Javascript类。通常,类的实例还需要进一步的初始化,通过定义一个函数来创建并初始化这个新对象。<script>//实现一个表示值的范围的类function range(from,to) { va...原创 2020-03-03 11:45:56 · 442 阅读 · 0 评论 -
ES6 rest 参数
ES6 引入 rest 参数(形式为...变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。function add(...values) { let sum = 0; for (var val of values) { sum += val; } return sum...原创 2018-10-02 04:42:36 · 2293 阅读 · 0 评论 -
离线应用与客户端存储学习笔记
所谓的离线web应用,就是在设备上不能上网的情况下仍然可以运行的应用。 开发离线web 应用的几个步骤:1.首先是确保应用知道设备是否能上网2.然后应用还必须能访问一定的资源3.最后必须有一块本地的储存空间用于保存数据 离线检测 navigator.onLineHTML5 定义了一个navigator.onLine属性。这个属性值为true表示设备可以上网,值为fals...原创 2018-09-26 01:03:15 · 359 阅读 · 0 评论 -
js 字符串操作函数
concat() – 将两个或多个字符的文本组合起来,返回一个新的字符串。 indexOf() – 返回字符串中一个子串第一处出现的索引。如果没有匹配项,返回 -1 。 charAt() – 返回指定位置的字符。 lastIndexOf() – 返回字符串中一个子串最后一处出现的索引,如果没有匹配项,返回 -1 。 match() – 检查一个字符串是否...原创 2018-09-18 12:32:04 · 165 阅读 · 0 评论 -
js去除字符串空格?
方法一:使用replace正则匹配的方法去除所有空格: str = str.replace(/\s*/g,""); 去除两头空格: str = str.replace(/^\s*|\s*$/g,"");去除左空格: str = str.replace( /^\s*/, “”);去除右空格: str = str.replace(/(\s*$)/g, "");str为要去...原创 2018-09-21 23:00:44 · 110 阅读 · 0 评论 -
jquery相关
1、 jQuery 库中的 $() 是什么? $() 函数是 jQuery() 函数的别称。$() 函数用于将任何对象包裹成 jQuery 对象,接着你就被允许调用定义在 jQuery 对象上的多个不同方法。你可以将一个选择器字符串传入 $() 函数,它会返回一个包含所有匹配的 DOM 元素数组的 jQuery 对象。2、如何找到所有 HTML select 标签的选中项?$('[...原创 2018-09-21 23:01:03 · 491 阅读 · 0 评论 -
判断一个字符串中出现次数最多的字符,统计这个次数
var str = 'asdfssaaasasasasaa';var json = {};for (var i = 0; i < str.length; i++) { if(!json[str.charAt(i)]){ json[str.charAt(i)] = 1; }else{ json[str.charAt(i)]++; }}...原创 2018-09-18 12:19:28 · 8470 阅读 · 1 评论 -
javascript垃圾收集
javascript具有自动垃圾收集机制,也就是说,执行环境会负责管理代码执行过程中使用的内存。垃圾收集机制的原理:找出那些不再继续使用的变量,然后释放其占用的空间。为此,垃圾收集器会按照固定的时间间隔,周期性地执行这一操作。1.标记清除Javascript最常用的垃圾收集方式是标记清除。当变量进入环境时,就将这个变量标记为“进入环境”。而当变量离开环境时,则将其标记为“离开环境”。...原创 2018-09-10 18:48:47 · 261 阅读 · 0 评论 -
ES6 箭头函数
ES6 允许使用“箭头”(=>)定义函数。var f = v => v;// 等同于var f = function (v) { return v;};如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。var f = () => 5;// 等同于var f = function () { return 5 };var sum ...原创 2018-10-03 00:18:49 · 181 阅读 · 0 评论 -
ES6 双冒号运算符
箭头函数可以绑定this对象,大大减少了显式绑定this对象的写法(call、apply、bind)。但是,箭头函数并不适用于所有场合,所以现在有一个提案,提出了“函数绑定”(function bind)运算符,用来取代call、apply、bind调用。函数绑定运算符是并排的两个冒号(::),双冒号左边是一个对象,右边是一个函数。该运算符会自动将左边的对象,作为上下文环境(即this对象),...原创 2018-10-04 20:46:52 · 5019 阅读 · 0 评论 -
右悬浮菜单,页面滚动监听
写了一个页面菜单滚动监听的案例样式部分:/*右侧悬浮按钮*/.brand-rightNav { position: fixed; right: 20px; top: -300px; z-index: 99; font-family: "微软雅黑";}.brand-rightNav li{ width: 220px; height: 60px; line-height: 60...原创 2018-07-11 18:11:54 · 672 阅读 · 0 评论 -
Ajax知识点
XMLHttpRequest对象Ajax的核心是XMLHttpRequest。 //适用于IE7之前的版本 function creatXHR(){ if(typeof arguments.callee.activeXString != "string"){ var version = ["MSXML2...原创 2018-09-23 12:22:00 · 220 阅读 · 0 评论 -
JSON学习笔记
JSON是一个轻量级的数据格式,可以简化表示复杂数据结构的工作量。JSON使用Javascript的语法的子集表示对象,数组,字符串,数值,布尔值和null。JSON的语法可以表示如下三种类型的值:简单值:使用与Javascript相同的语法。可以在JSON中表示字符串,数值,布尔值和null。但JSON不支持Javascript的特殊值undefined对象:表示一级无序的键值对...原创 2018-09-22 22:31:15 · 124 阅读 · 0 评论 -
传统javascript加载异步数据简单例子
基于XMLHttpRequest对象创建两个页面,a,b.a页面完整代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=devic原创 2018-10-05 15:38:51 · 813 阅读 · 0 评论 -
ES6 利用扩展运算符合并数组
ES6利用扩展运算符...合并数组我们用下面的例子观察:{ // ES5 合并数组 var params = ['hello', true, 3]; var other = [1, 2].concat(params); console.log(other);} { // ES6 利用扩展运算符合并数组 var params = ['h...原创 2018-10-04 22:20:03 · 3326 阅读 · 0 评论 -
HTTP协议理解
1.域名解析2.tcp3次握手建立连接3.建立连接后,发起http请求4.服务器端响应http请求,浏览器得到到http请求的内容;5.浏览器解析html代码,并请求html代码中的资源6.浏览器对页面进行渲染,展现在用户面前。...原创 2018-09-21 11:27:21 · 101 阅读 · 0 评论 -
检测类型
1.要检测一个变量是不是基本数据类型 typeof var s = "Jin"; var b = true; var i = 22; var u; var n = null; var o = new Object(); alert(typeof s); //string ...原创 2018-09-10 00:26:09 · 374 阅读 · 0 评论 -
javascript传递参数
ECMAScript中所有函数的参数都是 按值传递的,也就是说,把函数外部的值复制给函数内部的参数,就和把值从一个变量复制到另一个变量中一样。 访问变量有按值和按引用的两种 方式,而参数只能按值传递。在向参数传递基本类型的值时,被传递的值会被复制给一个局部变量(即命名参数,或者就是arguments对象中的一个元素)。在向参数传递引用类型的值时,会把这个值在内存中的地址复制给一个局部变量,因此...原创 2018-09-22 18:54:01 · 1376 阅读 · 0 评论 -
null和undefined的区别
undefinedundefined是一个表示"无"的原始值,转为数值时为NaN 变量被声明了,但没有赋值时,就等于undefined 调用函数时,应该提供的参数没有提供,该参数等于undefined 对象没有赋值的属性,该属性的值为undefined 函数没有返回值时,默认返回undefined nullnull是一个表示"无"的对象,转为数值时为...原创 2018-09-10 13:42:13 · 300 阅读 · 0 评论 -
ES6学习笔记之——Symbol
ES6 引入了一种新的原始数据类型Symbol,表示独一无二的值。它是 JavaScript 语言的第七种数据类型,前六种是:undefined、null、布尔值(Boolean)、字符串(String)、数值(Number)、对象(Object)。Symbol 值通过Symbol函数生成。let s = Symbol();typeof s// "symbol"上面代码中,变量...原创 2018-07-16 19:28:31 · 232 阅读 · 0 评论 -
联调的一些心得
最近刚开始做前端开发,做为一个小白,记录一些想记下来东西:一、F12开发者工具Network页签下面显示的是网络请求。想看具体信息,点击进去查看。Headers可以看见前端传给后端的值以及该请求是POST还是GET。状态是200还是404等等。Preview和Response显示的是后端对于该请求回复的值。值的类型(是json还是字符串等等)取决于Header页Response H...原创 2018-07-26 11:22:12 · 3683 阅读 · 0 评论 -
ES6学习笔记之——数组的解构赋值
ES6 中,从数组和对象中提取值,对变量进行赋值,这被称为解构。一、以前,为变量赋值,只能直接指定值let a = 1;let b = 2;let c = 3;ES6 允许写成下面这样let [a, b, c] = [1, 2, 3];let [foo, [[bar], baz]] = [1, [[2], 3]];foo // 1bar // 2baz // 3...原创 2018-07-14 22:09:31 · 1005 阅读 · 1 评论 -
如何创建对象
对象定义:无序属性的集合,其属性可以包含基本值、对象或者函数。对象的每个属性或方法都有一个名字,而每个名字都映射到一个值。几种创建对象的方法:1、Object的实例: var person = new Object(); person.name = "Nichol"; person.age = 29; person.job = "Software E...原创 2018-07-13 00:15:34 · 2628 阅读 · 0 评论 -
Object.assign
今天撸代码看到大佬写的代码了有句‘ Object.assign(param,_param);’不明白什么意思,遂百度之:Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。const object1 = { a: 1, b: 2, c: 3};const object2 = Object.assign({c: ...原创 2018-07-18 10:51:39 · 547 阅读 · 0 评论 -
10个JavaScript难点
原文: 10 JavaScript concepts every Node.js programmer must master译者: Fundebug转载 2018-07-12 11:36:20 · 152 阅读 · 0 评论 -
html5shiv.js和respond.min.js解决ie9以下对css3或h5新标签不识别的方案
html5shiv.js和respond.min.js做页面常用的东西,写这里用的时候省点去找了。。。html5shiv:解决ie9以下浏览器对html5新增标签的不识别,并导致CSS不起作用的问题。respond.min:让不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览器支持查询。由于IE6/IE7/IE8还有很大一部分用户,为了让网站浏览者都能正常的访问HTML5网...原创 2018-07-11 16:32:13 · 637 阅读 · 0 评论 -
ES6学习笔记之——Class 的基本语法
首先介绍一下类的概念,引用官方的描述:传统的JavaScript程序使用函数和基于原型的继承来创建可重用的组件,但对于熟悉使用面向对象方式的程序员来讲就有些棘手,因为他们用的是基于类的继承并且对象是由类构建出来的。 从ECMAScript 2015,也就是ECMAScript 6开始,JavaScript程序员将能够使用基于类的面向对象的方式。类class Greeter { ...原创 2018-08-02 23:54:22 · 220 阅读 · 0 评论 -
ES6学习笔记之——Set
ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。Set 本身是一个构造函数,用来生成 Set 数据结构。const s = new Set();[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));for (let i of s) { console.log(i);}// 2 3 5 4...转载 2018-07-17 23:19:24 · 177 阅读 · 0 评论 -
js获取url?号后面的参数,根据?后面的参数,页面显示不同视频
场景需求:在一个静态视频模板页面html,根据 ?type=test 显示不同的视频文件。远方要访问视频点击的按钮:<a href="http://www.hrj.cn/video-view.html?type=12002-list">视频显示</a>html显示视频视频:<div class="video-box-view"> <video id="s...原创 2018-07-10 16:20:47 · 1699 阅读 · 0 评论 -
javsrcipt基本概念
1.区分大小写,如:变量test 和变量Test分别表示两个不同的变量2.标识符是指变量、函数、属性的名字,或者函数的参数。规则:第一个必须是一个字母,下划线 _ ,或一个美元符号 $3.注释// 单选注释/***/4.严格模式: "use strict"5.语句,以一个分号";"结束6.关键字和保留字:js中的关键字可用于表示控制语句的开始...原创 2018-08-16 19:15:01 · 320 阅读 · 0 评论 -
理解参数
ECMAScript函数不介意 传递进来多少个参数,也不在乎传进来参数是什么数据类型。也就是说,即便你定义的函数只接收两个参数,在调用这个函数的时候也未必一定要传递两个参数。可以 传递一个,三个或是不传。之所以会这样,原因是ECMAscript中的参数在内部是用一个数组来表示。函数接收到的始终是这介 数组,而不关心数组中 包含哪些参数。如果数组中不 包含任何元素,无所谓;如果包含多个元素,也没...原创 2018-08-18 17:09:46 · 374 阅读 · 0 评论 -
javascript基本概念--语句
1.if语句if(i > 25) { alert("test1") } else { alert("test2"); }2.do-whild语句是一种后测试循环语句var i = 0; do { i += 2; } while(i < 10); alert(i);3.while语句...原创 2018-08-16 20:08:05 · 194 阅读 · 0 评论 -
uaredirect.js 进行判断是pc还是wap端
在pc的网址里面加入代码<script src="http://siteapp.baidu.com/static/webappservice/uaredirect.js" type="text/javascript"></script> <script type="text/javascript">uaredirect("http://wap.t原创 2018-09-06 16:10:30 · 1268 阅读 · 0 评论