随笔分类 - Web UI
摘要:前些天有网友发来一些前端面试的题目,虽然说不是很难,但却是我们开发过程中经常碰到的问题,而且有些公司也喜欢面试这类的题目来考察面试者的能力,所以我觉得有必要收集一下有关这些的题目。题目一:找出字符串中出现次数最多的那一个字符?要解答这道题其实很简单,但怎么答得好才是关键,你写出的方法性能好才能得高分 1 // 方法一(推荐) 2 // 用到了正则,然后剔除了已计算过的字符,减少了循环的次数,所以性能是比较好的 3 function getMostChar1(str){ 4 var mostChar = [], 5 maxLen = 0, 6 oldStr...
阅读全文
摘要:学习JavaScript第一课:JavaScript简介Javascript 和EcmaScript虽然Javascript 和ECMAScript通常都被人们用来表达相同的含义,但Javascript的含义却比ECMA-262中规定的要多的多,没错,一个完整的 JavaScript实现应该有三部分组成:核心(ECMAScript),文档对象模型(DOM),浏览器对象模型(BOM)ECAMScript由 ECMAScript-262定义的ECMAScript与WEB浏览器没有依赖关系。实际上,这门语言本身并不包含输入和输出的定义。ECMA-262 定义的只是这么语言的基础,而在此基础上可以构建
阅读全文
摘要:JavaScript简介 JavaScript诞生于1995年。当时,他的主要目的是处理以前由服务区语言(如Perl)负责的一些输入验证操作。在JavaScript问世之前,必须把表单数据发送到服务区端才能确定用户是否在人们普遍使用的电话拨号上网的年代,能够在客户端完成一些基本的验证任务绝对是令人兴奋的。毕竟,拨号上网的速度之慢,导致了服务器的每一次数据交换事实上都成了对人们耐心的一次考验。 自此以后,JavaScript逐渐成为为市面上常见浏览器窗口必备的一项特色功能。如今,JavaScript的用途早已不在局限于简单的数据验证,而是具备了与浏览器窗口及其内容等几乎所有方面交互的能力。...
阅读全文
摘要:HTML5文件拖拽预览Demo HTML5文件拖拽预览Demo 文件预览区,仅限图片和txt文件 主要代码解析 样式部分就不说了,很简单 dragover、dragend、drop是三个与拖拽相关的事件。 dragover表示被拖放的元素正在本元素范围内移动 dragend表示拖放操作结束 drop表示有其他元素被拖放到了本元素中 代码中先分别监听这几个事件,取消浏览器默认的行为,然后利用HTML5中的File及FileReader判断读取拖拽的文件。 如果文件是图片,就用FileReader的readAsDataURL方...
阅读全文
摘要:混乱的URI编码 JavaScript中编码有三种方法:escape、encodeURI、encodeURIComponent C#中编码主要方法:HttpUtility.UrlEncode、Server.UrlEncode、Uri.EscapeUriString、Uri.EscapeDataString JavaScript中的还好,只提供了三个,C#中主要用的就有这么多,还没有列出其他编码(HTML),一多就弄不明白,弄不明白就心生恐惧,心生恐惧就变得苦逼,本文就向大家详细解释在JavaScript及C#中如何对URI进行编码的方法(注:本文不涉及到其他编码)。escape:不推荐使...
阅读全文
摘要:实现方法:先画一个外框 width: 240px; height: 240px;border-radius: 120px;填充背景色background:#b1e4ff;描边border:2px solid #789cb6;加阴影box-shadow: 5px 5px 7px #999;给该死的firefox3私有属性-moz-border-radius: 120px;再画一个小圈,width: 230px; height: 230px;border-radius: 115px;定位,position: relative;top:5px;left:5px;填充背景色background:#3b
阅读全文
摘要:12款有助于简化CSS3开发的工具:网站开发者能通过CSS3为网站设计增添很多时尚元素,CSS3 对CSS规范做了很大的改进。现在,本文将为你介绍12款有助于简化CSS3开发的工具。1、CSS3 Pie:允许在IE上使用CSS3绝大部分的酷炫功能。2、CSS3 Builder:通过该工具,你可以用类似应用photoshop特效的界面来设计复杂的CSS3 box模型。非常节约时间。3、CSS3 Drop shadow generatr:通过滑块功能直观的设计阴影。只需复制已被自动创建的CSS代码并粘贴到CSS文件中便可。4、Cascadr:非CSS3特有但却非常实用。允许输入HTML代码并能够侦
阅读全文
摘要:HTML5与jQuery如何实现渐变绚丽网页图片效果呢?通过HTML5和jQuery创建一个灰度/彩色的实现绚丽渐变效果。在HTML5出现之前,要想实现此类似渐变效果,需要彩图和灰度图像两幅图片,利用制图工具实现渐变图片效果。现在HTML5让开发者通过HTML5与jQuery实现渐变绚丽网页图片效果。HTML 5和jQuery动态转换任意一张彩色图像为灰度显示展示。通过HTML5和jQuery向你展示如何创建一个灰度/彩色图像的鼠标悬浮效果。在HTML5出现前,实现这个效果需要两幅图像,彩色的图像和灰度的图像版本版本。现在HTML5让开发者创建这个效果更加容易和高效,因为原始图像会直接生成灰度
阅读全文
摘要:浏览器的主要功能 浏览器的主要功能是将用户选择的web资源呈现出来,它需要从服务器请求资源,并将其显示在浏览器窗口中,资源的格式通常是HTML,也包括PDF、image及其他格式。用户用URI(Uniform Resource Identifier统一资源标识符)来指定所请求资源的位置,在网络一章有更多讨论。 HTML和CSS规范中规定了浏览器解释html文档的方式,由W3C组织对这些规范进行维护,W3C是负责制定web标准的组织。 HTML规范的最新版本是HTML4(http://www.w3.org/TR/html401/),HTML5还在制定中(译注:两年前),最新的CSS规范版本...
阅读全文
摘要:一、功能实现核心:FileSystemObject 对象要在javascript中实现文件操作功能,主要就是依靠FileSystemobject对象。二、FileSystemObject编程使用FileSystemObject 对象进行编程很简单,一般要经过如下的步骤: 创建FileSystemObject对象、应用相关方法、访问对象相关属性 。(一)创建FileSystemObject对象创建FileSystemObject对象的代码只要1行:var fso = new ActiveXObject("Scripting.FileSystemObject");上述代码执行后
阅读全文
摘要:jpager.js:View Code $(function () { $.post("/GetData.aspx", null, function (data) { var total = data; PageClick(1, total, 3); }); PageClick = function (pageIndex, total, spanInterval) { $.ajax({ url: "/GetData.aspx", data: "pageindex=" + pageIndex,...
阅读全文
摘要:众所周知,Jquery是对JavaScript的一种高效的封装,所以Jquery要操作的数组即是JavaScript中的数组,在 JavaScript中我们使用for以及for-in进行数组的操作,而在Jquery中则使用$.map()、$.each()来操作数组:首先是普通的数组(索引为整数的数组):$.map(arr,fn);对数组中的每个元素调用fn函数逐个进行处理,fn函数将处理返回最后得到的一个新的数组var arr = [9, 8, 7, 6, 5, 4, 3, 2, 1]; var newarr = $.map(arr, function(item) {return i...
阅读全文
摘要:要想做出一幅漂亮的主页可不是一件容易的事,除了熟练运用各种网页制作工具和编程语言之外,美术的知识也不能不懂,下面让我们来学习一点有关主页制作中色彩搭配的知识。色彩的含义色彩本身是无任何含义的,有的只是人赋予它的。但色彩确实可以在不知不觉间影响人的心理,左右人的情绪,所以就有人给各种色彩都加上特定的含义:红色:强有力、喜庆的色彩,很容易使人有兴奋感觉,是一种雄壮的精神体现。黄色:亮度最高的色,给人感觉就是很有温暖感,灿烂辉煌!试试加入淡红色或淡紫色!绿色:美丽、优雅,给人感觉大度、宽容。蓝色:永恒、博大,大家可以看看天空!给人感觉平静、理智。紫色:小MM们常用这种色,给人神秘、压迫的感觉。很怪的
阅读全文
摘要:不应该是局限于web2.0的网站的,只不过在web2.0的圈子里面,大家普遍比较重视用户体验,界面的交互友好性,因此做web2.0的网站推行用户为中心的设计(User-CenteredDesign)就容易得多。这些天总有些负责网站界面的设计人员找我咨询,怎么做用户访谈才感觉不像聊天,怎么样让用户参与到设计中来,得到更多的意见而不是简单的一句还可以或不错之类的评语,原型的改进花费时间总是太长怎么能缩短,设计的时候没什么把握,诸如此类的问题。。我想对此在msn上做的指导大量重复,需要在这里做一些入门级的解释了。。Q1:首先,用户为中心的设计环节包括哪些活动?答案:设计–〉原型–〉测试–〉再改进设计
阅读全文
摘要:$(window.parent.frames["iframe1"].document).find("input[@type='radio']").attr("checked","true");$(window.parent.frames["iframe1"].document).find("div >table >tr[id=1]").children().each(function(){ $(this).val();$(this).html()}
阅读全文
摘要:$("input[name='radio_name'][checked]").val(); //选择被选中Radio的Value值$("#text_id").focus(function(){//code...}); //事件 当对象text_id获取焦点时触发$("#text_id").blur(function(){//code...}); //事件 当对象text_id失去焦点时触发$("#text_id").select(); //使文本框的Vlaue值成选中状态$("input[
阅读全文
摘要:js判断时间格式是否有效 [转帖 2008-11-27 11:12:14]1 短时间,形如 (13:04:06)function isTime(str){var a = str.match(/^(\d{1,2})(:)?(\d{1,2})\2(\d{1,2})$/);if (a == null) {alert('输入的参数不是时间格式'); return false;}if (a[1]>24 || a[3]>60 || a[4]>60){alert("时间格式不对");return false}return true;}2. 短日期,形如
阅读全文