随笔分类 -  js

摘要：闲着的时候，突然想写个视觉落差的效果。遇到倒通了一些。前期百度找到的都是原生实现素材1.event.type(mousewheel//ie chrome opera,DOMMouseScroll//firefox);2.事件绑定(原生)【我是基于jquery写的直接用on代替】3.event.whe... 阅读全文

摘要：大家在做关于大数据的dom时候当在每个循环的单模块添加事件的时候会遇到问题:给单模块的内容添加事件。1.给每一个单模块绑定事件（产生的大量事件绑定，造成大量的事件绑定，性能消耗，而且还需要解绑（IE会泄漏））2.利用事件委托使用父级原生绑定实现每一个单模块的绑定事件。（例如新浪微博的每个发布人栏目的所有事件）大部分人都会选择第二种情况，因为他能对于所有子元素（包括后期通过JS生成的元素）所有的事件监测均能有效，且由于不用对多个元素进行事件绑定，能够有效的节省内存的损耗。当然jquery会做很好的处理。他从开始到现在一直在升级这个事件委托 live，bind，delegate，on事件。具体事件 阅读全文

摘要：深度克隆注意事项1.传参（如果参数为空时）2.事件名（如果突然事件名要重新命名时）function cloneObject(json){ if(json===null || arguments.length==0){//如果对象为空或者无参数时返回null return null; } var o=json.constructor===Array?[]:{};//判断参数是数组还是json（对象） for(var i in json){//循环对象进行复制 if(json.hasOwnProperty(i)){//当数组或者json（对象）有值的时候才进行克隆 o... 阅读全文

摘要：html<div class="star"> <a href="javascript:void(0)"></a><a href="javascript:void(0)"></a><a href="javascript:void(0)"></a><a href="javascript:void(0)"></a><a href="javascript:void(0)" 阅读全文

摘要：html代码<form id="formname"> 我的邮箱:<input type="text" autoCheck="nameemail" /><span class="add"></span><br /> 登录密码:<input type="text" autoCheck="namekey" /><span class="add"></span>< 阅读全文

摘要：例如：border-bottom-color-> borderBottomColor一个前端论坛出现的一题，写出自己理解的一个笨拙的方法理解词汇1.charAt 返回指定位置的字符2.substring用于提取字符串中介于两个指定下标之间的字符代码方法一 var border="border-bottom-color"; var oSplit=border.split('-');//转化为数组处理 for(var i in oSplit){//遍历每一个数组 var first = oSplit[i].charAt(0).toUpperCase();将 阅读全文

摘要：看过不少关于事件绑定（事件监听）的文章，曾经也白痴过。现在稍微懂点，仅给初学者了解。初期看到这个事件很陌生，因为作为美工的我负责的是拔特效，写一些下拉菜单。直到有一天，当写一个模拟select菜单的时候遇见一个问题，当时和我另外一个同事写的东西通用了一个id的特效，但是我的代码被覆盖了。知道网上搜索才了解到解决方法。事件：addEventListener//FF,Chorme.. attachEvent//ie例子：window.onload = function(){ var oDiv=document.getElementById('div1'); oDiv.onclick 阅读全文

摘要：菜鸟级别的前端制作写的jquery滚动代码，不废话了垃圾代码style*{ padding:0px; margin:0px;}li{ list-style:none;}#scroll,#scroll1{width:600px; margin:20px auto; position:relative; height:160px; overflow:hidden;}.list{ height:120px; position:absolute; left:0px; top:20px; overflow:hidden;}.list li{ width:100px; float:left; text-a 阅读全文

摘要：js模块代码function getStyle(obj,attr){ if(obj.currentStyle){//兼容ie return obj.currentStyle[attr]; } else{ return getComputedStyle(obj,null)[attr]; }}window.onload=function(){ oDiv= document.getElementsById('div'); console.log((oDiv,'width'));}HTML<div id='div'>fasdfsdfsdfsd 阅读全文

摘要：事件委托好处：1.提供性能。2.添加元素仍然有以前的事件效果。js片段window.onload = init;function init(){ var oUl =document.getElementById('ul'); var oInput = document.getElementById('input'); var iNow =4; oInput.onclick = function(){ iNow++; var oLi = document.createElement('li'); oLi.innerHTML = "&quo 阅读全文