ayue225-CSDN博客

原创使用javascript动态创建SVG对象的问题

如何在html中操作SVG对象的问题，对于嵌入式的可以通过document.getElementById('svgId'). getSVGDocument();的方法得到SVG Doc对象，但此方法存在两个问题：一是opera不支持getSVGDocument方法，二是对于动态创建的embed对象并不会马上被呈现，从而无法立刻得到SVGDocument对象，下面的方法会出错 va...

2011-04-24 01:04:43 486

原创 YUI3 事件

YUI3：事件YUI的事件功能为响应DOM事件提供一个简单的接口，让在浏览器中创建事件驱动的应用更容易了。YUI的事件功能包包含自定义事件对象(Custom Event object)，自定义事件让你可以在代码中发布（publish）某一个瞬间或某一个事件，以便页面上其他的组件能订阅(subscribe)这些事件然后响应这些事件。YUI的事件功能包有以下功能： DOM...

2011-04-23 20:02:30 198

原创直接运行html的代码

[code="java"]function runCode(pTargetId){var newWin=window.open('',"_blank",'');newWin.document.open('text/html','replace');newWin.opener=null;var testCode=document.getElementById(pTargetId).v...

2010-12-07 17:19:42 296

原创 JS正则表达式详解

JS的正则表达式//校验是否全由数字组成代码var patrn=/^[0-9]{1,20}$/; if (!patrn.exec(s)) return false //校验登录名：只能输入5-20个以字母开头、可带数字、“_”、“.”的字串代码function isRegisterUserName(s) var patrn=/^[a-zA-Z...

2010-10-28 10:12:31 100

原创如何在事件代理中正确使用 focus 和 blur 事件

什么是事件代理（Event Delegation）？如果不太了解的朋友，可详细阅读：《Event delegation in JavaScript》，这里不再累述。首先让我们一起来回顾一些常识：通常支持事件冒泡（Event Bubbling）的事件类型为鼠标事件和键盘事件，例如：mouseover, mouseout, click, keydown, keypress。 ...

2010-10-21 22:09:20 194

原创如何判断脚本加载完成

在“按需加载”的需求中，我们经常会判断当脚本加载完成时，返回一个回调函数，那如何去判断脚本的加载完成呢？我们可以对加载的 JS 对象使用 onload 来判断（js.onload），此方法 Firefox2、Firefox3、Safari3.1+、Opera9.6+ 浏览器都能很好的支持，但 IE6、IE7 却不支持。曲线救国 —— IE6、IE7 我们可以使用 js.onreadysta...

2010-10-21 22:04:22 118

原创 JavaScript 获取事件对象的一个注意点

平时我们获取事件对象一般写法如下：[code="java"]function getEvent(event) { return event || window.event // IE:window.event}[/code]如果没有参数，也可写成（非IE ：事件对象会自动传递给对应的事件处理函数，且为第一个参数）：[code="java"]function ge...

2010-10-21 22:00:01 92

原创判断 iframe 是否加载完成的完美方法

[code="java"]var iframe = document.createElement("iframe"); iframe.src = "http://www.planabc.net"; if (iframe.attachEvent){ iframe.attachEvent("onload", function(){ ale...

2010-10-21 21:52:26 314

原创 WAP网站设计之xhtml mp

一：XHTML MP的语法规则我们知道，我们通常用电脑访问的网站的网页是用html构建的。类似的，现在WAP 2.0网站是用XHTML MP构建，以供手持设备的访问，如手机、PDA等。XHTML MP是XHTML的子集，因此继承了它的语法。XHTML是更严格和简洁的HTML版本。现在来看看XHTML MP的语法规则：1：标签必须正确闭合！XHTML MP 教程段落...

2010-09-13 15:59:15 176

原创 JS将数字转换成三位逗号分隔的样式

[code="java"]function formatNumber(num){ if(!/^(\+|-)?(\d+)(\.\d+)?$/.test(num)){return num;} var a = RegExp.$1, b = RegExp.$2, c = RegExp.$3; var re = ...

2010-08-02 16:33:04 141

原创休閒小遊戲-------植物大戰僵尸2.2 for Android

2.2版更新：1、增加了迷你游戏-破罐者，一共有15关，难度逐渐增加。: j3 m; P! P0 `( P5 O S1 x2、上一个版本将放置植物的方式由拖动改为点击两次，部分人反映操作不习惯，过于繁琐，这个版本改为兼容两种操作方式，直接拖出或者点击两次先种阴影后种植物的方式都可以。3、增加了一种植物，棘草。6 ~4 g, T) e9 q- D9 B0 z$ R; l4、修改...

2010-07-30 13:20:54 101

原创 YUI 3.0应用初探

很惭愧。。。YUI3出来这么久了，一直都没有机会正式使用。。这2天没事，终于静下心来细细体验了下他的彪悍之处。实例中的一些code引用的taobao赤拔的成果，请赤拔大神表追究俺滴版权~ >_<[code="java"]YUI 3.0 应用初探.yui-overlay-content {border:10px solid;border-color:rgba(12...

2010-06-04 22:42:57 217

JS iframe跨域自适应内容高度

[code="java"] Cross-Domain iframe Resizing var FrameManager = { currentFrameId : '', currentFrameHeight : 0, lastFrameId : '', lastFrameHeight : 0,...

2010-02-24 11:05:50 170

原创话说browser的脚本并行下载

在讨论这次的主题之前，我们现在看一下脚本优化的另一个问题，就是“优化难度”。在这里我所说的“优化难度”是指优化一张页面时的修改难度。例如在前一片文章中，使用document.write来引入脚本的话，其“优化难度”会非常的低——没有任何副作用，不用修改其它任何代码。不过它的效果似乎还不太理想，因为仅仅优化了IE下的体验，在FireFox里却没有任何作用。　　很可惜，我回想了几乎所有...

2009-12-12 13:32:20 131

初涉YUI3

study.html[code="java"] 初涉YUI3 #yuidemo {float:left;background:#00CCFF; border:1px dotted #000; padding:1em; width:40%;height:300px;} #yuidemo1 {float:left;background:#00FFCC...

2009-12-11 13:44:27 109

基於YUI2.8的 JS版多文件上传

select files：[img]http://dl.iteye.com/upload/attachment/178876/88851306-2842-3556-95c6-dff1c9166adf.jpg[/img]uploading：[img]http://dl.iteye.com/upload/attachment/178878/5825c096-0035-3b07-910d...

2009-12-11 12:41:16 131

原创 CSS clearfix【解决容器不能根据内容自动撑开的问题】

[code="java"].clearfix {zoom:1;} .clearfix:after { content:'.'; display:block; visibility:hidden; clear:both; height:0px; font-size:0; line-...

2009-11-12 19:46:19 336

原创自定义滚动条

[code="java"]* { margin:0; padding:0; }body { margin:20px 0 400px 20px; font:12px Arial; }h1 { font-size:14px; }ol,ul { margin:20px; line-height:160%; }ul li { color:#f00; }.a1 {...

2009-11-12 19:42:50 189

原创 CSS clip 属性

定义 clip 属性设置元素的形状。当一幅图像的尺寸大于包含它的元素时会发生什么呢？"clip" 属性允许您规定一个元素的可见尺寸，这样此元素就会被修剪并显示为这个形状。继承性：No说明这个属性用于定义一个剪裁矩形。对于一个绝对定义元素，在这个矩形内的内容才可见。出了这个剪裁区域的内容会根据 overflow 的值来处理。剪裁区域可能比元素的内容区大，也可能比内容...

2009-11-12 19:41:08 129

javascript 整合的获取ID，className，tagName的方法

[code="java"]var get=function(className, tag ,root) { if(arguments.length==1){ root = (arguments[0]) ? (typeof arguments[0]=="string")?document.getElementById(arguments[0]):argument...

2009-11-12 19:40:14 260

javascript 中绑定事件监听的函数【支持数组对象绑定】

[code="java"]var addEventHandler=function(obj, type, func) { if(!obj){return;} var doOn=function(o){ if(o.addEventListener){o.addEventListener(type, func, false);} else if(o.attachEvent)...

2009-11-12 19:38:12 109

原创判断指定对象是否存在于另一个对象的原型链中

prototype 下的 isPrototypeOf() 方法, 它主要用来判断指定对象是否存在于另一个对象的原型链中. 语法如下:[code="java"]object1.prototype.isPrototypeOf(0bject2);[/code]上面的格式是用来判断 Object2 是否出现 Object1 的原型链中. 示例如下:[code="java"]func...

2009-11-12 19:35:45 265

如今的前端开发越来越oo，也越来越注重重用，娴熟的用js写出oo的前端代码已然是一个前端工程师的基本素质之一。从js语言的角度来看，模块是一个单体，单体有三类，简单对象单体，函数单体，原型单体，简单单体是最简单的一种写法，仅仅用一个大的对象将内聚的变量和方法包住，但由于没有封装，因此这种单体并不安全，而且一个单体在一个运行时只能有一个。函数单体是oo的一种基本型，他包含了封装和构造，是否用构造则取...

2009-11-12 19:33:39 165

Js 数组排序【支持对象】

[code="java"]//兼容 IE&FF&Safarivar format=(arr,type,keys){ switch (type){ case 0:return arr.sort(function(a,b){a=(keys)?(a[keys])?a[keys]:a:a;b=(keys)?(b[keys])?b[keys]:b:b; return a>b?-1:...

2009-11-12 19:30:59 90

原创如何避免Javascript事件绑定出现内存泄漏

[b]Javascript绑定事件时，只要DOM的事件里访问不了DOM自己的那个变量就行了[/b][code="java"]var e=document.getElementById("XX"); e.onclick=function(){}； // 事件绑定方法 2 var fooA = function(){ var f = funct...

2009-11-12 19:02:26 323

IE&& FF下使用js创建无边框iframe

[code="java"]var oIframe = null; if(navigator.userAgent.indexOf('MSIE') === -1){ // 非IE浏览器 oIframe = document.createElement('iframe'); oIframe.frameborder = '0'; ...

2009-11-12 18:59:33 117

原创文本溢出显示省略号的CSS兼容方法

[code="java"] ellipsis .demo{ margin:10px; border:1px solid #ccc; float:left; width:115px; overflow:hidden; white-space:now...

2009-11-12 18:57:02 81

原创让code在页面上也有行号，高亮显示

使用範例：十分感謝Syntax Height Lighter的作者，讓我們可以非常輕鬆且漂亮的show出代碼。兩個必要的文件 :JS文件： js/dpSyntaxHighlighter.jsCSS文件：css/dpSyntaxHighlighter.css使用方法和显示效果如图： [img]http://www.ding18.com/blog/attachments/d...

2009-11-12 18:54:52 409

原创区分IE6、IE7、IE8、Firefox2、Firefox3的CSS hacks

IE8正式版已经发布，对于网页设计者来说，在不开启IE8的兼容模式下，网站能否正常显示成了一个需要注意的问题，虽然IE8号称更加符合标准，但还是会出现局部显示不正确的bug，本站以前提供过一次有关于IE8的Hack，见《[url=http://www.flywe.net/article/css_div/622.htm]IE6、IE7、IE8、FF的简单Hack[/url]》，发现那里面提供的有关I...

2009-11-12 18:52:25 81

原创 JavaScript闭包的定义

1、JavaScript函数是被执行的代码和执行它们的作用域的组合。这个代码和作用域的组合在计算机科学著作中被称作：闭包(closure).所有的JavaScript函数都是闭包。然而，这些闭包只在这样使用时才有趣：当一个嵌套的函数被输出到它被定义的作用域之外。只有嵌套函数被如此使用时。才被明确的称为闭包。2、“官方”的解释是：所谓“闭包”，指的是一个拥有许多变量和绑定了这些变量的环境的表...

2009-11-12 18:49:22 94

原创 JS 中给方法绑定context

JS开发中，经常会遇到在执行一个函数时，需要设定该函数的context。比如，在使用window.setInterval(func, 1000)时，很多时候需要提供func函数的执行环境，这里是一个解决方案的例子，如下：[code="java"]var bind = function(obj, func){ return function(){ ...

2009-11-12 18:48:19 175

原创优化JavaScript脚本的性能

作者：ShiningRay @ Nirvana Studio随着网络的发展，网速和机器速度的提高，越来越多的网站用到了丰富客户端技术。而现在Ajax则是最为流行的一种方式。JavaScript是一种解释型语言，所以能无法达到和C/Java之类的水平，限制了它能在客户端所做的事情，为了能改进他的性能，我想基于我以前给JavaScript做过的很多测试来谈谈自己的经验，希望能帮助大家改进自己的Ja...

2009-11-12 18:45:16 94

JS 模拟上传进度条

[code="java"]JS模擬上傳進度條var bind = function(obj,func){ return function(){ func.apply(obj,arguments); };};var uploadBAR=function(container){ container=(!document.getEleme...

2009-11-12 18:06:50 128

仿开心网好友选择模块

功能效果图如下： PS:2009.11.19 新增鍵盤上、下、回車、退格按鍵的事件新增對已選擇好友的重複過濾和好友面板的預選擇對之前的一些小BUG進行了修復 2009.12.4 修復了一...

2009-11-12 18:01:16 106

JS 列表筛选、排序

[code="java"]排序body{font-size:12px;margin:0;padding:0;}.clearfix{zoom:0;}.clearfix:after{content:'.';display:block;visibility:hidden;clear:both;height:0px;}#mysort{width:80%;float:le...

2009-11-12 17:56:31 282

冷月軒