JavaScript
关注
分享
扫一扫
cvper
向前走，打破前方的迷雾.....
展开
-
web cookie 的存储大小问题
俗话说，纸上得来终觉浅，绝知此事要躬行；前辈问我cookie的存储量有多大，我按部就班的回答 4k左右；前辈又问，那么cookie能存储多少个汉字？4k 大概 4000字节，一个汉字 2 个字节，那差不多 2000个吧；前辈又问：确定么到此就困惑了；下面通过 chrome 浏览器的 cookie 进行测试:注意，项目在本地服务器环境下启动测试，否则无法完成设置，本...原创 2019-07-17 23:37:52 · 3498 阅读 · 0 评论 -
JS Math对象的属性和方法
Math 是 js 内置的对象；先来看看Math 的属性：依次为: Math.E Math.PI Math.LN10 Math.LN2 Math.LOG10E Math.LOG2E Math.SQRT1_2 Math.SQRT2实例：其实都是常量，相当于一个数字； <script> //输出2.71... 也就是数学中 ...原创 2018-04-17 11:34:24 · 3186 阅读 · 0 评论 -
js 随机数
Math.random() js 产生随机数的方法；这里的随机数是伪随机数，结果的分布可能存在问题；使用方法：<script> var rd=Math.random();// 定义变量rd 存储 Math.random 产生的随机数 console.log(rd);//控制台输出产生的随机数</script>从上面...原创 2018-04-16 22:03:22 · 349 阅读 · 0 评论 -
原生 js 实现各种轮播图效果
js 轮播图是利用 window 对象的 setInterval（）方法，clearInterval（）方法，setTimeout（）方法以及clearTimeout（）方法实现图片轮播的效果；（参考：setInterval（code ，time） : code 是要执行的代码，通常是个函数，time是时间，单位毫秒ms, 这个方法的作用是 ...原创 2018-04-03 16:51:33 · 8780 阅读 · 7 评论 -
js cookie
概念不说，直接来看看如何进行cookie的设置等操作有个问题提前说明：本地测试cookie的时候，直接打开网页然后测试,对于chrome 和 opera 浏览器是不可以的，也就是说返回值都是空，但是可以使用 firefox 和 IE 浏览器，这两个是可以的；如果非得在Chrome或者opera下测试，那么换一种打开文件的方式，将文件放到服务器下，然后打开就可以了，也就是服务器环境下 chrome ...原创 2018-04-03 12:16:24 · 129 阅读 · 0 评论 -
js indexOf( ) 和 lastIndexOf( )
indexOf( ) 和 lastIndexOf( ) 是String对象的两个方法；indexOf( A,B )： A参数必选，表示你要找的字符； B参数可选，表示从哪个位置开始；<script> var test="abcdef"; var result=test.indexOf("b"); co...原创 2018-04-01 14:26:54 · 1691 阅读 · 0 评论 -
Javascript 正则表达式( 六 ) $ 和 ^
这一次，我们来看看正则中的 $ 和 ^ 的用法；我们现在有字符串 str="abc.css"然后我们想匹配一下 .css ，也就是验证这是个css文件<script type="text/javascript"> var str="abc.css"; var pattern=/\.css$/; ...原创 2018-03-27 12:45:11 · 841 阅读 · 0 评论 -
javascrpit 事件捕获和事件冒泡
事件捕获和事件冒泡涉及到了事件的流程，我们先来看一个例子：一、 添加事件监听：给 window 添加点击的监听事件，输出 “别点了，受不了了“ <script> function say(){ console.log("别点了，受不了了！"); } ...原创 2018-04-09 00:00:21 · 732 阅读 · 0 评论 -
DOMContentLoaded 事件
在javascript 中，DOMContentLoaded 事件是文档加载完成时触发的事件，文档加载完成是指DOM结构加载完成，不用考虑其它资源，比如图片等；我们来看一个例子：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta nam...原创 2018-04-08 18:30:16 · 4851 阅读 · 0 评论 -
js window.innerHeight 和 window.innerWidth
是什么？innerHeight 和 innerWidth 都是window 的属性，表示的文档显示区域的宽高，不包括工具栏和地址栏等区域；怎么获取？（单位：px）<script> console.log(window.innerHeight);</script>这种方式对最新的浏览器都是可以获取到的；但是吧，IE 9+ 支持，ie8,7,6,5 不支持；有必要这...原创 2018-05-06 05:06:57 · 2764 阅读 · 1 评论 -
js 不使用 var 声明的变量不是全局变量
你以为正确的事情，到最后发现是错误的，这是怎样的一种心情；大家似乎都有这样一种共识，使用var 声明的变量是局部变量，不使用var 直接写变量名是全局变量，然后代码中一实验，发现效果确实是符合预期的，但是这个认知却是不正确的；<script> function test(){ var abc = 123; de...原创 2019-05-04 18:15:59 · 3290 阅读 · 7 评论 -
window。location 和 location 的区别和联系
平时 js 写页面链接的跳转，使用的方式是： window. location. href ；今天看到另外一种写法： location. href ； 一般人看到这两种写法的反应： 第一种，居然可以这么写，这样写真的可以么 ？ 第二种，这两种写法我都知道啊，没什么么嘛 ？...原创 2018-10-17 23:58:16 · 4790 阅读 · 0 评论 -
three js 报错， 贴图黑乎乎
情景：想给一个平面 plane 进行贴图，进行下面的操作，想把一张图片贴在plane上面；var planeMaterial = new THREE.MeshPhongMaterial( { map: THREE.ImageUtils.loadTexture('./blue.jpg') } ); 问题：执行之后，plane 一片黑乎乎的，没有成功，查看控制台，已经报错了，信...原创 2018-09-26 22:19:49 · 1543 阅读 · 0 评论 -
js 时间获取
先看看如何获取时间： <script> window.onload=function(){ (function abc(){ var date=new Date(); console.log(date.getFullYear()); // 获取年份 ...原创 2018-05-07 21:33:52 · 183 阅读 · 0 评论 -
js 获取文件名和路径
使用js 提取文件名和路径：<script> var str="/abc/def/sos.php"; var obj=str.lastIndexOf("/"); console.log(str.substr(obj+1));</script>我们首先利用 lastIndexOf("/") 找到最后一个 / 的位置，然后利...原创 2018-05-14 09:21:35 · 26035 阅读 · 3 评论 -
实现 图片由远及近的效果
图片自备：代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2018-05-07 03:40:01 · 3969 阅读 · 0 评论 -
js 事件对象
js 是面向对象的，每次这么说一遍，总有一天会深入理解这个概念的；我们来看看事件对象，我们先简单的从概念上描述一下什么是事件对象：我们都知道事件，比如click ,keydown , mouseover 等等，是不是很熟悉，那么事件对象就很好理解了，事件对象存储了有关这个对象的一些信息，而这些信息我们都能获取:这么说也不好理解，看下面的图片：假设现在有一个点击事件，那么点击事件的事件对象就像一个...原创 2018-05-07 02:32:06 · 183 阅读 · 0 评论 -
实现遮罩效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &原创 2018-05-07 01:59:12 · 1278 阅读 · 0 评论 -
ECMAScript 标签语句 js实现
语法：label : statementlabel 是名字，作为标记 ，statement是语句 我们通过 js 来看看用法： break+标签语句<script> //定義一個label，也就是名字或者標誌 jumpout: //定義語句 for(let i=0;i<5;i++){ if(i&...原创 2018-05-12 22:30:38 · 431 阅读 · 0 评论 -
Javascript DOM readyState 属性
readyState是DOM的属性之一；表示当前文档 document 的状态；有四种状态： uninitialized 还未载入文档 loading 正在载入文档 interactive 已经加载文档 complete 完成加载 ------------...原创 2018-04-08 17:59:47 · 1126 阅读 · 0 评论 -
js appendChild( )
js DOM 操作 appendChild()下面的页面中有三个段落标签，我们在末尾再添加一个；<!doctype html><html> <head> <meta charset="utf-8"> <title>appendChild()</title> </hea原创 2018-03-31 17:31:10 · 2273 阅读 · 0 评论 -
javascript history对象
history对象我们知道history对象是window对象的一部分我们通过window.history 即可访问history对象；history对象形象点来说就是一个 url 的仓库，如下图：history对象包含着浏览过的 url;history.length我们可以通过history.length对浏览的历史进行判断，<script> alert...原创 2018-03-06 15:17:52 · 199 阅读 · 0 评论 -
JavaScript 把一个函数作为另一个函数的参数
我们知道JavaScript函数是可以接受参数的例如：var abc="just a test!";function test(temp){ console.log(temp);}test(abc);执行之后输出： just a test! 这里我们把一个变量abc 作为了函数 test() 的参数，最后输出了变量的值；那么函数也可以作为另一个函数的参数么？我们来看看下面的例子：functi...原创 2018-03-16 13:33:56 · 6472 阅读 · 2 评论 -
Javascript history对象的 history.pushState() 和 history.replaceState() 方法
history.pushState() 和 history.replaceState() 是history对象的两个新增的方法，是可以很好的操作历史记录的方法；history.State()history.State()的作用是向浏览器的历史添加一条记录，我们来看看如何使用这个方法：我们创建一个html网页文件，在网页中加入一个button按钮即可，我们看看显示效果我们看到在地址栏中显示了文件的地...原创 2018-03-08 12:51:16 · 15386 阅读 · 0 评论 -
JavaScript 函数 作用域 和 作用域链；
JavaScript 函数作用域和作用域链简单理解；首先要知道一点，javascript中只有函数作用域而没有块级作用域（ES6除外）；我们再来看看什么是函数作用域？函数作用域： 先看代码示例 function abc(){ var test1=3;原创 2018-02-05 14:39:11 · 311 阅读 · 0 评论 -
JavaScript 函数声明提前
JavaScript 有个特性称为函数声明提前；先看一段代码：结果是弹出 0 ，和预期一样， var abc=0; (function(){ alert(abc); }()); 再看第二段代码：结果是undefin原创 2018-02-03 01:18:15 · 673 阅读 · 0 评论 -
原生 javascript ajax 实例演示
（对低版本的 ie 不作兼容处理了，太过时，不知道谁还用） 本次演示采用原生javascript + php 实现ajax的 post 和 get 功能; 对php不了解的同学不用担心，就两三行代码，而且我会详细说明； 好了，下面开始： 第一步：如果想要运行起来，那么还是需要开启服务器的，这里推荐使用 wampserver， 下载相应的原创 2018-01-25 13:45:50 · 3432 阅读 · 1 评论 -
javascript 字符串对象 和 包装对象
javascript数据类型有原始类型和对象类型，原始类型有：数字 字符串 布尔值 null 和 undefined字符串为什么又变成字符串对象呢？例子：var s="abcdef";这是一个字符串abcdef,alert（s.length）；会弹出 6 ，即abcedf字符串的元素个数为6个，此时的字符串已经变成字符串对象，有了属性length；具体过程是：原创 2018-01-01 21:58:13 · 405 阅读 · 0 评论 -
javascript 二进制浮点数的问题，0.3-0.2不等于0.1
javascript 计算：0.4-0.3=？ 0.3-0.2=？ 0.2-0.1=？先来看看实际效果：编写javascript代码：结果依次为：以上就是二进制浮点数存在的问题，但是结果近似相等，只是在进行是否相等的判断时存在问题。原创 2018-01-01 19:28:38 · 1813 阅读 · 1 评论 -
javascript 数字（Number类型）的范围，整数的范围是多少？
数字类型---->Number类型 是javascript 原始类型之一，那么它的范围是多少呢？数字类型采用64位浮点格式表示，我们可以利用Number对象的属性Number.MAX_VALUE,Number.MIN_VALUE来查看；Number对象的属性：原创 2018-01-01 18:53:28 · 31766 阅读 · 0 评论 -
javascript 递归实现 斐波那契数
斐波那契： 1 1 2 3 5 8 .....特点：后面的数等于前面两个数之和， 即 f ( n )= f ( n-1 ) + f ( n-2 ) ;代码 <!doctype html><html> <head> <meta charset=...原创 2018-03-30 11:29:13 · 753 阅读 · 1 评论 -
js prototype 添加属性和方法
假设现在有个字符串，即String 对象，var str="abcd";我们知道str.length 可以求出字符串的长度，这个length 就是String 的属性；str.split() 可以把我们上面的字符串分割成 ["a","b","c","d"] , split（）就是String的方法；上面的属性和方法都是原来就定义好的，现在我们想添加自己的属性和方法，那就需要 prototype,...原创 2018-03-30 12:18:49 · 1112 阅读 · 0 评论 -
javascript insertBefore( )
js DOM 操作----insertBefore( ) 的用法；含义：在某个元素之前插入一个新的元素；先来写一个带有三个段落的网页：<!doctype html><html> <head> <meta charset="utf-8"> <title>insertBefore()</title&原创 2018-03-31 17:14:13 · 6914 阅读 · 0 评论 -
Javascript 正则表达式( 五 ) 匹配数字 /d /D
场景，如何匹配数字0--9呢？使用 /d 就可以了：<script> var str="123456789abc ?><"; var patt=/\d/g; console.log(str.match(patt)); </script>我们看看结果：["1", "2", ..原创 2018-03-26 10:05:02 · 2731 阅读 · 0 评论 -
Javascript 正则表达式(四) 匹配所有的数字，字母，和下划线 \w \W
场景：如果我们想匹配一个字符串中的所有数字+字母+下划线，我们如何正则呢？使用下面这个 \w 就可以了：<script> var str="acb123..//_---!"; var patt=/\w/g; console.log(str.match(patt));</script>...原创 2018-03-26 09:49:56 · 6605 阅读 · 0 评论 -
Javascript 正则表达式（三） 正则表达式 变量
之前我们正则的时候，是直接在双斜线的中间写上我们要匹配的东西；比如 /abc/g ;但是现在有一种情况，我们有 str1="abcd";我们想匹配一下这个变量str1 ，怎么办呢？我们这么写 /str1/g ,这样结果匹配的是 “str1” 这个字符串而不是"abcd",我们需要这么写就行了：str="abcadgasdaioasdmas"str1="abcd";var reg=new ...原创 2018-03-25 21:46:44 · 614 阅读 · 0 评论 -
Javascript 正则表达式（二）
在上一篇中我们了解了正则表达式是怎么回事，并且会简单的搜索我们想要的结果，现在我们再看看一点新的东西：现在假如有字符串，str="abcadgasdaioasdmas"我们想找以a开头的并且只有两个字母的字符串；（注意只有一个点）str="abcadgasdaioasdmas"var patt=/a./g;console.log(str.match(patt));结果返回：["ab", "ad...原创 2018-03-25 21:19:28 · 131 阅读 · 0 评论 -
Javascript 正则表达式（一）
啥是正则表达式就不说了，我们直接来看第一个例子：我们现在有一串字母组成的字符串 str="abcdefghigklmnopqrstuvwxyz"好了，现在我们想找一下这个字符串str中有没有字符 "xyz",你可能直接看出在字符串的末尾就是，但是如果这个字符串特别长，那就不会这么容易就能看出来了，下面就可以使用正则表达式帮助我们来找一找；<script> //先定义...原创 2018-03-25 20:48:25 · 185 阅读 · 0 评论 -
Javascript 正则表达式( 七) test( ) 和 ^ 的第二种含义
上一篇，我们了解了^ 的含义，是从首位开始的意思，也就是左边开始； ^ 在不同的位置的含义是不一样的，我们再来看看^ 的第二种意思； 并且，我们这一次使用test( ) 来代替之前的match( ); 先来看看test( ),之前我们通过match( ) 返回匹配的结果的数组，这一次，我们使用test( )返回匹配是true 或者f...原创 2018-03-30 19:51:38 · 1201 阅读 · 2 评论 -
javascript 数组去重实现方法
代码：<!doctype html><html> <head> <meta charset="utf-8"> <title>数组去重</title> </head> <body> <script原创 2018-03-30 14:17:31 · 667 阅读 · 0 评论