lizhenqiu blog
最新评论流与站内评论搜索
Comment Stream
最新评论聚合
共 2900 条评论
Current Page
链接聚合
链接标签分页
Latest
评论流
第 113 / 145 页
当前展示 2241 - 2260 条,共 2900 条评论
常用html、demo代码
用js写的一个路由
常用html、demo代码
CSS隐藏元素的N种实现方式。
1. width:0;
光有高度是不行的,还得有宽度。缺点文字隐藏不了,可以加个color:#fff和背景颜色一样就ok了,障眼法,迷惑人的,其实内容还在,如果有文字的话,还是可以触发点击事件的,这种做法很多黑客就会利用在目标站点链接上加一个和背景颜色一样的让管理员发现不了。
2. height:0;
和上面一样,一个物体至少得有宽和高。
3. opacity:0;
元素还在,只是看不见而已。
4. position:absolute;left:-9999px;
元素还在,只是超出了屏幕范围。
5. text-index:-9999;
只能达到隐藏文字的效果,没有其他副作用。给页面添加logo图片,还想seo添加文字又不想显示这段文字,就可以使用这个方法。
6. z-index:-99999;
需要配合定位使用,层级太低导致我们无法看见这个元素,使用这个缺点还是很多的,首先就算你z-index:-9999了并且定位,但如果这个元素比后面的元素高了或者宽了,再着有文字一样还是可以看到这个元素。
代码如下:
<style>
#box{
width:100px;
height:100px;
background-color:red;
position:absolute;
z-index:-9999;
}
</style>
<div id="box">111111</div>
<div>为什么要这样</div>
7. overflow:hidden;
如果元素超出所设置的宽和高,剩下的部分就会被隐藏,如果想让整个元素隐藏,设置宽和高为0就行。
width:0px;
height:0px;
overflow:hidden;
8. visibility:hidden;
元素被隐藏,但是还占位置。
9. display:none;
元素被隐藏,并且不占位置。
10. background-color:#fff;
把元素的背景颜色设置成body的背景,障眼法。
11. max-width:0px;
和width:0px;原理一样。
12. max-height:0px;
和height:0;原理一样。
13. background-color:rgba(0,0,0,0);color:#fff;
把元素透明度设置成0,达到看不见的效果,和opacity原理一样。如果想让文字也看不见,给它一个障眼法就好了,或者font-size:0
14. font-size:0px;
隐藏文字的效果。
15. transform:translate(-9999px);
和left:-99999px;原理一样,把元素移出屏幕可视区。
16. transform:scale(0);
让元素的大小设置成0不就看不见了哈。
17. transform:skew(90deg);
让元素重和,看不见了。
18. margin-left:-9999px;
把元素移出屏幕可视区
19. -webkit-clip-path:polygon(0px 0px,0px 0px,0px 0px,0px 0px);
把元素剪裁了。
常用html、demo代码
项目中踩过的坑之-sessionStorage
总想写点什么,却不知道从何写起,那就从项目中踩过的坑开始吧,希望能给可能碰到相同问题的小伙伴一点帮助。
项目情景:
有一个id,要求通过当前网页打开一个新页面(不是当前页面),并把id传给打开的新页面,然后新页面在初始化时候使用这个id,发送请求········。
解决方案:
第一个小伙伴选择了cookie,总所周知cookie可以在同源网页间共享。我建议他不要用,因为cookie在页面发送请求的时候都需要一同发送的,浪费带宽不好。
然后我骄傲的建议了他使用sessionStorage或者localStorage,出于偷懒目的~我让他选择了sessionStorage,关闭页面就自动清除,localStorage还需要调用removeItem进行清除。
小伙伴就使用了sessionStorage,哈哈,果然可以传给打开的新页面id信息,还没高兴多久,问题又来了,又有新的入口打开新的页面不需要传递id,这简单呀,就只要打开一个然后在新页面
使用完sessionStorage的id就清空好了,这样就不会出现只想打开新页面的时候还出现之前依据老id加载页面的情况了。想法是简单的,现实是残酷的,实际效果还是按照老的id加载的,为啥呀
然后就是各种网上查资料,这才发现自己是如此的天真,在三篇文章中看到如下内容,不知道如何引用,暂且copy过来吧,写文章的都是好人········
sessionStorage生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么所有通过sessionStorage存储的数据也就被清空了。
不同浏览器无法共享localStorage或sessionStorage中的信息。相同浏览器的不同页面间可以共享相同的localStorage(页面属于相同域名和端口),但是不同页面或标签页间无法共享sessionStorage的信息。这里需要注意的是,页面及标签页仅指顶级窗口,如果一个标签页包含多个iframe标签且他们属于同源页面,那么他们之间是可以共享sessionStorage的。
上面红色的字总结一下就是不同页面是无法使用sessionStorage的,可是为啥通过超链接或者window.open新页面的时候是可以传递sessionStorage的呀,感觉有点歪打正着的感觉······经过多次实验,发现了一个惊天秘密,打开的新页面的sessionStorage是通过原网页的sessionStroage复制传递过来的,也可以理解为新网页的sessionStorage是原网页的sessionStorage的复制出来的独立体,每个网页的sessionStorage都是一个独立的,原来是这样啊。哈哈,下面就简单了,只要用完就把原网页的sessionStorage清掉就好了哈。。。。。突然发现,想偷懒是不可能的了。。。。可是问题又来了,我咋知道啥时候新网页获取好sessionStorage,是不是有点想喷血的赶脚。。。。
然后我又骄傲的在原网页设置好sessionStorage的代码下面,使用了st=setTimeout(function(){ sessionStorage.removeItem(XXX);clearTimeout(st)//此处显示出个人修养和最起码的职业操守,鉴定完毕},1000);
···········问题愉快的解决了,可是我还在回想,假如当初讲究一下使用cookie,或者当时不想偷懒,直接使用localStorage就木有这么多问题了吧,哎,世事无常,想偷懒反而花费更多的时间和精力,反而学到了很多东西,假如有啥更好的解决方法请在下方回复哈,希望我踩的这个坑可以给大家一些帮助。
常用html、demo代码
js弹出框、对话框、提示框、弹窗总结
js中最常见的框
Google方程式 WWWDOT – GOOGLE = DOTCOM
一.冒泡排序
二.快速排序
Google方程式 WWWDOT – GOOGLE = DOTCOM
javascript数组全排列,数组元素所有组合
成功的故事只能倒叙着讲
不骄不躁,不拘泥于此,时刻保持一颗归零的心,做必然之事
Google方程式 WWWDOT – GOOGLE = DOTCOM
javascript数据类型理解整理
起因:关于数据类型这块,自己看了很多遍相关的资料,每次查看和实践都有一些体会和理解;但又感到没有理解透,总是差一点,最近又在看这块的内容,加上最近的积累,做个相关笔记
ECMAScript数据类型:
1. 5中简单数据类型:String Number Boolean Undefined Null
2. 1种复杂数据类型:Object,本质是一组无序的名值对组成的,eg:Array JSON ...
【理解】对于JS数据方面的操作,都是数据类型之间的转换和操作,只要针对的攻克每一种数据类型,在逐步的融合,JS水平会有一个很好的进步;
typeof操作符
1. 这是个操作符,不是方法
2. 之所以typeof存在,是因为ECMAScript是松散类型的语言;松散类型就是变量可以是任意数据类型,可以任意转换(不推荐)
一、 Undefined类型
当【声明】一个变量,但是【未初始化】,这个变量的值就是undefined
一直以来的困惑:
1. 对【未初始化】的变量执行typeof操作符,返回undefined值
2. 对【未声明】的变量执行typeof操作符,返回undefined值
困惑:导致自己一直不知道该怎么解决这个问题,书上标注的解决办法是:显式的使用undefined来给没有初始化的变量进行赋值,每次实践的结果和书上说的有出入
感悟:自己刚刚结合了jQuery上的$.type()的工具函数,和自己写的一些例子
所以,无论从$.type()的角度看,验证结果;还是从例子中查看结果,都可以看出,对于【未声明】和【未初始化】分离和验证都不是难题;
【注】对于$.type()的原理实现,是否是我例子中的方法,我还没有验证;当然这不是重点,重点是,妈妈再也不担心我分不清【未声明】和【未初始化】了;
【项目中】在实际的项目中,肯定是不允许有报错行为的,这样大大的影响了程序的进一步运行;所以,用下面这种方式:
二、Null类型
1.从逻辑的角度,null值表示一个空对象指针
2.typeof(null),返回object
3.如果定义的变量未来准备用来保存对象,最好将其初始化成null
只要检测出来不是null就可以进行下一步操作:
if(ele != null){ //要执行的代码 }
4.undefined值是派生自null值,因此:console.log(undefined == null); //true
三、Boolean类型
1.有两个字面量:true and false
2.区分大小写,只有全小写形式,属于Boolean类型,其余的只是标识符
3.转型函数Boolean(),将任意类型的字符转换成Boolean类型
转换规则:
数据类型 => true => false
四、Number类型
1.数值字面量表示方式:十进制、八进制(严格模式不支持,直接报错)、十六进制
八进制:第一位必须是0,然后是八进制数字序列(0~7)
十六进制:前两位必须是0x,后跟十六进制数字序列(0~9及A~F),字母(A~F)大小写都可以
算术计算时:所有以八进制和十六进制表示的数值最终都将被转换成十进制数值
正零 == 负零(+0 == -0)
2.浮点数值
就是数值中包含一个小数点,小数点后必须至少有一位数字
小数点前面可以没有整数,但是不推荐(.1)
保存浮点数值所需的内存空间是保存整数的两倍,所以下面这些浮点数,会当做整数处理
对于极大极小的数值,可以用e表示法(即科学计数法)来表示浮点数值;e前面的数值*10的指数次幂,幂是e后面的数值
默认情况下,ECMAScript会将那些小数点后面带有6个零以上的浮点数值转换成e表示法
浮点数值的最高精度是17位小数,但在进行算数计算时其精确度远远不如整数
【注】浮点数值计算有舍入误差,其它基于IEEE754数值的浮点数计算语言都有这类通病
3.数值范围
由于内存的限制,ECMAScript不能保存世界上所有的数值
最值具体等于多少数值,不同的浏览器有不同的结果,具体以实际为准
数值计算结果超出最值范围,将被自动转换成特殊的正值是Infinity(正无穷)值,负值是-Infinity(负无穷)
判断某个数值是不是有穷数值(是不是位于最小值和最大值之间),可以使用isFinish()函数,结果是有穷的返回true,否则false
Infinity和-Infinity保存只
4.NaN
NaN,即非数值(Not a Number)是一个特殊的数值,当数值计算出现错误的时候,返回NaN,如:任何数除以0会返回NaN,这样不影响其它代码的执行
两个特点:
--- 1.任何涉及NaN的操作(NaN/10)都会返回NaN,这个特性在多步计算中有可能导致问题
--- 2.NaN与任何值都不相等,包括NaN本身
isNaN()函数,这个函数接收一个参数,该参数可以是任何类型;意思是是否【不是数值】
当参数不是数值时,返回true;当参数是数值时,返回false
isNaN()也适用于对象,首先调用对象的valueof()方法=?是否可以转换为数值,如果不能,在调用toString()方法
Google方程式 WWWDOT – GOOGLE = DOTCOM
平年闰年判断
Google方程式 WWWDOT – GOOGLE = DOTCOM
确定天数
Google方程式 WWWDOT – GOOGLE = DOTCOM
JS数组元素排列组合
Google方程式 WWWDOT – GOOGLE = DOTCOM
js字符串转换成数字
parseInt(string) : 函数从string的开始解析,返回一个整数。
如果解析不到数字,则将返回一个NaN的值,可以用isNaN()函数来检测;
同样的parseFloat函数是将字符串转换成浮点数。
举例:
js数字转换成字符串
将字符串转换成数字,得用到String类的toString方法
js数字与字符串的区别
js的数字的加法与字符串的连接都是 + 符号, 所以究竟是加还是字符串的连接就取决与变量的类型。
如果从html页面元素得到的值,想按数字加,就需要先转换为数字,因为从页面得到的值默认是字符串。
Google方程式 WWWDOT – GOOGLE = DOTCOM
Google方程式 WWWDOT – GOOGLE = DOTCOM
前端语言 浏览器 JavaScript算法
认真的反思是首先假定自己错了,而不是找个理由证明自己是无辜的
单单看到这样的百度就让人觉得惋惜,就好像看到一位江湖高手退缩在墙角,被一位手拿树枝的小朋友鞭打。而他本可以去做更有意义的事。
常用html、demo代码
jquery 回车事件
简单地记下jquery实现回车事件,代码如下:
全局:
某个控件:
如果想模拟Tab键,只要写成
就行了,它会跳到另一个元素上。
鲁迅说,在中国,搬一张桌子是要流血的
中国人除了你比较贱,其它的都还好。
鲁迅说,在中国,搬一张桌子是要流血的
不是前人太懒,只是时代发展太快。
他不是脾气暴躁,只是不能被打扰
讲真,看看你努力合群的样子,自己是不是也有点心疼?
成功的故事只能倒叙着讲
虽然自己只是一个高中生 但当过一年半的社长 感觉办活动的时候最害怕的就是执行 很害怕得罪人又担心其实不够别人说三道四 最后解决问题四个字很很实在很精辟 对 learn by doing说明你在工作中总爱寻求别人的认同感,这样会使你失去主动权,不如学会放下,让自己变成想要成为的样子,而不是他人认为的样子,或许你会收获到快乐和幸福!
感谢这篇文章作者
需要人在深夜痛哭的努力,往往是最为糟糕的
我认为吧,更多的选择和试错的机会是最重要的,屌丝错一次就可能致命了。