在项目开发中经常遇到input等设置光标位置到最后的问题，今天我查了一下Google，找到了在IE、Firefox、Opera等主流浏览器的获取光标位置（getCursortPosition）以及设置光标位置（setCursorPosition）的函数。

function getCursortPosition (ctrl) {//获取光标位置函数
>     var CaretPos = 0;    // IE Support
>     if (document.selection) {
>     ctrl.focus ();
>         var Sel = document.selection.createRange ();
>         Sel.moveStart ('character', -ctrl.value.length);
>         CaretPos = Sel.text.length;
>     }
>     // Firefox support
>     else if (ctrl.selectionStart || ctrl.selectionStart == '0')
>         CaretPos = ctrl.selectionStart;
>     return (CaretPos);
> }

Ajax应用中容易导致浏览器的前进后退按钮失效，不产生前进后退功能，在本文中断桥残雪就通过改变location.hash值来解决Ajax过程中导致的浏览器前进后退按键失效的问题，此方法兼容IE6+，Firefox，chrome，Safari，Opera等浏览器。

在去年断桥残雪已经写了一篇使用iframe来解决Ajax前进后退的方法，也提到了通过改变hash的方法来解决这个问题，这也是比较方便的方法，而使用iframe实现Ajax前进后退可以在不改变浏览器地址栏地址的前提下通过iframe地址的变化来“欺骗”浏览器产生前进后退，hash的方法则是直接改变浏览器地址栏地址，从而使浏览器产生前进后退。

hash导致浏览器产生前进后退原理

浏览器URL的hash值，指的是URL地址之后的#hash部分，我们可以通过JavaScript的location对象的location.hash方法来获得或者改变，但是IE中，不能设置，好像是IE中只能通过连接来实现hash的改变，不过我们可以通过jQuery插件hashchange中的$.locationHash函数来解决这个问题。

比如一个页面的地址是：http://js8.in/#top，那么这个页面的location.hash="#top"，如果要改变这个地址的hash，可以给location.hash赋值，如：location.hash="#home"，在IE下可以使用hashchange函数中$.locationHash(hash)给hash赋值。在日常我们常见的使用hash应用中，hash值使用最多的方式是 “返回顶部” 功能。

昨天一个新来的同事关于iframe中进行DOM操作的问题，我说只要是不存在跨域的问题，是可以进行iframe 之间的DOM操作的。并且拿了以前写的两篇文章给新同事进行参考——《用document.domain+iframe实现Ajax跨子域》、《于Ajax在浏览器中产生前进后退的实现方法》。其中关于使用iframe进行跨域的demo，由于更换了新域名js8.in，导致了demo不能使用了，昨天紧急修改了一下，总算是可以使用啦~窃喜~

今天就写个完整的使用JavaScript进行iframe DOM操作的文章啦~跟大家讨论下IE和Firefox下iframe DOM操作的差异，然后写一个父窗口操作子窗口DOM，子窗口操作父窗口DOM，子窗口操作子窗口DOM的实例。经测试，断桥残雪写的iframe DOM操作实例，不仅仅只是在IE和Firefox下使用正常，而是可以兼容所有浏览器的。本文只是借IE和Firefox在iframe DOM操作的不同，进行分析说明JavaScript在DOM操作中两者的不同。

IE和Firefox对iframe document对象的差异性

在IE6、IE7中，我们可以使用 document.frames[ID].document 来访问iframe子窗口中的document对象，可是这是不符合W3C标准的写法，也是IE下独有的方法，在Firefox下却不可以使用，Firefox下使用的是符合W3C标准的 document.getElementById(ID).contentDocument 方法，今天我在写实例的时候，通过IE8进行测试，IE8也是使用的符合W3C标准的 document.getElementById(ID).contentDocument 方法。所以我们可以写一个在IE和Firefox下通用的获取iframe document对象的函数—getIFrameDOM：

function getIFrameDOM(id){
    return document.getElementById(id).contentDocument || document.frames[id].document;
}

