随笔分类 - javascript
摘要：前端智勇大闯关-第二季-第三题10的世界在我们的世界里，字母A很好理解键盘兄表示65无压力CPU表示01000001才是王道1、题目中描述的三句话：二进制与十进制与A之间的相互转换2、在textarea元素中包含了一长串的二进制编码（0和1的世界）3、下图展示由二进制码转换成字母的过程每八位一组由二进制转化十进制，由十进制找到对应的asc码，将这些asc码每四个组成一组，再转换成十进制，最后，把十进制转成成asc码，对应的字母相应的就出来了。。。4、详细代码var str = "00110000001100000011011000111000001100000011000000110
阅读全文
摘要：元宵节快乐，哈哈哈。。。搬运工之解HTML：<!-- textarea 元素 placeholder新属性 --><textarea id="mtest" class="mtextarea" placeholder="请在这儿输入适当的CSS代码"></textarea>CSS：// textarea样式.mtextarea{ height: 140px; width: 260px; border: 1px solid #CCCCCC; margin-left: 2em; margin-right:
阅读全文
摘要：新春之际，新朋友老朋友，祝大家新年快乐。哈哈，给大家拜个晚年。UED 前端智勇大闯关-第二季（http://ued.taobao.com/quiz2/）这里给出了第一的答案及实现原理，与大家探讨，可随便吐槽。题目：请画一个三角形穿过4个点画这个三角形，相对比较容易。如下图所示：现在讨论的如何实现画板功能1、准备画布（新标签canvas）设置画布的宽高，为canvas设置属性width及heightvar cs = document.getElementById("ktest");var mcs = cs.getContext('2d');2、画一条线段obj
阅读全文
摘要：选择排序：基本思想是依次从待排序中选择出关键字值最小的记录、关键字值次之的记录……，并分别将它们定位到序列左侧的第一个位置、第二个位置……，从而使待排序的记录序列成为按关键字值由小到大排列的有序序列。直接选择排序：从第i个无序列表arr[i...n]中，选择关键字值最小的记录将其插入有序列表的末尾arr[n-i+1]，交换一次位置。function selectionSort(arr){ var n = arr.length; for(var i = 0; i<n-1; i++){ var tmp = i; for(var j = i+1; j <n;j...
阅读全文
摘要：冒泡排序：比较次数（n+1）*n/2，时间复杂度为O(n2)function bubblesort(arr){ var temp; for(var i=0;i<arr.length-1;i++){ for(var j = arr.length-1;j>i;j--){ if(arr[j-1]>arr[j]){ temp = arr[j-1]; arr[j-1] = arr[j]; arr[j]=temp; } } }}...
阅读全文
摘要：题目如下：怎么获取456abcd的值？<div id="test"><a>123</a>456<span>789</span><img alt="" src="http://www.aaa.com" />abcd<div>abcd</div></div>提示：456abcd是指div中的文本节点。原生javascript答：function trim(str) { return str.replace(/(^\s*)|(\s*$
阅读全文
摘要：js页面新消息提示多加了一个变量isusing，默认值为false，判断是否是newMessageRemind.show()是否已运行，如果运行，不提示，否则提示。点击document时取消提示。<!DOCTYPE html><html> <head> <title>js页面新消息提示</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> </head> <body&g
阅读全文
摘要：html部分：<div id="loadingbg"></div><div id="test"><div></div><span>0%</span></div>js部分： var arr =[ { "msrc":"*.css", "mtype":"css", "mpos":0 }, { "msrc":"*.js", &qu
阅读全文
摘要：页面加载进度条实现原理：将要加载的js动态的添加到head中，并根据每个是否加载完成，统计当前一共加载完成的个数。当每一项都加载完成，加载成功。设置加载失败时间。当超过这个时间提示加载失败。详细解释：<!DOCTYPE html><html> <head> <title>页面加载进度条</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <style> #test{heig
阅读全文
摘要：onbeforeunload和onunload都是在刷新和关闭浏览器事触发。onbeforeunload在onunload之前触发，因为有before，开个玩笑。由按钮事件触发，采用window.open方法，打卡一个新页面window.open('http://localhost/mtest/index.html', 'mtitle','height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no,resizable=no,location=no, status=
阅读全文
摘要：屏蔽浏览器右键： document.oncontextmenu = function(e){ e = e || window.event; return false; }有关自定义浏览器右键，请参考《自定义右键菜单》屏蔽使用（F5或ctrl+r）浏览器刷新： document.onkeydown = function(e){ e = e || window.event; var code = e.keyCode; var bCtrlKey = e.ctrlKey; ...
阅读全文
摘要：这部分是利用iframe实现我们的富文本编辑器。上面提到激活编辑模式有两个方法，contentEditable="true"与designMode="On"。contentEditable 是针对单个元素，而designMode是面向整个文档的。因此，当我们使用iframe时，我们得先取到iframe的document。var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;不过，在这之前，我们首先动态生成iframe，然后再对iframe进行一些样式设置，
阅读全文
摘要：有关前端智勇大冲关已给出了前三道题的解答，开始给出第四道题的解答，可能会有些出入，仅供大家的参考与学习。如果有误，请大家帮忙更正，谢谢。balls[] 定义长度为12的数组status 定义小球的轻重状态 -1代表轻 0代表正常 1代表重随机生成-1或1两种状态的一种，并随机放在balls数组中，并记录这个坏球在数组中的位置下面是我给出了一个简单的模拟示例。简单模拟测试：假如 mStatusType = -1; 坏球为轻 mBallPos = 3; 坏球的位置放在第四个 leftBalls = [0,1,2,3]; 记录位置，分别是1,2,3,4这几个球 rightBalls = [4,5,6
阅读全文
摘要：有关淘宝ued前端智勇大冲关的解答一、先给出每一关的地址第一关：http://ued.taobao.com/quiz/index.php第二关：http://ued.taobao.com/quiz/?ZzCMnTucu2VlfOC2xqrWQL4FY20第三关：http://ued.taobao.com/quiz/?PGKPkziU7DRlfOC2xqrWQbMOY2w第四关：http://ued.taobao.com/quiz/?PDSLnWnHvWplfOC2xqrWRLIFY2o二、分析每一关的解答第一关：考察css问题，考点在于字体颜色与背景颜色一样。查看源代码，便可以发现。第二关：考
阅读全文
摘要：初探html5拖拽，demo如下<!DOCTYPE html><html> <head> <title>html5 拖拽</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <style type="text/css"> #timing{width: 80px; height: 30px; line-height: 30px; text-align: c
阅读全文
摘要：由于最近有点忙，本打算写些关于栈的特性和实际应用。一直拖到现在才简单的写写。关于栈的实现见javascript 栈 stack一、数字进制之间的转换，可以栈实现。如将十进制转换为八进制 var s = new Stack(); s.Init(); function convert(num){ var str = ""; while(num!==0){ s.Push(num%8); num= pa...
阅读全文
摘要：栈是只允许在表尾进行插入，删除的线性表。特点后进先出。下面将演示用数组实现的栈栈初始化：创建一个空栈Init:function(){ this.STACKMAX = 100; this.stack = new Array(this.STACKMACK); this.top = -1; return this.stack;}判断栈空： 若栈为空返回true，否则返回falseEmpty:function(){ if(this.top==-1){ return true; } else{ return false; }}进栈：若栈满，返回“...
阅读全文
摘要：jquery动画有意思的地方见效果图： 思想：将图片设置分割div的背景图片，控制div的属性，可以现实有趣的滤镜效果，本例中展示了一种，感兴趣的朋友可以尝试其他滤镜的实现。本例其余动画部分，主要是利用jquery中提供animate和delay实现。animate：这个函数的关键在于指定动画形式及结果样式属性对象。这个对象中每个属性都表示一个可以变化的样式属性。delay：设置一个延时来推迟执行队列中之后的项目。实例效果：<!DOCTYPE html><html> <head> <title>jquery 动画</title> &l
阅读全文
摘要：js连连看首先见证奇迹的时刻---效果图如下：实现主要分为三个部分：一、创建元素块二、随机分布元素块三、事件绑定一、创建元素块生成span的元素标签，并将标签添加到父容器中，设置其left、top和background属性。/* * creSpan 创建元素标签 * n 指当前个数 * mpId 指父容器 * mleft 指其left属性值 * mtop 指其top属性值 * bgcolor 指其背景色属性值*/ function creSpan(n,mpId,mleft,mtop,bgcolor){ var mSpan = document.create...
阅读全文
摘要：含羞默默一张一合效果---田首先展示“田”字效果实现思想主要分为几部分随机生成颜色值 var getRandomColor = function(){ return '#' + (function(color){ return (color += '0123456789abcdef'[Math.floor(Math.random()*16)]) && (color.length == 6) ? color : arg...
阅读全文