经过自己一晚上尝试,貌似找到了一个方法。 现在脑袋还糊涂,先记下来,以后再分析。 代码如下: // 找到子元素在父元素中的相对位置 function getElementTop(element){ var el = (typeof element == "string") ? document.getElementById(element) : element; if (el.parentNode === null || el.style.display == none) { return false; } return el.offsetTop - el.parentNode.offsetTop; } 这个函数可以获取子元素在父元素中的...
这是在阅读underscore(1.3.3)源码中看到的,它的each方法 代码如下: var each = _.each = _.forEach = function(obj, iterator, context) { if (obj == null) return; if (nativeForEach && obj.forEach === nativeForEach) { obj.forEach(iterator, context); } else if (obj.length === +obj.length) { for (var i = 0, l = obj.length; i < l; i++) { if (iterator.call(context, obj[i], i, obj) === breaker) return; } } ...
效果预览图片: 大家可以下载demo看完整效果,下面介绍制作过程。 1.首先创建一个html页面,html结构如下: 代码如下: Image 1 Image 2 Image 3 Image 4 Image 5 大家一看就明白,viewer包含了几张图片,ul对象里面包含了‘上一条'、‘下一条'和各个图片对应的导航。 2.接下来需要为这些html元素设置css样式,css我就不多说了,就是给viewer、图片等元素加样式,viewer同时只能显示一张图片: 代码如下: #slid...
代码如下: function getElementsByClassName(elem_name,elem_tags) { //elem_name:查询的class名,elem_tags:在哪个元素下查找 if(elem_tags == null) { elem_tags = *; } var all_elem = document.getElementsByTagName(elem_tags);//返回一个元素数组 var arr = []; //定义一个空数组,用于存放结果 for(var i=0; iif(all_elem[i].className == elem_name) { arr.push(all_elem[i]); } } return arr; //返回这个结果数组 }
标准规范 HTML5规范文档中指出:如果一个元素符合下面两条规则中的任一条,则window对象中必须要有与之对应的一个属性,属性值就是这个对象.如果一个元素拥有ID属性,那么ID属性的属性值就会成为window对象的属性名. 如果一个元素拥有name属性,那么name属性的属性值就会成为window对象的属性名.但这个元素的标签名必须是: a, applet, area, embed, form, frame, frameset, iframe, img, object,其中的一个. 让我们看一个例子.假定存在...
代码如下: window.onload = function(){ var oDIv = document.getElementById(progressBox); var sytleElemt = window.getComputedStyle(oDIv); for(var i=0;i<sytleElemt.length;i++){ if( typeof sytleElemt[sytleElemt[i]] != undefined && sytleElemt[sytleElemt[i]] != none && sytleElemt[sytleElemt[i]] != rgb(0, 0, 0) && sytleElemt[i] != quotes ) console.log(sytleElemt[i]+":"+sytleElemt[sytleElemt[i]]); } } 上面...
index([subject])方法,返回值:Number(从0开始计数) index()方法返回指定元素相对于其他指定元素的 index 位置。注释:如果未找到元素,index() 将返回 -1。 代码如下: $(document).ready(function(){ $("button").click(function(){ alert($(".hot").index($("#favorite"))); }); }); 请点击下面的按钮,以获得 id="favorite" 的元素相对于 jQuery 选择器 (class="hot") 的 index: 获得 index Milk Tea Coffee JavaS...
好的程序往往是兼容多种浏览器的。 看下例: 一个简单的button,我们可以通过点击下面的button直接通过event对象得到当前的button元素,兼容多浏览器.当然,其他元素事件的写法同。
在我这几天的工作中遇到了一个问题,google了一下找到了解决方案,不过是英文的,我简单翻译下让更多的人能看懂 译文如下: 我有一个可编辑的div,并且在DIV里面还有一个可编辑的span,我想要让span能响应键盘事件, 这里是测试JS代码: 代码如下: $(function() { $(#someid).keypress(function(event){alert(test);}); }); 这里是测试html代码: 代码如下: editable follows:Some TEXT 如果你在浏览器中测试,你会看见,当你...
"元素拖拽改变大小"其实和"元素拖拽"一个原理,只是所动态改变的对象不同而已,主要在于 top、left、width、height 的运用,相对实现起来也非常容易。以下附出源码原型,弄明白了原理再扩展其他实际应用,思路就变得简单、清晰得多了 下面是 JavaScript Code 代码如下: /* * jQuery.Resize by wuxinxi007 * Date: 2011-5-14 */ $(function(){ //绑定需要拖拽改变大小的元素对象 bindResize(document.getElementById('test')); })...
代码如下: function checkuser(obj) { var obj = window.event.srcElement; var row = obj.parentElement.parentElement; var value = row.cells[0].all[0].value; var item = value.split("|"); alert(item); if (item.length > 1) { if (item[0] == "org") { alert(请选择执法人员!); return false; } } return true; }
主流浏览器默认为html元素提供的滚动条不美观,而且前端开发人员想对其通过css进行统一样式的美化也是不可实现的。比如ie可以通过样式来实现简单的美化、Webkit内核浏览器可以控制滚动条的显示效果,firefox则不允许用户为滚动条定义样式。但是对于追求友好的用户体验的前端开发人员,是不会被这些浏览器的不一致行为所阻止的。我们可以自己通过标准的html元素模拟来实现自定义的滚动条。 这里是自己在工作不太忙的时候写出来了一个...
代码如下: // 兼容火狐获取一个节点的相同类型的上一个相邻节点 function perviousSiblingSameType(node , cnode ) { // 为空直接返回null if(node.previousSibling == null ) { return null ; } else { // 节点类型不相等继续递归 if(node.previousSibling.nodeType != cnode.nodeType) { return perviousSiblingSameType(node.previousSibling , cnode); } // 节点类型相等则返回 else if(cnode.nodeType == node.previousSiblin...
将一下代码放在全局js文件中: Js代码 代码如下: /** *删除数组指定下标或指定对象 */ Array.prototype.remove=function(obj){ for(var i =0;i <this.length;i++){ var temp = this[i]; if(!isNaN(obj)){ temp=i; } if(temp == obj){ for(var j = i;j <this.length;j++){ this[j]=this[j+1]; } this.length = this.length-1; } } } 使用方法: Js代码 代码如下:var arr =new Array(); arr[0]="dddddd"; arr[1]="dxxxxxxx"; arr[...
初始化(元素id, 元素移动的方向用123456789分别表示左上、上、右上、左、中、右、左下、下、右下。 撞击位置,9个数字分别表示9个地点,按顺序左上角、上、右上角、左、中、右、左下角、下、右下角,5居中。 运动的logo /**************************************************************** * name:运动的元素对象sportBox * DATA --2012-12-20-- 美工 ***************************************************************** *...