P.S.:如果我们要获取iframe的window对象，而不是document对象，可以使用document.getElementById(ID).contentWindow的方法。这样我们就可以使用子窗口中的window对象了，比如子窗口中的函数。

PHP 是目前使用最广泛的基于 Web 的编程语言，驱动着数以百万计的网站，其中也包括如 Facebook 等一些大型站点。这里收集了 21个日常开发中实用便捷的 PHP 代码，希望可以对一些 PHP 开发者都会有所帮助。

1. 可阅读随机字符串

此代码将创建一个可阅读的字符串，使其更接近词典中的单词，实用且具有密码验证功能。

/**************
*@length - length of random string (must be a multiple of 2)
**************/
function readable_random_string($length = 6){
    $conso=array("b","c","d","f","g","h","j","k","l",
    "m","n","p","r","s","t","v","w","x","y","z");
    $vocal=array("a","e","i","o","u");
    $password="";
    srand ((double)microtime()*1000000);
    $max = $length/2;
    for($i=1; $i<=$max; $i++)
    {
    $password.=$conso[rand(0,19)];
    $password.=$vocal[rand(0,4)];
    }
    return $password;
}

断桥残雪在《IE6 PNG图片不透明问题的解决方法》中提到了使用js来解决IE6下PNG图片不透明的问题，今天我总结一下png在IE6下透明的方法：css方法、js方法、htc方法。

png透明针对IE6一直是件挺麻烦的事情，使用的方法也是各有不同，大多的原理是用IE的滤镜来解决的。
语法：
filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL )

enabled : 可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true | false true : 默认值。滤镜激活。
false : 滤镜被禁止。
sizingMethod : 可选项。字符串(String)。设置或检索滤镜作用的对象的图片在对象容器边界内的显示方式。 crop : 剪切图片以适应对象尺寸。
image : 默认值。增大或减小对象的尺寸边界以适应图片的尺寸。scale : 缩放图片以适应对象的尺寸边界。
src : 必选项。字符串(String)。使用绝对或相对 url 地址指定背景图像。假如忽略此参数，滤镜将不会作用。
现在一般在使用的方法有以下几种：

Ajax跨域一直是个比较麻烦的问题，例如：断桥残雪在一个项目中使用了open打开一个跟父窗口不同域名的新页面，结果子窗口就不能传值给父窗口了；再如：我在www.2fool.cn下不可以获取love.2fool.cn域名下的页面内容。**浏览器的跨域**限制是为了安全，可是当我们想要在一个域名下请求另外一个域名的内容的时候就感觉不那么爽了。

我在WordPress天气插件、滔滔API接口处理上都使用了JSONP的方法来实现的跨域。而今天我要通过使用JS的document.domain和iframe来解决Ajax跨子域的问题。

原理

通过给主页面跟请求页面设置相同的document.domain来，欺骗浏览器，达到Ajax跨子域的效果，此方法在IE，chrome，Firefox，Safari，Opera下测试通过。

缺点：无法实现不同主域名之间的通讯。并且当在一个页面中还包含有其它的iframe时，会产生安全性异常，拒绝访问。

刚开始建立WordPress博客的时候对于自定义域不是很了解，之后通过搜索相关知识：发现原来WordPress自定义域可以做很多事情，今天断桥残雪就说说WordPress自定义域三个用处：给某一日记添加js或者CSS，给加密的日志添加密码提示信息、首页显示日志缩略图。

给某一日记添加js或者CSS

WordPress 在发布日志时会对过滤一些Javascript、CSS内容，所以我们无法直接把JS、CSS直接写到日志，当然我们可以通过修改主题来实现。可是如果修改主题，把JS或者CSS的内容添加到 header.php 文件中，那么博客所有的页面都会加载这些内容，这样势必会造成整个博客效率下降。所以这个时候我们可以通过 WordPress 自定义域来给某篇的日志单独加载Javascript 和CSS。文章最后再介绍一种管理WordPress自定义域的小技巧工具。

假设我们给日志单独加载JS、CSS的自定义域名称是 head_JS_CSS。那么你首先需要把下面这段代码复制到你主题根目录下的 functions.php 文件中：

> function head_JS_CSS(){
>     if (is_single() || is_page()) {
>         global $post;
>         $head_JS_CSS = get_post_meta($post->ID, 'head_JS_CSS', true);
>         echo $head_JS_CSS;
>     }
> }
> add_action("wp_head","head_JS_CSS");

现在你在添加日志的时候，在WordPress自定义域区域，创建一个新的名称为：”head_JS_CSS”自定义域，在“值”输入你要单独为这篇日志加载的 Javascript 代码或者 CSS 即可。

随着jQuery的风靡，有很多关于jQuery选择器的文章，可是很多人没有系统的学过或者总结过jQuery的选择器使用方法，本文主要跟大家讨论一下jQuery的选择器的用法，针对于不同的jQuery用户，从基础说起，带您领略jQuery强大的选择器。

在跟大家分享自己的jQuery选择器的使用方法之前，我想跟大家说一个Tip，当你使用jQuery选择器的时候，有时候我们却不一定使用jQuery的选择器里面的函数，而是要简单的返回HTML对象，如果使用getElementById之类选择出HTML对象，就比较麻烦了，再说我们强大的jQuery选择器就浪费了，在这里我通过Firebug查看了jQuery选择器返回的对象，发现原来$(“#id”)[0]就是我们要的HTML对象，比如我们要取其中的innerHTML就可以使用$()[0].innerHTML。

关于jQuery选择器

通过jQuery的参考手册 我们可以看见jQuery的选择器分为：基本、层次、简单筛选、内容、可见性筛选、属性筛选、子元素、表单以及表单及其属性，共九种选择器类型，本文主要介绍基本选择器、属性、简单筛选、内容筛选这几个常用的选择器。如果能熟练掌握这几个选择器，那么我们的jQuery选择器就已经很熟练了

jQuery基本选择器

jQuery的选择器跟CSS的选择器很接近，甚至于跟CSS的选择器统一，这样就比较容易学习，简单选择器就是我们常用的CSS的ID和Class选择器，例如下面的代码把id为world的html内容改为“Hello World!”

前些日子给爱墙添加了RSS订阅功能，代码是自己写的，其中使用到了一个PHP类：RSS.class.php，感觉非常方便，不敢独享，特拿出来跟大家分享。

使用方法如下：
使用方法如下：

> include_once("class/RSS.class.php");//引入RSS PHP类
> $RSS= new RSS("名称","地址","描述","RSS频道图标");
> $RSS->AddItem("日志的标题","日志的地址","日志的摘要","日志的发布日期");
> $RSS->Display();//输出RSS内容

现在浏览器太多了也使我们前端开发人员慌了手脚，今天刘洋在写《教程：编写放在收藏夹里的网页划词翻译工具》的时候，问起来绑定事件的函数，由于一直使用jQuery开发，我都差点忘记了最原始的js添加绑定事件的方法啦~抽空立马写两个函数，以备不时之需。

javascript跨浏览器添加事件绑定 bind()

IE 的事件绑定函数是 attachEvent；而 Firefox, Safari 是 addEventListener；Opera 则两种都支持。使用jQuery就可以使用简单的bind()，或者$().click()之类的函数解决，而如果不使用JavaScript框架的时候，大家可是使用下面的封装bind()函数。

/************************************
 * 添加事件绑定
 * @param obj   : 要绑定事件的元素
 * @param type : 事件名称。不加 "on". 如 : "click" 而不是 "onclick".
 * @param fn    : 事件处理函数
 ************************************/
function bind( obj, type, fn ) {
    if ( obj.attachEvent ) {
        obj['e'+type+fn] = fn;
        obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
        obj.attachEvent( 'on'+type, obj[type+fn] );
    } else
        obj.addEventListener( type, fn, false );
}