Ajax中国 okajaxserver@foxmail.com 15 http://www.okajax.com/a/201203/mobile_website.html 本教程简明介绍了如何进行手机网页设计开发，涉及了六个关键点及相关的注意事项、验证工具和测试工具 本教程简明介绍了如何进行手机网页设计开发，涉及了六个关键点及相关的注意事项、验证工具和测试工具。   现在越来越多的人通过手机上网，未来移动互联网市场会越来越大，但是现在很多手机网页设计制作大多不如人意。 手机网页制作比想象的要容易，本教程将介绍手机网页设计和制作的六个方面的知识，让你避免走一些现在的手机网页的弯路，学完本教程后，你就能对手机网页的制作和设计有大概的了解，然后有针对性地学相应知识。 1.手机网页的标记语言WML WML（无线标记语言，Wireless Markup Language），早期的手机上网只能通过wap网站，而WML是用来制作手机wap网站的主要标记语言，它能够比html消耗更少内存和cpu。 因为WML大部分针对早期和低端的手机，现在已经逐步被其他的技术取代了，现在学习手机网页设计制作完全可以忽略WML。 但是仍然有一部分手机，如诺基亚1100这种超便宜和低端的手机，有着200万左右的用户，假如手机网页的受众是这部分人，还是应该用WML。 XHTML 未来智能手机的市场份额会越来越大，考虑到这点，现在进行手机网页设计制作时，我们会用到更加熟悉的标记语言Xhtml。 现在大部分智能手机的浏览器都能正确处理Xhtml，它会识别两种类型的Html。 ① Xhtml：基础的，和桌面浏览器相同的Xhtml ② Xhtml-MP：针对智能手机的Xhtml 这两种类型的不同之处，Xhtml-MP包含比较少的要素和相对宽松的限制，能适合手机平台的渲染， 其实在手机网页设计制作时，很多都直接用Xhtml，也没什么大问题。 2.手机类型 分辨率问题：这个问题已经开始在视频制作领域出现了，因为之前很多电视分辨率都是4:3，而现在更多的是宽屏幕，很多视频制作者不知道如何去放置标志和信息。这也是网页设计者和开发者经常会遇见的难题。 在手机网页的设计制作中，这个问题更加棘手，不仅要考虑分辨率、尺寸大小的兼容，而且设计制作还要考虑不同的手机屏幕的形状，下图显示了手机的不同分辨率，屏幕形状从接近正方形到长方形都有，这在设计制作手机网页时，几乎令人抓狂。 可以把手机根据屏幕尺寸分成几种常见的类型，如： 128 x 160 pixels176 x 220 pixels240 x 320 pixels320 x 480 pixels 这样在设计制作手机网页时，就可以比较有针对性。注意要尽量把手机网页制作成简洁的风格，因为手机没有鼠标，只能向上和向下，用户不能方便地切换页面。 手机市场上既有非常高端的iPhone手机和谷歌的Android手机，也有诺基亚一些单色点阵显示的低端机。这些低端机在浏览手机网页时有很多的限制，如屏幕分辨率、渲染Xhtml的性能等，因此如果你的手机网页是针对这部分用户，最好还是用WML。 另一方面，类似于iPhone和Nexus One这种高端智能机，拥有可以和桌面浏览器相媲美的渲染网页的性能。对这部分用户而言，良好的用户体验是很重要的，受限于手机的传输速度，如果直接用一般的电脑上浏览的网页来代替手机网页，对手机网页的目标客户来说，并非明智之举。 3.手机网页的目标群体 任何网站设计网页时都应该明白自己的目标群体，以便向他们传输最合适的信息。 这点在进行手机网页设计制作时更为重要。因为你不仅要知道你的目标群体，还要知道他们浏览手机网页时的情景。 浏览传统的网站，访客会坐在桌上，有着大分辨率的屏幕。手机网页的访客则有可能是在排队、等交车、坐在地铁等。 如何区分？这点我们可以向谷歌学习。谷歌花了很多功夫在让网页应用程序适合手机使用上，谷歌的开发者将看手机网页人群分为三大类，这对我们进行手机网页的设计和制作，很有参考意义。 A：一般手机用户 一般用户访问手机网页时和用电脑访问网页差不多，他们没有特别热衷于哪个领域，他们只是利用空闲时间浏览网页。 对于电脑浏览网页的用户而言，这些空闲时间可能是休息时间。但是对用手机浏览网页的用户而言，则可能是在等待朋友或上下班路程，这意味这他们随时可能中断网页的浏览。如果你的目标群体是这些人，在制作设计手机网页时要特别注意这些手机用户的屏幕尺寸和时间上的限制。 因此设计制作手机网页要“记住”用户看的内容的位置，以便他们随时返回浏览。最好不要使用大段的内容，相反，要把手机网页的内容制作成几个小的部分，引起他们的关注。记住，这些手机用户没有时间去浏览大段的内容。 B：回访者 回访者是一些会时常回访网页，以便获取他们感兴趣的内容的人群。 如果你的手机网页提供的是一些诸如天气预报、股票资讯、比赛运动的信息，那么目标群体就会有相当多这部分的人。因为手机屏幕提供的信息是有限的，所以针对这部分手机用户设计制作网页，要考虑到这些人需要哪些信息，将这些信息放在手机网页的重要位置，避免这些人在手机执行了很多操作才在网页上找到需要的内容。 另一点是关于为手机网页用户提供定制服务的问题，如制作手机网页论坛。因为手机用户登录不是那么方便，所以如能避免则尽量避免。 有一些专业的网站允许手机用户通过电脑访问他们的网站，然后定制相应的手机网页的页面，这样会生成一个专门适用该用户的网址，下次这个用户用手机访问时，就能直接适用自己定制的界面。 C：特殊手机用户 根据你的手机网页所要提供服务的不同，这部分用户也会不同。 比如电子商务用户可能会通过手机网页向你发送一些比如“未收到货物”的通知，或者一些航班公司会收到用户从手机发送的“搭机迟到希望立即退票”的通知。对于这些特殊用户，设计制作手机网页时要让他们很方便的地迅速地实现这些要求。 #p#手机网页设计入门之一#e# 4.根据具体需要提供网站内容 一个很常见的误区是很多网页开发者认为只需要简单的设置，就可以将一个传统的网页变成可以适应手机浏览的网页，他们认为只需要在CSS样式表将media=”screen”变成media=”handheld”就能使网页神奇般地适用于手机。 这是错误的想法。 虽然针对手机用户变更网页的CSS可以过滤一部分的内容，或者一些CMS网页也提供了相应的转换插件。但这些方案并不完善。 W3c定义了“一个网站”的概念，意思是手机网页不一定要提供和传统网站完全一样的内容和设计，而是要根据手机的性能、带宽等方面的不同提供一些差异化服务。 根据这个定义，一些传统网页的内容和功能不能在手机上实现是很合理的。不同手机能处理的内容和功能也都是不一样的。所以也可以根据这些手机进行相应的网页制作。 下图的手机网页，设计制作时仅仅保留了搜索产品和寻找商店的功能，这和它的传统网页版本简直天差地别。但这样是合理的。 5.选择域名 为手机网页选择什么域名取决于你的目标群体是如何进入网站的。这里有三种域名可供选择： A：为手机网页使用独立域名（如：www.mobile-example.com） 这是不推荐的方式，没有必要为你的手机网页用一个独立的域名。 多个域名不仅降低你的网站的品牌度，而且会给用户造成混乱。用户不愿意多记住一个专为手机网页而设的网址，并且这样也很难选择哪个域名用来做宣传推广。 B:为手机网页使用子域名（如：m.example.com） 这是最流行的方式。 使用子域名可以让手机网页成为你的品牌的一部分，也不会给用户造成混乱。如果觉得在前面加一个“m”表示手机网页的方式不好，也可以考虑放置URL后面的方式，如：example.com/mobile/。 而且你要考虑用户输入错误网址的情况，所以尽可能为手机网页设置几个名称接近的子域名，并将它们重定向一个单独的子域名，这和将不带www的网址重定向带www的网址一样。 C：为手机网页注册.mobi的顶级域名（如：example.mobi） 自从.mobi可以使用之后，就引发了手机网页开发者的热烈争论。 我个人从未使用.mobi设计制作手机网页。 D：判断客户端，并自动显示对应内容 这是一种有趣的方式：制作手机网页后，让服务器判断客户端是电脑还是手机，然后根据显示相对应的内容。 优点：只使用一个网址，不论电脑还是手机都能接收到正确的内容。 缺点：因为服务器会自动为客户端选择相应版本的网页，所以用户不能自己选择想看到的内容，比如一些iPhone用户可能不希望看到简陋版的手机网页。解决这个缺点可以通过为一些手机设置例外。 总结：现在制作手机网页的公司大都使用第二种方式，即使用子域名，这是最简单也是最廉价的方式，也省去了很多服务器设置的麻烦，而且这种方式也很灵活，一旦手机网页流量没有达到预期的效果，对子域名进行处理也不会影响到传统的网页。 6.为手机网页验证标记语言 电脑的网页浏览器对错误比较宽容，一些html标记的忘记书写或者没有正确嵌套在电脑浏览器都会正确显示，当然容错率高意味着消耗更高的cpu和内存。 手机浏览器的性能还无法和电脑相提并论，所以手机浏览器对手机网页的错误要严格一些。所以在设计和制作手机网页时，你必须不断进行检查、验证和纠错。 验证手机网页和验证一般传统的网页没什么区别，如果你使用Xhtml编写，可以使用相同的工具。 W3C验证器可以验证一些简单的错误，当然这里有一个更适合验证手机网页的版本。Ready.mobi site有一些专为验证手机网页的选项。7.为手机网页不断测试 当通过了手机网页的验证之后，就要针对几种不同的手机进行各种测试了。 用电脑的浏览器虽然可以进行模拟测试，但是并不完善。这种方式通过的手机网页不能适用于某些手机。 有些手机文件尺寸的限制可能会很小，所以你制作的手机网页在这些设备上甚至无法显示。另外浏览器支持的文件类型也会不同，支持的图像格式也会不同。 测试时候手机网页当然不可能拥有所有手机，所以制作网页时可以使用一些替代手段。 A：为手机网页使用模拟器 有很多在线模拟器和离线模拟器，这些工具允许你快速预览手机网页的图像和布局，但这些毕竟不是真正是手机，还是存在一些潜在的问题，所以只能作为手机网页第一次的快速测试。 B：为手机网页购买测试服务 有一些公司为手机网页的设计制作提供测试服务，可以上传文件到这些公司，然后远程操纵，实时观察不同手机浏览网页的表现。一般为付费服务（中国这类公司很少）。 C：购买一些手机测试手机网页 如果你想专业设计制作手机网页，可以考虑购买一小些有代表性的手机，可能需要购买5-6台，以便覆盖市面手机的主要类型和品牌。 基于Windows平台的，如HTC Mogul PPS-6800，在windowCE使用IE浏览器。基于塞班平台的，如诺基亚的6600，使用内置浏览器或者opera浏览器。基于苹果OS的iphone，使用Safari浏览器。基于谷歌的Android平台的，使用默认浏览器或第三方浏览器。最后，选择目标客户常用的手机，如中国用户可以测试UC浏览器。D：借朋友手机帮忙测试手机网页 通过模拟器，你应该完成了手机网页的大部分测试，这时候可以找身边的朋友借一些手机测试网页，记下Bug，再进行不断测试。 测试手机网页时，可根据预算，选择以上的测试方式。然后整理出一些手机网页上容易出错的html、css、JavaScript的代码，以方便以后设计制作手机网页进行调试。 总结 本教程覆盖手机网页设计制作的六个关键点。只要注意这些要点，再结合一般的网页开发的知识以及对手机网页的不断测试，你就可以应付制作手机网页的挑战，设计制作出一个成功的手机网页。 注:本教程适用于有一定传统网页设计和开发经验的用户。 #p#手机网页设计入门之二#e# 手机,网页 设计杂谈 北极星 未知 2012-03-02 21:51 http://www.okajax.com/a/201203/android_ios.html 除了自认“鄙视苹果”的设计师专门跟苹果过不去而开发的APP外，大多数都会尽量覆盖包含尽可能多的用户，当然不会放弃ios。当然，能用手机上网基本都是android和ios的粉丝，这就需要考虑在iOS和Android两种主流操作系统间移植的问题。想既省力气又有效，那就来看看iOS与A 除了自认“鄙视苹果”的设计师专门跟苹果过不去而开发的APP外，大多数都会尽量覆盖包含尽可能多的用户，当然不会放弃ios。当然，能用手机上网基本都是android和ios的粉丝，这就需要考虑在iOS和Android两种主流操作系统间移植的问题。想既省力气又有效，那就来看看iOS与Android间有什么差别吧。 1、物理键之返回 Android手机的基本设计思路是是把最常用的功能硬件化，所以就有了home,menu,back三个功能键（其实界面设计很简单啦，就是“用户到某个地方做某事”，所以就有了导航用的back和展开命令用的menu）。 乔老爷够狠，要求iOS设备只有一个物理键home（据说以后还会把这个键砍掉，用手势当home）。所以在iOS上，返回是通过title bar左侧的back按钮来实现的。但这样设计也有好处，因为这个back“软”键上的文本是可以改的。在这个按钮上填上上一次的题目，可以让用户明确地知道按下它会回到哪里。 2、物理键之menu 在android上，与当前页面相关的命令会收到由“menu”键唤出的菜单里。而在iOS上，这些命令会放在屏幕底部的toolbar上。这种展示方式相比android的优点是“能一目了然地看到能够对当前页面做的操作”。而在android上，必须按下menu键才能看到命令。你不希望用户在使用你的APP时肩负着把这些命令背下来的艰巨任务吧？ 3、Android的加分项：通知系统 在iOS上，向用户推送信息的方式只有一种，就是alert box。这在iOS只支持单任务的时候还好说，提醒一来，哦…… 看完了就点确定。但到了多任务版本后就有点不合用了。虽然iOS的alertbox可以在用户使用某APP的时候弹出其他APP的提示，但这样未免太烦了。有时一些提醒并不需要强硬中断用户当前的操作，比如后台在下载的报纸下完了。Android有更精巧的Status Bar Notification和Toast Notification（详情可参看钟磊的手机系统消息通知设计的整理和分析和我写的如何为手机界面设计提示消息）。当要推送非紧急的消息时，Android平台可以使用更柔和的状态栏提示。 4、Android的加分项：长按操作 在Android上，当需要对一个对象采取一些操作时，可以长按，唤出相应的context menu（这是对一个项目的，如果是针对当前整个页面的操作，Android有menu物理键，iOS有toolbar）。但是在iOS平台上就不太有地方去放置针对屏幕上某一个对象的大量操作（一两个是可以的，放在项目旁边就O了）。可能在乔老爷看来，当需要对一个对象进行“炒、炸、烹、煮、蒸、熏、爆”的时候，就说明你想要的太多了。 5、iOS的加分项：右上角的快捷操作按钮 对于“右利手”用户而言，单手持机时屏幕左下角到右上角的连线是右手拇指的甜区。所以依照iOS的Guideline，当前页上最最最最最最最最最最最最最最常用的按钮应该放在titlebar的右端。 其实你会发现，清楚了这些差异之后，如何在平台间移植APP就清晰明了啦。 Android -> iOS 1、在每一级的标题栏左上角加上返回上一层的按钮。按钮名一定要是上一级的名称，不能用“返回”等无法透露回到哪里的文字。 2、由于iOS上没有menu键，所以需要将menu上的命令转化成toolbar上的图标。因此要额外绘制图标或者使用内置图标。 3、由于在iOS上没有“长按出context menu”的规则，所以需要给项目添加一个detail页面。不能在list页面操纵项目，那就再drill down一层呗。 4、由于iOS的通知方式只有alert box，所以诸如“下载完成”等提醒只能筛出重要的部分，用alert box传递。对次要提醒的设计可以看我之前的文章。 iOS -> Android 1、左上角的返回按钮拿掉。 2、工具栏上的命令可以放到menu里。 3、如果对某个对象的命令很多，可以为其设计长按的context menu 4、不是很紧急的提醒就不要用alert box了，可以换成status bar notification 5、标题栏右侧的高频按钮可以保留，这个在android上也可以通用。 其实总的来说，也就两点： 1、差异主要体现在导航方式和页面命令上，所以对于页面元素的布局基本没影响。尤其是对于全屏游戏这种基本没导航，控件又都摆在屏幕上的更是影响不大。 2、iOS对硬件的依赖更低。如果实在是小公司，赶时间，没精力跨平台移植的话，可以考虑只为iPhone设计，然后直接套到android上，凑活着也能用的。但android用户在使用时也会觉得有一点点怪怪的。 手机,android,ios,苹果 其他 北极星 未知 2012-03-02 21:36 http://www.okajax.com/a/201202/make_website.html 虽然目前制作网页的工具很多，但我们建议新手务必要从手工编写网页代码起步。一方面，这样可以使你更深刻地理解网页的工作原理，从而认识到制作网页与用Office软件编辑文档的本质区别;另一方面，在很多情况下，相比使用网页制作工具，直接修改网页代码将更为快捷，产生 对于一个从零开始的普通网友，应当通过这三个步骤成为一个合格的网站制作和管理者吧。 一、从手工编写最基本的代码起步： 虽然目前制作网页的工具很多，但我们建议新手务必要从手工编写网页代码起步。一方面，这样可以使你更深刻地理解网页的工作原理，从而认识到制作网页与用Office软件编辑文档的本质区别;另一方面，在很多情况下，相比使用网页制作工具，直接修改网页代码将更为快捷，产生的网页文件容量也更小，结构更为清晰，便于后期维护。 手工编写代码的最佳工具就是Windows系统自带的“记事本”软件，而所编写的代码，我们称之为“Html语言”。使用“记事本”软件，按Html语言所规定的格式书写代码，并在硬盘上将它以“htm”或“html”作为扩展名的文件保存下来，在其上双击鼠标，就可以通过浏览器打开它并查看网页的显示效果。整个过程非常方便，且不用安装额外的软件工具，非常适合没有基础的新手学习。 Html语言本身内容比较多，为了让初学者的学习尽快见效，建议从以下几项内容入手： (1)网页的结构。 包括：标记网页起始的标记，分隔网页头部的标记，分隔网页体部的标记，初学者可以在标记内随意键入一些文字察看网页的显示效果。 (2)图片标记。学习了这一标记，就可以做出图文并茂的完整网页。同时，也可以使你深刻地理解到：在网页中文字和图片实际上是分成多个文件来存储的，与Word文档将图文存储在一个文件中是完全不同的，而这也往往是初学者最容易误解的地方。 (3)超链接标记。学习了这一标记，就可以通过点击某一行文字，实现转向另一个网页。超链接是互联网世界的魅力所在，浩瀚无穷的信息都是通过无数的超链接联接在一起的。制作超链接，通常需要编写出多个网页文件，并在每个文件中写入不同的链接文字。这也将使你对网站文件的存储方式有更深入的了解。 (4)制作表格的标记。表格是网页中非常重要的元素，除了以列表方式显示数据外，在网页中划分区域、布局文字图片等各种元素，都是通过表格来实现的。掌握了分析表格代码的能力，将会使你在网页的后期维护中如虎添翼。 切实学会了这几样知识，就已开启了制作网页的大门。不管以后应用的技术有多复杂，也都是围绕着这几样技术来展开的。 二、学习制作网页的辅助工具： 学会了手工编写代码，已经可以做出有模有样的网页了，但是难以做出具有一定规模，布局较为复杂的页面。要实现这一目标，还必须借助网页制作辅助工具。 Dreamweave是众多网页制作工具中出类拔萃的一员。然而这个软件功能强大，菜单、按钮繁多，初学者如果为了图省事，一上手就用这个工具来做网页，势必会一头雾水，摸不到方向。如果对网页代码有了比较深入的了解，先想好在代码中可以实现何种效果，再在Dreamweave软件中寻找相应的功能，就会容易得多，也更便于记忆。 在Dreamweaver中，“布局表格”是非常有特色的一项功能，用户通过操控鼠标，在屏幕上划出一个个方块，就可以实现各种网页元素的排布。这也是制作格局复杂的网页的有力工具，需要重点掌握。 三、向建立交互式和基于数据库的网站进军： 以上两种方式，做出的还只是单方面展示信息的网页。要实现访问者和网站之间的真正交互，则必须要通过后台程序来实现。比如，用户在前台页面中输入一些信息，网站后台程序获取这些信息并进行甄别，根据不同的判断结果给用户展示不同的网页，从而实现对话式的信息互动。目前比较流行的后台编程语言有Asp语言、Php语言等，学习这些语言，需要具备一定Basic语言、C语言的基础。 如果网站需要对外提供商品信息这样经常变动的数据、或是要保存用户所输入的信息，后台数据库是最有效和常用的方法。对于初学者来说，采用Asp语言+Access数据库的组合是不错的选择。Windows系统包含了支持这些工具的网站服务组件，你可以方便地把自己的电脑变成一个网页服务器，不需要额外安装其他的软件。如果你已联上网，则可以让你的亲友通过你的IP地址访问一下你的网站，让他们也来分享你的成功喜悦。   制作,网站 设计杂谈 北极星 未知 2012-02-01 20:13 http://www.okajax.com/a/201202/jQuery_Editable.html 在不少大程序，包括discuz上经常看到，双击页面的一段文本，竟然可以直接编辑，挺神奇一个功能，今天介绍一个jquery插件，实现这个功能只在瞬间，那就是功能强大、代码简洁、扩展方便的jQuery Editable 在不少大程序，包括discuz上经常看到，双击页面的一段文本，竟然可以直接编辑，挺神奇一个功能，今天介绍一个jquery插件，实现这个功能只在瞬间。jQuery editable plugin它能够将任意不可编辑的标签（span、div、p...等）转换成可编辑的text input、password、textarea、下拉列表（select）等标签。 首先用下面代码，在页面中引入jquery和jquery.editable（注意路径的使用） <SCRIPT language="javascript" type="text/javascript" src="files/jquery.min.js"></SCRIPT> <script language="javascript" type="text/javascript" src="files/jquery.editable-1.3.3.js"></script>   然后用$取得你要实现双机编辑的块，例如下面代码中的$("#note")，即为id为note的div。然后设置下面几个参数 1、editby：触发事件，例如双机、单击等。 2、type：双机后可编辑区域变成哪种表单，例如textarea、input、select等。 3、editclass：第二条所说的表单所采用的样式。 4、onsubmit：当鼠标单击可编辑区域以外的地方时，将数据提交到服务器的ajax函数。 $(function(){$(document).ready(function(){      $("#note").editable({editBy:"dblclick",type:"textarea",editClass:'note_area',onSubmit:onSub});});     下面有一个例子，后台使用的asp+access方便演示。 jquery.editable 我测试时使用的jquery1.3版本，因此jquery1.3版本以上可用。 jQuery,Editable,双击编辑 jquery.js 北极星 未知 2012-02-01 19:46 http://www.okajax.com/a/201112/javascript_flash.html script type=text/javascript language=JavaScript //Powered By smvv @hi.baidu.com/smvv21 function flashChecker() { var hasFlash=0; //是否安装了flash var flashVersion=0; //flash版本 var isIE=/*@cc_on!@*/0 ; //是否IE浏览器 if(isIE) { var swf = new Active <script type="text/javascript" language="JavaScript"> //Powered By smvv @hi.baidu.com/smvv21 function flashChecker() { var hasFlash=0;         //是否安装了flash var flashVersion=0; //flash版本 var isIE=/*@cc_on!@*/0;      //是否IE浏览器 if(isIE) { var swf = new ActiveXObject('ShockwaveFlash.ShockwaveFlash'); if(swf) { hasFlash=1; VSwf=swf.GetVariable("$version"); flashVersion=parseInt(VSwf.split(" ")[1].split(",")[0]); } }else{ if (navigator.plugins && navigator.plugins.length > 0) { var swf=navigator.plugins["Shockwave Flash"];     if (swf)      { hasFlash=1;         var words = swf.description.split(" ");         for (var i = 0; i < words.length; ++i) {             if (isNaN(parseInt(words[i]))) continue;             flashVersion = parseInt(words[i]); }     } } } return {f:hasFlash,v:flashVersion}; } var fls=flashChecker(); var s=""; if(fls.f) document.write("您安装了flash,当前flash版本为: "+fls.v+".x"); else document.write("您没有安装flash"); </script> javascript,flash,版本 功能代码 北极星 未知 2011-12-12 11:52 http://www.okajax.com/a/201110/php_up_down.html 今天做系统要用到“上移”或“下移”功能，网上找到下面的方法，虽然繁琐，但是实现起来还算简单。1、我们数据库表中需要一个排列字段作为移动排序的参考，表中添加字段weight;2、我们一开始先让weight与ID对应起来,也就是每条记录的ID值： 今天做系统要用到“上移”或“下移”功能，网上找到下面的方法，虽然繁琐，但是实现起来还算简单。   1、我们数据库表中需要一个排列字段作为移动排序的参考，表中添加字段weight; 2、我们一开始先让weight与ID对应起来,也就是每条记录的ID值：   weight字段设置的和自增字段相同。插入记录后$weight=mysql_insert_id(),得到最近插入记录ID的值，然后更新表： $sql="update table set weight={$weight} where ID={$ID}"; mysql_query($sql);    上移或下移时：取欲移动的新闻的上一新闻或是下一新闻的weight值，然后将自己的weight值改为刚才取出的weight，刚才取出的改为自己的。（交换一下weight值）SQL排序规则：在原有规则(order by)前加入weight desc     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>实现新闻的上移下移功能</title> </head>   <body> <style> *{font-size:12px;} td{height:24px; line-height:24px; text-align:center} </style>   <?php header("Content-type:text/html;charset=gb2312"); include("mysql.class.php"); $conn=new mysql("localhost","root","root","test"," ","gbk"); if(!emptyempty($_GET["weight"])){     if($_GET["move"]=="up"){         //获取上一条新闻信息         $query=$conn->query("select * from `article` where `weight` > '$_GET[weight]' order by `weight` asc limit 1");         if($conn->db_num_rows(query)>0){             $rows=$conn->fetch_array($query);             $conn->query("update `article` set `weight`='$rows[weight]' where `weight`='$_GET[weight]'");             $conn->query("update `article` set `weight`='$_GET[weight]' where `ID`='$rows[ID]'");         }else{             echo "<script>alert('已经在最顶上');</script>";         }     }else if($_GET["move"]=="down"){         //获取下一条新闻信息         $query=$conn->query("select * from `article` where `weight` < '$_GET[weight]' order by `weight` desc limit 1");         if($conn->db_num_rows(query)>0){             $rows=$conn->fetch_array($query);             $conn->query("update `article` set `weight`='$rows[weight]' where `weight`='$_GET[weight]'");             $conn->query("update `article` set `weight`='$_GET[weight]' where `ID`='$rows[ID]'");         }else{             echo "<script>alert('已经在最底下');</script>";         }     } } ?> <table border="1" cellpadding="0" cellspacing="0" width="300" align="center">         <caption>文章上下移动</caption>         <tr>             <td>ID</td><td>标题</td><td>移动</td>         </tr> <?php $query=$conn->query("select * from `article` order by `weight` desc"); if($conn->db_num_rows($query)>0){ while($rows=$conn->fetch_array($query)){     $aid[].=$rows["ID"]; ?>         <tr>             <td><?php echo $rows["ID"]?></td>             <td><?php echo $rows["title"]?></td>             <td><a href="<?php $PHP_SELF?>?weight=<?php echo $rows[weight]?>&move=up">上移</a>/<a href="<?php $PHP_SELF?>?weight=<?php echo $rows[weight]?>&move=down">下移</a></td>         </tr>   <?php     } } ?>     </table> </body> </html>    php,文章,排序 Php 北极星 未知 2011-10-23 19:47 http://www.okajax.com/a/201109/design_web.html 无论运营何种类型的网站，相信每位站长做站的终级目标都是让网站顺利实现赢利。那么如何让网站（特别是行业网站）走向赢利或其方法应该也是站长所关注的焦点 分享房产装修行业网站实现赢利的几种方法 无论运营何种类型的网站，相信每位站长做站的终级目标都是让网站顺利实现赢利。那么如何让网站（特别是行业网站）走向赢利或其方法应该也是站长所关注的焦点。房产装修网站是针对某个区域或者城市专门为这个区域的业主提供房产家居行业资讯、装修知识、室内设计、装修公司等信息的行业门户网站。所以应该算的上是行业网站的一个分支。以下笔者就个人所运营的一个成都房产装修网站www.zx028.com来说说个人的经验和想法： 一. 内容广告 内容广告是指客户（一般是指装修公司和建材、家具商家和房产商）在我们网站上通过软文的方式来展示广告内容或者信息，比如：文章置顶、文章加色等。这样的广告就需要业主对装修网站具有一定的信任度，并且用户粘度比较高，能完成内容的浏览。但一般新站不容易做到这个要求。 二. 增值服务 目前，也有部分装修网站是靠增值服务收费的。比如，一些城市装修网站平台，装修公司和家具建材厂商可以注册一个自己的公司主页。但是要想获得更多的权限，比如通过实名认证、绑定一级域名、发布案例图片等，这些都属于增值服务的范畴，需要在装修公司付费之后才能实现和获取的。 三. 装修招标 这也是装修网比较大的一个赢利点：就是业主需要对房屋进行装修时，在装修网站发布的装修招标信息。然后业主通过几家家装公司的报价来进行选择和对比，并最终确定其中的一家装修公司来进行合作。这样网站就可以与装修公司进行合作分成，但必须是保证能为业主提供更好的服务的前提。 四. 建材团购 众所周知：在房屋销售旺季，或者大型楼盘开盘的时候会有许多业主购买了房屋需要进行装修。并且在装修过程中或者装修之后都会购买大量的装修建材，家居用品等。那么这里面就存在一个巨大的商机，如果网站能把这些需要装修房屋的业主都集中起来然后与商家进行谈判价格。那么价格的降低必然会使业主得到实惠，建材商家虽然薄利但是销售的数量却大幅上升，商家也会乐此不彼。 五. 图片广告 网站图片广告也是一种常见的广告方式，广告的效果一般都要优于文字广告。但要想使客户在我们网站上投放这样的广告就要求装修网站必须要具有一定的知名度或者具有一定的用户访问量。否则这样的广告不会具有任何价值，客户也不会愿意为这种广告付出哪怕是一毛钱的代价。 以上五点就是个人搜集和总结的关于建材装修类行业网站实现赢利的几点看法，欢迎查看成都居家住宅装修：http://www.zx028.com/jujia/，希望大家能提出宝贵意见和建议。同时我们也热诚欢迎各位装修行业同行站长朋友来交换友情连接和发布家居装修类软文。   装修,网站,赢利 策划盈利 jimmy028 成都装修网 2011-09-05 18:02 http://www.okajax.com/a/201107/curl_yahoo.html 封装curl类抓取yahoo boss 搜索结果 1.编写curl类   class CurlUtil    {        private $curl;        private $timeout = 10;            /**        * 初始化curl对象        */        public function __construct()        {            $this->curl = curl_init();            curl_setopt($this->curl, CURLOPT_RETURNTRANSFER, 1);            curl_setopt($this->curl, CURLOPT_USERAGENT, "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1)");            curl_setopt($this->curl, CURLOPT_HEADER, false); //设定是否显示头信息            curl_setopt($this->curl, CURLOPT_NOBODY, false); //设定是否输出页面内容            curl_setopt($this->curl, CURLOPT_CONNECTTIMEOUT, $this->timeout);            curl_setopt($this->curl, CURLOPT_FOLLOWLOCATION, true);            curl_setopt($this->curl, CURLOPT_AUTOREFERER, true);        }            /**        * 注销函数 关闭curl对象        */        public function __destruct()        {            curl_close($this->curl);        }            /**        * 获取网页的内容        */        public function getWebPageContent($url)        {            curl_setopt($this->curl, CURLOPT_URL, $url);            return curl_exec($this->curl);        }    }    2.采集页中创建curl对象 $CurlUtil = new CurlUtil();   3.抓取yahoo搜索结果的函数 function  getYahooSearch(CurlUtil $curl, $key)    {        $key = urlencode($key);        $searchUrl = "http://boss.yahooapis.com/ysearch/web/v1/$key?appid=你的雅虎appid&lang=tzh&region=hk&abstract=long&count=20&format=json&start=0&count=10";              $josnStr = $curl->getWebPageContent($searchUrl);        $searchDataInfo = json_decode($josnStr, true);        $searchData = $searchDataInfo['ysearchresponse']['resultset_web'];            $returnArray = array();        if (!emptyempty($searchData)) {            foreach ($searchData as $data) {                $returnArray[] = array("url" => $data['url'], "date" => $data['date'], 'title' => strip_tags($data['title']), 'description' => strip_tags($data['abstract']));            }        }        return $returnArray;    }    4.显示采集结果 var_dump(getYahooSearch($CurlUtil, "百度"));      curl,抓取,yahoo Php 北极星 未知 2011-07-04 21:58 http://www.okajax.com/a/201107/php_unknown_modifier.html PHP中正则中遇到的Unknown modifier问题，以及表达式的双引号和单引号的区别 项目中因为需要过滤字符，写了这样一行代码 if (preg_match("/[\x21-\x26\x28-\x2C\x2F-\x30\x3C-\x5F\x61-\x7E]/", chr($chr)))  只要执行，总会出现一个这样的提示“Warning: preg_match() [function.preg-match]: Unknown modifier ‘-’ in D:\WebRoot\idtest.php on line 31”并且执行结果不正确。纠结了很久才发现，只需要将表达式的双引号改成单引号就OK了。 if (preg_match('/[\x21-\x26\x28-\x2C\x2F-\x30\x3C-\x5F\x61-\x7E]/', chr($chr)))  原因是PHP会对用双引号包起来的字符进行解析例如： $str = '早上好';  echo "$str";// 这样就会在页面输出$str的内容“早上好”。而不是输出“$str”  虽然知道原因了，但PHP是刚学的。至今不知道是那个字符被解析掉了。只能先记下这个经验：PHP中用正则表达式，一定要用单引号。 希望能给跟我一样正在纠结这个问题的同学一些帮助。 php,正则,unknown,modifier Php 北极星 未知 2011-07-04 01:14 http://www.okajax.com/a/201107/php_county.html PHP版国家代码、缩写查询函数   <?php  function transCountryCode($code) {      $index=array('AA'=>'阿鲁巴',      'AD'=>'安道尔',      'AE'=>'阿联酋',      'AF'=>'阿富汗',      'AG'=>'安提瓜和巴布达',      'AL'=>'阿尔巴尼亚',      'AM'=>'亚美尼亚',      'AN'=>'荷属安德列斯',      'AO'=>'安哥拉',      'AQ'=>'南极洲',      'AR'=>'阿根廷',      'AS'=>'东萨摩亚',      'AT'=>'奥地利',      'AU'=>'澳大利亚',      'AZ'=>'阿塞拜疆',      'Av'=>'安圭拉岛',      'BA'=>'波黑',      'BB'=>'巴巴多斯',      'BD'=>'孟加拉',      'BE'=>'比利时',      'BF'=>'巴哈马',      'BF'=>'布基纳法索',      'BG'=>'保加利亚',      'BH'=>'巴林',      'BI'=>'布隆迪',      'BJ'=>'贝宁',      'BM'=>'百慕大',      'BN'=>'文莱布鲁萨兰',      'BO'=>'玻利维亚',      'BR'=>'巴西',      'BS'=>'巴哈马',      'BT'=>'不丹',      'BV'=>'布韦岛',      'BW'=>'博茨瓦纳',      'BY'=>'白俄罗斯',      'BZ'=>'伯里兹',      'CA'=>'加拿大',      'CB'=>'柬埔寨',      'CC'=>'可可斯群岛',      'CD'=>'刚果',      'CF'=>'中非',      'CG'=>'刚果',      'CH'=>'瑞士',      'CI'=>'象牙海岸',      'CK'=>'库克群岛',      'CL'=>'智利',      'CM'=>'喀麦隆',      'CN'=>'中国',      'CO'=>'哥伦比亚',      'CR'=>'哥斯达黎加',      'CS'=>'捷克斯洛伐克',      'CU'=>'古巴',      'CV'=>'佛得角',      'CX'=>'圣诞岛',      'CY'=>'塞普路斯',      'CZ'=>'捷克',      'DE'=>'德国',      'DJ'=>'吉布提',      'DK'=>'丹麦',      'DM'=>'多米尼加共和国',      'DO'=>'多米尼加联邦',      'DZ'=>'阿尔及利亚',      'EC'=>'厄瓜多尔',      'EE'=>'爱沙尼亚',      'EG'=>'埃及',      'EH'=>'西撒哈拉',      'ER'=>'厄立特里亚',      'ES'=>'西班牙',      'ET'=>'埃塞俄比亚',      'FI'=>'芬兰',      'FJ'=>'斐济',      'FK'=>'福兰克群岛',      'FM'=>'米克罗尼西亚',      'FO'=>'法罗群岛',      'FR'=>'法国',      'FX'=>'法国-主教区',      'GA'=>'加蓬',      'GB'=>'英国',      'GD'=>'格林纳达',      'GE'=>'格鲁吉亚',      'GF'=>'法属圭亚那',      'GH'=>'加纳',      'GI'=>'直布罗陀',      'GL'=>'格陵兰岛',      'GM'=>'冈比亚',      'GN'=>'几内亚',      'GP'=>'法属德洛普群岛',      'GQ'=>'赤道几内亚',      'GR'=>'希腊',      'GS'=>'S. Georgia and S. Sandwich Isls.',      'GT'=>'危地马拉',      'GU'=>'关岛',      'GW'=>'几内亚比绍',      'GY'=>'圭亚那',      'HK'=>'中国香港特区',      'HM'=>'赫德和麦克唐纳群岛',      'HN'=>'洪都拉斯',      'HR'=>'克罗地亚',      'HT'=>'海地',      'HU'=>'匈牙利',      'ID'=>'印度尼西亚',      'IE'=>'爱尔兰',      'IL'=>'以色列',      'IN'=>'印度',      'IO'=>'英属印度洋领地',      'IQ'=>'伊拉克',      'IR'=>'伊朗',      'IS'=>'冰岛',      'IT'=>'意大利',      'JM'=>'牙买加',      'JO'=>'约旦',      'JP'=>'日本',      'KE'=>'肯尼亚',      'KG'=>'吉尔吉斯斯坦',      'KH'=>'柬埔寨',      'KI'=>'基里巴斯',      'KM'=>'科摩罗',      'KN'=>'圣基茨和尼维斯',      'KP'=>'韩国',      'KR'=>'朝鲜',      'KW'=>'科威特',      'KY'=>'开曼群岛',      'KZ'=>'哈萨克斯坦',      'LA'=>'老挝',      'LB'=>'黎巴嫩',      'LC'=>'圣卢西亚',      'LI'=>'列支顿士登',      'LK'=>'斯里兰卡',      'LR'=>'利比里亚',      'LS'=>'莱索托',      'LT'=>'立陶宛',      'LU'=>'卢森堡',      'LV'=>'拉托维亚',      'LY'=>'利比亚',      'MA'=>'摩洛哥',      'MC'=>'摩纳哥',      'MD'=>'摩尔多瓦',      'MG'=>'马达加斯加',      'MH'=>'马绍尔群岛',      'MK'=>'马其顿',      'ML'=>'马里',      'MM'=>'缅甸',      'MN'=>'蒙古',      'MO'=>'中国澳门特区',      'MP'=>'北马里亚纳群岛',      'MQ'=>'法属马提尼克群岛',      'MR'=>'毛里塔尼亚',      'MS'=>'蒙塞拉特岛',      'MT'=>'马耳他',      'MU'=>'毛里求斯',      'MV'=>'马尔代夫',      'MW'=>'马拉维',      'MX'=>'墨西哥',      'MY'=>'马来西亚',      'MZ'=>'莫桑比克',      'NA'=>'纳米比亚',      'NC'=>'新卡里多尼亚',      'NE'=>'尼日尔',      'NF'=>'诺福克岛',      'NG'=>'尼日利亚',      'NI'=>'尼加拉瓜',      'NL'=>'荷兰',      'NO'=>'挪威',      'NP'=>'尼泊尔',      'NR'=>'瑙鲁',      'NT'=>'中立区(沙特-伊拉克间)',      'NU'=>'纽爱',      'NZ'=>'新西兰',      'OM'=>'阿曼',      'PA'=>'巴拿马',      'PE'=>'秘鲁',      'PF'=>'法属玻里尼西亚',      'PG'=>'巴布亚新几内亚',      'PH'=>'菲律宾',      'PK'=>'巴基斯坦',      'PL'=>'波兰',      'PM'=>'圣皮艾尔和密克隆群岛',      'PN'=>'皮特克恩岛',      'PR'=>'波多黎各',      'PT'=>'葡萄牙',      'PW'=>'帕劳',      'PY'=>'巴拉圭',      'QA'=>'卡塔尔',      'RE'=>'法属尼留旺岛',      'RO'=>'罗马尼亚',      'RU'=>'俄罗斯',      'RW'=>'卢旺达',      'SA'=>'沙特阿拉伯',      'SC'=>'塞舌尔',      'SD'=>'苏丹',      'SE'=>'瑞典',      'SG'=>'新加坡',      'SH'=>'圣赫勒拿',      'SI'=>'斯罗文尼亚',      'SJ'=>'斯瓦尔巴特和扬马延岛',      'SK'=>'斯洛伐克',      'SL'=>'塞拉利昂',      'SM'=>'圣马力诺',      'SN'=>'塞内加尔',      'SO'=>'索马里',      'SR'=>'苏里南',      'ST'=>'圣多美和普林西比',      'SU'=>'前苏联',      'SV'=>'萨尔瓦多',      'SY'=>'叙利亚',      'SZ'=>'斯威士兰',      'Sb'=>'所罗门群岛',      'TC'=>'特克斯和凯科斯群岛',      'TD'=>'乍得',      'TF'=>'法国南部领地',      'TG'=>'多哥',      'TH'=>'泰国',      'TJ'=>'塔吉克斯坦',      'TK'=>'托克劳群岛',      'TM'=>'土库曼斯坦',      'TN'=>'突尼斯',      'TO'=>'汤加',      'TP'=>'东帝汶',      'TR'=>'土尔其',      'TT'=>'特立尼达和多巴哥',      'TV'=>'图瓦卢',      'TW'=>'中国台湾省',      'TZ'=>'坦桑尼亚',      'UA'=>'乌克兰',      'UG'=>'乌干达',      'UK'=>'英国',      'UM'=>'美国海外领地',      'US'=>'美国',      'UY'=>'乌拉圭',      'UZ'=>'乌兹别克斯坦',      'VA'=>'梵蒂岗',      'VC'=>'圣文森特和格陵纳丁斯',      'VE'=>'委内瑞拉',      'VG'=>'英属维京群岛',      'VI'=>'美属维京群岛',      'VN'=>'越南',      'VU'=>'瓦努阿鲁',      'WF'=>'瓦里斯和福图纳群岛',      'WS'=>'西萨摩亚',      'YE'=>'也门',      'YT'=>'马约特岛',      'YU'=>'南斯拉夫',      'ZA'=>'南非',      'ZM'=>'赞比亚',      'ZR'=>'扎伊尔',      'ZW'=>'津巴布韦');      $code=strtoupper($code);      $name=$index[$code];      if (emptyempty($name)) {          return null;      }      return $name;  }  ?>    php,国家,代码 Php 北极星 未知 2011-07-03 00:31 http://www.okajax.com/a/201107/jquery_innerHTML.html jQuery框架 jQuery 是一个JavaScript 库，它有助于简化 JavaScript? 以及 Asynchronous JavaScript + XML (Ajax) 编程。与类似的 JavaScript 库不同，jQuery 具有独特的基本原理，可以简洁地表示常见的复杂代码。学习 jQuery 基本原理，探索其特性和功能，执行一些常见 jQuery框架 jQuery 是一个JavaScript 库，它有助于简化 JavaScript? 以及 Asynchronous JavaScript + XML (Ajax) 编程。与类似的 JavaScript 库不同，jQuery 具有独特的基本原理，可以简洁地表示常见的复杂代码。学习 jQuery 基本原理，探索其特性和功能，执行一些常见的 Ajax 任务并掌握如何使用插件扩展 jQuery。 清单 1 所示。 var external_links = document.getElementById('external_links');  var links = external_links.getElementsByTagName('a');  for (var i=0;i < links.length;i++) {      var link = links.item(i);      link.onclick = function() {           return confirm('You are going to visit: ' + this.href);      };  }  清单 2 显示了使用 jQuery 实现的相同的功能。 $(#external_links a).click(function() {      return confirm(You are going to visit: + this.href);  });  清单 2. 使用了 jQuery 的 DOM 脚本 是不是很神奇？ 使用 jQuery，您可以把握问题的要点，只让代码实现您想要的功能，而省去了一些繁琐的过程。无需对元素进行循环，click() 函数将完成这些操作。同样也不需要进行多个 DOM 脚本调用。您只需要使用一个简短的字符串对所需的元素进行定义即可。 理解这一代码的工作原理可能会有一点复杂。首先，我们使用了 $() 函数 —— jQuery 中功能最强大的函数。通常，我们都是使用这个函数从文档中选择元素。在本例中，一个包含有一些层叠样式表（Cascading Style Sheet，CSS）语法的字符串被传递给函数，然后 jQuery 尽可能高效地把这些元素找出来。 如果您具备 CSS 选择器的基本知识，那么应该很熟悉这些语法。在 清单 2 中，#external_links 用于检索 id 为 external_links 的元素。a 后的空格表示 jQuery 需要检索 external_links 元素中的所有 <a> 元素。用英语说起来非常绕口，甚至在 DOM 脚本中也是这样，但是在 CSS 中这再简单不过了 一、 jQuery如何进行实例化 上一小节对jQuery进行了解释，在解释中，运用了一个实例来说明其在代码上的精简性，在这之中谈到了$() ，这是整个jQuery库中最为核心的一部分，所有的函数都必须先经过它，才可对库中的方法进行调度。$() 函数这就是jQuery的实例化操作函数，只有jquery对象才可运用库中的其他函数，否则将拒绝访问，提示错误。 返回值：$(expr, context)) 函数返回一个含有所有与 CSS 选择器匹配的元素的 jQuery 对象 jQuery 对象 类似于数组，但是它附带有大量特殊的 jQuery 函数。比方说，您可以通过调用 click 函数把 click 处理函数指定给 jQuery 对象中的所有元素。 还可以向 $() 函数传递一个元素或者一个元素数组，该函数将把这些元素封装在一个 jQuery 对象中。 下面介绍一些比较常用的实例化事例 示例 1 - 使用 jQuery的 ID选择器来进行实例化。 var elements = $("#myId");  以上代码，将获取到ID为myId的jquery对象 .相当于DOM中document.getElementById('myId'),不同点为，后者返回的是一个DOM对象 示例2 - 使用 jQuery 的标签选择器进行实例化 var elements = $("p");  以上代码，将获取整个DOM文档中所有标签为p的jquery对象，相当于DOM中的document.getElementsByTagName('p')，不同点为，后者返回多个标签为 p的DOM对象. 示例3 - 使用 jQuery 的css样式选择器进行实例化 var elements = $(".container");  以上返回的均为jQuery 对象 ，结构上类似于数组。因为它返回的是jquery对象，所以可以进行方法的链接使用。 介绍一简单的调用例子 说明 ：获取html文档中ID为message的元素（返回的是jquery对象），设置它的background为yellow,它的innerHtml内容为hello,并显示出来 示例 原Html ：<div id=”message”></div> 结果： <div id=”message” style=”background:yellow;display:block;”>Hello!</div> 备注 ：如果 display:none的话，将变为display:block或display:inline; 二、 jQuery如何在页面中进行引用 在需要使用JQuery的页面中引入JQuery的js文件即可。 例如：<script type="text/javascript" src="js/jquery.js"></script> 具体的路径，可以根据实际情况，来对”src”进行改动。引入之后便可在页面的任意地方使用jQuery提供的语法。 三、 jQuery 的使用 具体的使用查看相关的示例 四、 jQuery 使用的注意事项 1、关于页面元素的引用 通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法，且返回的对象为jquery对象（集合对象），不能直接调用dom定义的方法。 2、jQuery对象与dom对象的转换 只有jquery对象才能使用jquery定义的方法。注意dom对象和jquery对象是有区别的，调用方法时要注意操作的是dom对象还是jquery对象。 普通的dom对象一般可以通过$()转换成jquery对象。 如：$(document.getElementById("msg"))则为jquery对象，可以使用jquery的方法。 由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项，一般可通过索引取出。 如：$("#msg")[0]，$("div").eq(1)[0]，$("div").get()[1]，$("td")[5]这些都是dom对象，可以使用dom中的方法，但不能再使用Jquery的方法。 以下几种写法都是正确的： $("#msg").html();   $("#msg")[0].innerHTML;   $("#msg").eq(0)[0].innerHTML;   $("#msg").get(0).innerHTML;   3、如何获取jQuery集合的某一项 对于获取的元素集合，获取其中的某一项（通过索引指定）可以使用eq或get(n)方法或者索引号获取，要注意，eq返回的是jquery对象，而get(n)和索引返回的是dom元素对象。对于jquery对象只能使用jquery的方法，而dom对象只能使用dom的方法，如要获取第三个<div>元素的内容。有如下两种方法： $("div").eq(2).html(); //调用jquery对象的方法   $("div").get(2).innerHTML; //调用dom的方法属性   4、同一函数实现set和get Jquery中的很多方法都是如此，主要包括如下几个： $("#msg").html(); //返回id为msg的元素节点的html内容。   $("#msg").html("<b>new content</b>");   //将“<b>new content</b>” 作为html串写入id为msg的元素节点内容中,页面显示粗体的new content   $("#msg").text(); //返回id为msg的元素节点的文本内容。   $("#msg").text("<b>new content</b>");   //将“<b>new content</b>” 作为普文本串写入id为msg的元素节点内容中,页面显示<b>new content</b>   $("#msg").height(); //返回id为msg的元素的高度   $("#msg").height("300"); //将id为msg的元素的高度设为300   $("#msg").width(); //返回id为msg的元素的宽度   $("#msg").width("300"); //将id为msg的元素的宽度设为300   $("input").val(); //返回表单输入框的value值   $("input").val("test"); //将表单输入框的value值设为test   $("#msg").click(); //触发id为msg的元素的单击事件   $("#msg").click(fn); //为id为msg的元素单击事件添加函数   同样blur,focus,select,submit事件都可以有着两种调用方法 5、集合处理功能 对于jquery返回的集合内容无需我们自己循环遍历并对每个对象分别做处理，jquery已经为我们提供的很方便的方法进行集合的处理。 包括两种形式： $("p").each(function(i){this.style.color=['#f00',' #0f0','#00f'][i]})   //为索引分别为0，1，2的p元素分别设定不同的字体颜色。 $("tr").each(function(i){this.style.backgroundColo r=['#ccc','#fff'][i%2]}) //实现表格的隔行换色效果   $("p").click(function(){alert($(this).html())})   //为每个p元素增加了click事件，单击某个p元素则弹出其内容   6、支持方法的连写 所谓连写，即可以对一个jquery对象连续调用各种不同的方法。 例如： $("p").click(function(){alert($(this).html())})   .mouseover(function(){alert('mouse over event')})   .each(function(i){this.style.color=['#f00','#0f0', '#00f'][i]});   7、操作元素的样式 主要包括以下几种方式： $("#msg").css("background"); //返回元素的背景颜色   $("#msg").css("background","#ccc") //设定元素背景为灰色   $("#msg").height(300); $("#msg").width("200"); //设定宽高   $("#msg").css({ color: "red", background: "blue" });//以名值对的形式设定样式   $("#msg").addClass("select"); //为元素增加名称为select的class   $("#msg").removeClass("select"); //删除元素名称为select的class   $("#msg").toggleClass("select"); //如果存在（不存在）就删除（添加）名称为select的class   8、完善的事件处理功能 Jquery已经为我们提供了各种事件处理方法，我们无需在html元素上直接写事件，而可以直接为通过jquery获取的对象添加事件。 如： $("#msg").click(function(){alert("good")}) //为元素添加了单击事件   $("p").click(function(i){this.style.color=['#f00', '#0f0','#00f'][i]})   9、几个实用特效功能 其中toggle()和slidetoggle()方法提供了状态切换功能。 如toggle()方法包括了hide()和show()方法。 slideToggle()方法包括了slideDown()和slideUp方法。 10、几个有用的jQuery方法 $.browser.浏览器类型：检测浏览器类型。有效参数：safari, opera, msie, mozilla。如检测是否ie：$.browser.isie，是ie浏览器则返回true。 $.each(obj, fn)：通用的迭代函数。可用于近似地迭代对象和数组（代替循环）。 如 $.each( [0,1,2], function(i, n){ alert( "Item #" + i + ": " + n ); });   等价于： var tempArr=[0,1,2];   for(var i=0;i<tempArr.length;i++){   alert("Item #"+i+": "+tempArr[i]);   }   也可以处理json数据，如 $.each( { name: "John", lang: "JS" }, function(i, n){ alert( "Name: " + i + ", Value: " + n ); });   结果为： Name:name, Value:John Name:lang, Value:JS $.map(array, fn)：数组映射。把一个数组中的项目(处理转换后)保存到到另一个新数组中，并返回生成的新数组。 如： var tempArr=$.map( [0,1,2], function(i){ return i + 4; }); tempArr内容为：[4,5,6] var tempArr=$.map( [0,1,2], function(i){ return i > 0 ? i + 1 : null; }); tempArr内容为：[2,3] $.merge(arr1,arr2):合并两个数组并删除其中重复的项目。 如：$.merge( [0,1,2], [2,3,4] ) //返回[0,1,2,3,4] $.trim(str)：删除字符串两端的空白字符。 如：$.trim(" hello, how are you? "); //返回"hello,how are you? " 11、解决自定义方法或其他类库与jQuery的冲突 很多时候我们自己定义了$(id)方法来获取一个元素，或者其他的一些js类库如prototype也都定义了$方法，如果同时把这些内容放在一起就会引起变量方法定义冲突，Jquery对此专门提供了方法用于解决此问题。 使用jquery中的jQuery.noConflict();方法即可把变量$的控制权让渡给第一个实现它的那个库或之前自定义的$方法。之后应用Jquery的时候只要将所有的$换成jQuery即可，如原来引用对象方法$("#msg")改为jQuery("#msg")。如： jQuery.noConflict(); // 开始使用jQuery   jQuery("div p").hide();   // 使用其他库的 $()   $("content").style.display = 'none';     jquery,美元,实例化,选择器 jquery.js 北极星 未知 2011-07-01 21:48 http://www.okajax.com/a/201106/jquery_cookie.html jquery没有直接操作cookie的函数，所以我们可以写一个cookie的操作函数，也可以下载一个jquery cookie插件，或者直接把jquery cookie函数拿来用 jquery没有直接操作cookie的函数，所以我们可以写一个cookie的操作函数，也可以下载一个jquery cookie插件，或者直接把jquery cookie函数拿来用。 1、正常思路的普通写法。   //1.创建Cookie    我们要进行的第一件事就是要创建一个Cookie。下面给出的SctCookie()函数将完成这一功能。     function SetCookie (name, value)  {       var argv=SetCookie.arguments;       var argc=SetCookie.arguments.length;       var expires=(argc>2)?argv[2]: null;       var path=(argc>3)? argv[3]: null;       var domain=(argc>4)? argv[4]: null;       var secure=(argc>5)? argv[5]: false;       document.cookie=name+"="+escape(value)+((expires==null)?"":";expires="+expires.toGMTString()))+ ((path==null)?"":(";path="+path))+  ((domain==null)?"":(";domain="+ domain))+ ((secure==true)?";secure":"");     }     //SetCookie()只要求传递被设置的Cookie的名字和值,但如果必要的话你可以设置其他4 个参数而不必改变这个函数。可选的参数必须用正确的次序使用。如果不想设置某个参数, 必须设置一个空串。比如,如果我们创建的一个Cookie需要指定secure域,但不想设置expir es, patb或domain,就可以像这样调用SetCookie():  SetCookie("MyNewCookie","MyValue" ,"",","tyue);     ////////////////////////  //2.读取Cookie     //下面给出的函数GetCookie()用来读取一个Cookie。当一个Cookie的请求被客户机收到时,该客户机查找它的cookies.txt文件以进行匹配。这个函数首先匹配这个Cookie的名字。如果有多个同名的Cookie,它再匹配路径。函数完成匹配后返回这个Cookie的值。如果客户机中没有这个Cookie,或者路径不匹配,该函数返回一个NULL。     function GetCookie(name)  {       var arg=name+ "=";       var alen=arg.length;       var clen=document.cookie.length;       var i=0;       while (i<clen) {         var j=i+alen;         if(document.cookie.substring(i,j) ==arg)         return getCookieVal(j);         i=document.cookie.indexOf("",i)+1;         if(i==0)break;      }       return null;    }   2、直接把jquery的cookie操作函数拿来用。 jQuery.cookie = function(name, value, options) {         if (typeof value != 'undefined') { // name and value given, set cookie               options = options || {};             if (value === null) {                 value = '';                 options.expires = -1;             }             var expires = '';             if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {                 var date;                 if (typeof options.expires == 'number') {                     date = new Date();                     date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));                 } else {                     date = options.expires;                 }                 expires = '; expires=' + date.toUTCString();             }             var path = options.path ? '; path=' + (options.path) : '';             var domain = options.domain ? '; domain=' + (options.domain) : '';             var secure = options.secure ? '; secure': '';             document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');         } else {             var cookieValue = null;             if (document.cookie && document.cookie != '') {                 var cookies = document.cookie.split(';');                 for (var i = 0; i < cookies.length; i++) {                     var cookie = jQuery.trim(cookies[i]);                     if (cookie.substring(0, name.length + 1) == (name + '=')) {                         cookieValue = decodeURIComponent(cookie.substring(name.length + 1));                         break;                     }                 }             }             return cookieValue;         }     };     //使用方法如下:  //设置cookie的键值对  //$.cookie(’name’, ‘value’);  //设置cookie的键值对，有效期，路径，域，安全  //$.cookie(’name’, ‘value’, {expires: 7, path: ‘/’, domain: ‘jquery.com’, secure: true});  //新建一个cookie 包括有效期 路径 域名等  //读取cookie的值  //var account= $.cookie(’name’);  //删除一个cookie  //example $.cookie(’name’, null);     js,cookie,jquery Javascript&js 北极星 未知 2011-06-29 20:55 http://www.okajax.com/a/201106/gzip_php.html GZIP（GNU-ZIP）是一种压缩技术。经过GZIP压缩后页面大小可以变为原来的30%甚至更小。这样用户浏览的时候就会感觉很爽很愉快 GZIP（GNU-ZIP）是一种压缩技术。经过GZIP压缩后页面大小可以变为原来的30%甚至更小。这样用户浏览的时候就会感觉很爽很愉快！ 要实现GZIP压缩页面需要浏览器和服务器共同支持，实际上就是服务器压缩，传到浏览器后浏览器解压并解析。浏览器那边不需要我们担心，因为现在绝大多数浏览器都支持解析GZIP过的页面。我们只要把页面在服务器端压缩再输出到浏览器就行了。 正如要制作压缩饼干，先要拿到原料，要压缩一个页面，首先要获得要输出的内容。PHP中的ob_start()（ob => output buffer）函数可以实现这个功能，它可以把程序里准备输出的内容先放到一个叫做“缓冲区”的地方，当然，你可以理解为制作压缩饼干的暂时放原料的工作台。 这个函数一定要在页面输出之前使用，所以一般把它放在代码的最顶端。因为它就像是一个工作台，所以你要在原料到来之前就要准备好它，否则原料来了没地方放，会出问题的。 下面是完整的示例代码： <?php  //启用一个带有ob_gzip压缩机的工作台  ob_start('ob_gzip');  //准备一些待压缩的内容  for($i=0; $i<100; $i )  {  echo('这里是压缩饼干的原料，这里是压缩饼干的原料，原料');  }  //输出压缩成果  ob_end_flush();  //这是ob_gzip压缩机  function ob_gzip($content)  {   if( !headers_sent() &&  extension_loaded("zlib") &&  strstr($_SERVER["HTTP_ACCEPT_ENCODING"],"gzip"))  {  $content = gzencode($content." \n//此页已压缩",9);   header("Content-Encoding: gzip");  header("Vary: Accept-Encoding");  header("Content-Length: ".strlen($content));  }  return $content;  }  ?>  经过测试，上面代码中如果不用GZIP，是4.69KB=4802.56B，启用GZIP后缩小为104B ，呃……我数学可能不好，自己算下压缩到了原来的百分之多少吧。 最后想看一下有没有效果，到这里测试一下吧：http://tool.chinaz.com/Gzips/Default.aspx 至于如何让html、js、css等静态页面也进行gzip压缩，那就需要设置服务器了，看这里吧：http://www.okajax.com/a/201106/iis_server.html gzip,php,压缩 Php 北极星 未知 2011-06-25 21:22 http://www.okajax.com/a/201106/iis_server.html HTTP压缩是在Web服务器和浏览器间传输压缩文本内容的方法。HTTP压缩采用通用的压缩算法如Gzip等压缩HTML、JavaScript或 CSS文件。压缩的最大好处就是降低了网络传输的数据量，从而提高客户端浏览器的访问速度 一、利用缓存，即内容过期 对于静态文件启用内容过期可以提高访问性能。首先网站的目录要划分合理，图片、CSS、JavaScript均放在单独目录下，然后在IIS中选择目录，点属性-HTTP头，启用内容过期，可以选择30天后过去，这样，用户浏览器将比较当前日期和截止日期，以便决定是显示缓存页还是从服务器请求更新的页，由于图片、CSS、JS通常变化较少，因此基本上都从本地缓存读取，从而加快显示速度。 IIS中选择目录，点属性-HTTP头，启用内容过期  关于这点有两个要求： 1）、减少HTTP请求数量，修改网站代码，减少外部图片、CSS、JS等文件数量，手动合并多个CSS/JavaScript文件。 2）、使用外部的JavaScript和CSS，将所有的JavaScript和CSS都做成外部文件的形式进行引用，这主要是为了让这些文件可以被浏览器缓存起来。 二、启用Gzip压缩，增加访问速度  HTTP压缩是在Web服务器和浏览器间传输压缩文本内容的方法。HTTP压缩采用通用的压缩算法如Gzip等压缩HTML、JavaScript或 CSS文件。压缩的最大好处就是降低了网络传输的数据量，从而提高客户端浏览器的访问速度。 使用方法是，右击“网站”-》“属性”，选择“服务”。在“HTTP压缩”框中选中“压缩静态文件”，“临时目录”建议单独设置另一个盘的目录下，并给“IUSER_计算机名”这个用户的写入权限。 HTTP压缩”框中选中“压缩静态文件 之后，IIS管理器中，右击“Web服务扩展”-》“增加一个新的Web服务扩展”，在“扩展名”中输入“HTTPCompression”，添加“要求的文件”为C：\WINDOWS\system32\inetsrv\gzip.dll，其中Windows系统目录根据您的安装可能有所不同，选中“设置扩展状态为允许”。 Web服务扩展 最后修改metabase.xml文件，使用文本编辑器打开C：\Windows\System32\inetsrv\MetaBase.xml，在查找HcFileExtensions（共两处），并增加需要压缩的静态文件后缀名，默认为HTML和TXT文件，建议再添加上js、css等，不需要添加图片或ZIP等已经默认被压缩的文件。 但是通常metabase.xml文件是无法修改的，因为iis正在使用该文件，所以就需要停止iis。操作方法：从“开始”菜单，单击“运行”。 在“打开”框中，键入 cmd，然后单击“确定”。 在命令提示符处，键入 iisreset /stop，然后按 Enter。使命令窗口保持打开状态。 用纯文本编辑器如记事本打开 MetaBase.xml 文件，编辑完成后可以直接保存，或者用已经编辑好的文件覆盖。最后开启iis即可，在命令提示符处，键入 iisreset /start，然后按 Enter。 http://www.okajax.com/uploads/allimg/110625/1_051K05B0.jpg iis,服务器,性能 IIS/Apache 北极星 未知 2011-06-25 20:40 http://www.okajax.com/a/201106/php_iconv_mb_convert_encoding.html 执行效率mb_convert_encoding 比iconv差太多，所以，一般情况下用iconv，只有当遇到无法确定原编码是何种编码，或者iconv转化后无法正常显示时才用mb_convert_encoding 函数 1、支持情况 iconv Convert string to requested character encoding(PHP 4 >= 4.0.5, PHP 5) mb_convert_encoding Convert character encoding(PHP 4 >= 4.0.6, PHP 5) 2、用法： string mb_convert_encoding ( string str, string to_encoding [, mixed from_encoding] )  说明：需要先启用 mbstring 扩展库，在 php.ini里将; extension=php_mbstring.dll 前面的 ; 去掉 string iconv ( string in_charset, string out_charset, string str )  说明：第二个参数，除了可以指定要转化到的编码以外，还可以增加两个后缀：//TRANSLIT 和 //IGNORE，其中：//TRANSLIT 会自动将不能直接转化的字符变成一个或多个近似的字符，//IGNORE 会忽略掉不能转化的字符，而默认效果是从第一个非法字符截断。Returns the converted string or FALSE on failure. 例如： $Al = iconv("UTF-8","GB2312"."//IGNORE",$Al);//忽略掉不能转化的字符$Al = iconv("UTF-8","GB2312"."//TRANSLIT",$Al);//动将不能直接转化的字符变成一个或多个近似的字符  $Al = iconv("UTF-8","GB2312",$Al);//默认效果是从第一个非法字符截断   3、使用差异： （1）. 发现iconv在转换字符"-"到gb2312时会出错，如果没有ignore参数，所有该字符后面的字符串都无法被保存。不管怎么样，这个"-"都无法转换成功，无法输出。另外mb_convert_encoding没有这个bug. （2）. mb_convert_encoding 可以指定多种输入编码，它会根据内容自动识别，如：$str =mb_convert_encoding($str,"euc-jp","ASCII,JIS,EUC-JP,SJIS,UTF- 8");“ASCII,JIS,EUC-JP,SJIS,UTF-8”的顺序不同效果也有 （3）.,执行效率mb_convert_encoding 比iconv差太多。 （4）. 因执行效率的关系，一般情况下用iconv，只有当遇到无法确定原编码是何种编码，或者iconv转化后无法正常显示时才用mb_convert_encoding 函数。如： $str = mb_convert_encoding($str, "UCS-2LE", "JIS, eucjp-win, sjis-win");  $str = mb_convert_encoding($str, "EUC-JP', "auto");  4、使用示例 $AL = iconv("GBK", "UTF-8", $AL);  $AL = mb_convert_encoding($AL, "UTF-8", "GBK");    iconv,mb_convert_encoding Php 北极星 Ajax中国 2011-06-25 18:02 http://www.okajax.com/a/201106/php_unset.html PHP的unset()函数用来清除、销毁变量，不用的变量，我们可以用unset()将它销毁。但是某些时候，用unset()却无法达到销毁变量占用的内存 PHP的unset()函数用来清除、销毁变量，不用的变量，我们可以用unset()将它销毁。但是某些时候，用unset()却无法达到销毁变量占用的内存！我们先看一个例子： <?php  $s=str_repeat('1',255);  //产生由255个1组成的字符串  $m=memory_get_usage();  //获取当前占用内存  unset($s);  $mm=memory_get_usage();  //unset()后再查看当前占用内存  echo $m-$mm;  ?>   最后输出unset()之前占用内存减去unset()之后占用内存，如果是正数，那么说明unset($s)已经将$s从内存中销毁(或者说，unset()之后内存占用减少了)，可是我在PHP5和windows平台下，得到的结果是：-48。这是否可以说明，unset($s)并没有起到销毁变量$s所占用内存的作用呢？我们再作下面的例子： <?php  $s=str_repeat('1',256);  //产生由256个1组成的字符串  $m=memory_get_usage();  //获取当前占用内存  unset($s);  $mm=memory_get_usage();  //unset()后再查看当前占用内存  echo $m-$mm;  ?>   这个例子，和上面的例子几乎相同，唯一的不同是，$s由256个1组成，即比第一个例子多了一个1，得到结果是：224。这是否可以说明，unset($s)已经将$s所占用的内存销毁了？ 通过上面两个例子，我们可以得出以下结论：结论一、unset()函数只能在变量值占用内存空间超过256字节时才会释放内存空间。 那么是不是只要变量值超过256，使用unset就可以释放内存空间呢？我们再通过一个例子来测试一下： <?php  $s=str_repeat('1',256);  //这和第二个例子完全相同  $p=&$s;  $m=memory_get_usage();  unset($s);  //销毁$s  $mm=memory_get_usage();  echo $p.'<br />';  echo $m-$mm;  ?>   刷新页面，我们看到第一行有256个1，第二行是-48，按理说我们已经销毁了$s，而$p只是引用$s的变量，应该是没有内容了，另外，unset($s)后内存占用却比unset()前增加了！现在我们再做以下的例子： <?php  $s=str_repeat('1',256);  //这和第二个例子完全相同  $p=&$s;  $m=memory_get_usage();  $s=null;  //设置$s为null  $mm=memory_get_usage();  echo $p.'<br />';  echo $m-$mm;  ?>   现在刷新页面，我们看到，输出$p已经是没有内容了，unset()前后内存占用量之差是224，即已经清除了变量占用的内存。本例中的$s=null也可以换成unset()，如下： <?php  $s=str_repeat('1',256);  //这和第二个例子完全相同  $p=&$s;  $m=memory_get_usage();  unset($s);  //销毁$s  unset($p);  $mm=memory_get_usage();  echo $p.'<br />';  echo $m-$mm;  ?>   我们将$s和$p都使用unset()销毁，这时再看内存占用量之差也是224，说明这样也可以释放内存。那么，我们可以得到另外一条结论：结论二、只有当指向该变量的所有变量（如引用变量）都被销毁后，才会释放内存。 相信经过本文的例子后，大家应该对unset()有所了解了，最起码，本人用unset()也是为了在变量不起作用时，释放内存。 php,unset,变量 Php 北极星 未知 2011-06-25 17:14 http://www.okajax.com/a/201106/php_header_meta.html 如果你是web程序员，给你的每个页面都加个header("content-type:text/html; charset=xxx")，保证它在任何服务器都能正确显示，可移植性强。 至于那句AddDefaultCharset xxx，要不要注释就仁者见仁了。反正我是注释掉了，不过我写页子也要写header()，便于放到服务器上能 php的header来定义一个php页面为utf编码或GBK编码 1、php页面为utf编码 header("Content-type: text/html; charset=utf-8");  2、php页面为gbk编码 header("Content-type: text/html; charset=gb2312");  通常情况以上代码放在php页面的首页 用header或meta实现PHP页面编码的区别 一、页面编码 1. 使用 <META http-equiv="content-type" content="text/html; charset=xxx"> 标签设置页面编码 这个标签的作用是声明客户端的浏览器用什么字符集编码显示该页面，xxx可以为GB2312，GBK，UTF-8（和MySQL不同，MySQL是 UTF8）等等。因此，大部分页面可以采用这种方式来告诉浏览器显示这个页面的时候采用什么编码，这样才不会造成编码错误而产生乱码。但是有的时候我们会 发现有了这句还是不行，不管xxx是哪一种，浏览器采用的始终都是一种编码，这个情况我后面会谈到。 注意，<meta>是属于html信息的，仅仅是一个声明，它起作用表明服务器已经把HTML信息传到了浏览器。 2. header("content-type:text/html; charset=xxx"); 这个函数header()的作用是把括号里面的信息发到http标头。 如果括号里面的内容为文中所说那样，那作用和<META>标签基本相同，大家对照第一个看发现字符都差不多的。但是不同的是如果有这段 函数，浏览器就会永远采用你所要求的xxx编码，绝对不会不听话，因此这个函数是很有用的。为什么会这样呢？那就得说说HTTPS标头和HTML信息的差别了： https标头是服务器以HTTP协议传送HTML信息到浏览器前所送出的字串。 因为meta标签是属于html信息的，所以header()发送的内容先到达浏览器，通俗点就是header()的优先级高于meta（不知道可 不可以这样讲）。加入一个php页面既有header("content-type:text/html; charset=xxx")，又有<META http-equiv="content-type" content="text/html; charset=xxx">，浏览器就只认前者http标头而不认meta了。当然这个函数只能在php页面内使用。 同样也留有一个问题，为什么前者就绝对起作用，而后者有时候就不行呢？这就是接下来要谈的Apache的原因了。 3. AddDefaultCharset Apache 根目录的 conf 文件夹里，有整个Apache的配置文档httpd.conf。 用文本编辑器打开httpd.conf，第708行（不同版本可能不同）有AddDefaultCharset xxx，xxx为编码名称。这行代码的意思：设置整个服务器内的网页文件https标头里的字符集为你默认的xxx字符集。有这行，就相当于给每个文件都 加了一行header("content-type:text/html; charset=xxx")。这下就明白为什么明明meta设置了是utf-8，可浏览器始终采用gb2312的原因。 如果网页里有 header("content-type:text/html; charset=xxx")，就把默认的字符集改为你设置的字符集，所以这个函数永远有用。如果把AddDefaultCharset xxx前面加个“#”，注释掉这句，而且页面里不含header("content-type…")，那这个时候就轮到meta标签起作用了。 总结：来个排序 header("content-type:text/html; charset=xxx")   AddDefaultCharset xxx   <META http-equiv="content-type" content="text/html; charset=xxx">   如果你是web程序员，给你的每个页面都加个header("content-type:text/html; charset=xxx")，保证它在任何服务器都能正确显示，可移植性强。 至于那句AddDefaultCharset xxx，要不要注释就仁者见仁了。反正我是注释掉了，不过我写页子也要写header()，便于放到服务器上能正常显示。 二、数据库编码 PHP 程序在查询数据库之前，首先执行 mysql_query(“SET NAMES xxxx”);其中 xxxx 是你网页的编码(charset=xxxx)，如果网页中 charset=utf8，则 xxxx=utf8，如果网页中 charset=gb2312，则xxxx=gb2312，几乎所有WEB程序，都有一段连接数据库的公共代码，放在一个文件里，在这文件里，加入 mysql_query(“set names”)就可以了。 SET NAMES 显示客户端发送的 SQL 语句中使用什么字符集。因此，SET NAMES 'utf-8'语句告诉服务器“将来从这个客户端传来的信息采用字符集utf-8”。它还为服务器发送回客户端的结果指定了字符集。（例如，如果你使用一 个SELECT语句，它表示列值使用了什么字符集。） php,编码,header,meta Php 北极星 未知 2011-06-25 17:09 http://www.okajax.com/a/201106/curl_setopt.html 以下关于此函数各项使用参数:bool curl_setopt (int ch, string option, mixed value)curl_setopt()函数将为一个CURL会话设置选项。option参数是你想要的设置，value是这个选项给定的值。 以下关于此函数各项使用参数:bool curl_setopt (int ch, string option, mixed value) curl_setopt()函数将为一个CURL会话设置选项。option参数是你想要的设置，value是这个选项给定的值。 下列选项的值将被作为长整形使用(在option参数中指定)： CURLOPT_INFILESIZE : 当你上传一个文件到远程站点，这个选项告诉PHP你上传文件的大小。 CURLOPT_VERBOSE : 如果你想CURL报告每一件意外的事情，设置这个选项为一个非零值。 CURLOPT_HEADER : 如果你想把一个头包含在输出中，设置这个选项为一个非零值。 CURLOPT_NOPROGRESS : 如果你不会PHP为CURL传输显示一个进程条，设置这个选项为一个非零值。注意：PHP自动设置这个选项为非零值，你应该仅仅为了调试的目的来改变这个选项。 CURLOPT_NOBODY : 如果你不想在输出中包含body部分，设置这个选项为一个非零值。 CURLOPT_FAILONERROR : 如果你想让PHP在发生错误(HTTP代码返回大于等于300)时，不显示，设置这个选项为一人非零值。默认行为是返回一个正常页，忽略代码。 CURLOPT_UPLOAD : 如果你想让PHP为上传做准备，设置这个选项为一个非零值。 CURLOPT_POST : 如果你想PHP去做一个正规的HTTP POST，设置这个选项为一个非零值。这个POST是普通的 application/x-www-from-urlencoded 类型，多数被HTML表单使用。 CURLOPT_FTPLISTONLY : 设置这个选项为非零值，PHP将列出FTP的目录名列表。 CURLOPT_FTPAPPEND : 设置这个选项为一个非零值，PHP将应用远程文件代替覆盖它。 CURLOPT_NETRC : 设置这个选项为一个非零值，PHP将在你的 ~./netrc 文件中查找你要建立连接的远程站点的用户名及密码。 CURLOPT_FOLLOWLOCATION : 设置这个选项为一个非零值(象 “Location: “)的头，服务器会把它当做HTTP头的一部分发送(注意这是递归的，PHP将发送形如 “Location: “的头)。 CURLOPT_PUT : 设置这个选项为一个非零值去用HTTP上传一个文件。要上传这个文件必须设置CURLOPT_INFILE和CURLOPT_INFILESIZE选项. CURLOPT_MUTE : 设置这个选项为一个非零值，PHP对于CURL函数将完全沉默。 CURLOPT_TIMEOUT : 设置一个长整形数，作为最大延续多少秒。 CURLOPT_LOW_SPEED_LIMIT : 设置一个长整形数，控制传送多少字节。 CURLOPT_LOW_SPEED_TIME : 设置一个长整形数，控制多少秒传送CURLOPT_LOW_SPEED_LIMIT规定的字节数。 CURLOPT_RESUME_FROM : 传递一个包含字节偏移地址的长整形参数，(你想转移到的开始表单)。 CURLOPT_SSLVERSION : 传递一个包含SSL版本的长参数。默认PHP将被它自己努力的确定，在更多的安全中你必须手工设置。 CURLOPT_TIMECONDITION : 传递一个长参数，指定怎么处理CURLOPT_TIMEVALUE参数。你可以设置这个参数为TIMECOND_IFMODSINCE 或 TIMECOND_ISUNMODSINCE。这仅用于HTTP。 CURLOPT_TIMEVALUE : 传递一个从1970-1-1开始到现在的秒数。这个时间将被CURLOPT_TIMEVALUE选项作为指定值使用，或被默认TIMECOND_IFMODSINCE使用。 下列选项的值将被作为字符串： CURLOPT_URL : 这是你想用PHP取回的URL地址。你也可以在用curl_init()函数初始化时设置这个选项。 CURLOPT_USERPWD : 传递一个形如[username]:[password]风格的字符串,作用PHP去连接。 CURLOPT_PROXYUSERPWD : 传递一个形如[username]:[password] 格式的字符串去连接HTTP代理。 CURLOPT_RANGE : 传递一个你想指定的范围。它应该是”X-Y”格式，X或Y是被除外的。HTTP传送同样支持几个间隔，用逗句来分隔(X-Y,N-M)。 CURLOPT_POSTFIELDS : 传递一个作为HTTP “POST”操作的所有数据的字符串。 CURLOPT_REFERER : 在HTTP请求中包含一个”referer”头的字符串。 CURLOPT_USERAGENT : 在HTTP请求中包含一个”user-agent”头的字符串。 CURLOPT_FTPPORT : 传递一个包含被ftp “POST”指令使用的IP地址。这个POST指令告诉远程服务器去连接我们指定的IP地址。这个字符串可以是一个IP地址，一个主机名，一个网络界面名(在UNIX下)，或是‘-’(使用系统默认IP地址)。 CURLOPT_COOKIE : 传递一个包含HTTP cookie的头连接。 CURLOPT_SSLCERT : 传递一个包含PEM格式证书的字符串。 CURLOPT_SSLCERTPASSWD : 传递一个包含使用CURLOPT_SSLCERT证书必需的密码。 CURLOPT_COOKIEFILE : 传递一个包含cookie数据的文件的名字的字符串。这个cookie文件可以是Netscape格式，或是堆存在文件中的HTTP风格的头。 CURLOPT_CUSTOMREQUEST : 当进行HTTP请求时，传递一个字符被GET或HEAD使用。为进行DELETE或其它操作是有益的，更Pass a string to be used instead of GET or HEAD when doing an HTTP request. This is useful for doing or another, more obscure, HTTP request. 注意: 在确认你的服务器支持命令先不要去这样做。下列的选项要求一个文件描述(通过使用fopen()函数获得)： CURLOPT_FILE : 这个文件将是你放置传送的输出文件，默认是STDOUT. CURLOPT_INFILE : 这个文件是你传送过来的输入文件。 CURLOPT_WRITEHEADER : 这个文件写有你输出的头部分。 CURLOPT_STDERR : 这个文件写有错误而不是stderr。用来获取需要登录的页面的例子,当前做法是每次或许都登录一次,有需要的人再做改进了.   #p#curl_setopt()函数常见参数及说明#e# 摘几个从别的网站扣过来的例子: 例一：   $cookie_jar = tempnam('./tmp','cookie');  $ch = curl_init(); curl_setopt($ch,CURLOPT_URL, 'http://******');  curl_setopt($ch, CURLOPT_POST, 1);  $request = 'email_address=&password=&action=';  curl_setopt($ch, CURLOPT_POSTFIELDS, $request); //把返回来的cookie信息保存在$cookie_jar文件中  curl_setopt($ch, CURLOPT_COOKIEJAR, $cookie_jar); //设定返回的数据是否自动显示  curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); //设定是否显示头信息  curl_setopt($ch, CURLOPT_HEADER, false); //设定是否输出页面内容  curl_setopt($ch, CURLOPT_NOBODY, false);  curl_exec($ch);  curl_close($ch); //get data after login   例二： $ch2 = curl_init();  curl_setopt($ch2, CURLOPT_URL, 'http://*****');  curl_setopt($ch2, CURLOPT_HEADER, false);  curl_setopt($ch2, CURLOPT_RETURNTRANSFER, 1);  curl_setopt($ch2, CURLOPT_COOKIEFILE, $cookie_jar);  $orders = curl_exec($ch2);  echo '';     echo strip_tags($orders);  echo '';  curl_close($ch2); 实践证明很稳定:)   例三： set_time_limit(0);  function _rand() {  $length=26;  $chars = "0123456789abcdefghijklmnopqrstuvwxyz";  $max = strlen($chars) - 1;  mt_srand((double)microtime() * 1000000);  $string = '';  for($i = 0; $i < $length; $i++) {  $string .= $chars[mt_rand(0, $max)];  }  return $string;  }  $HTTP_SESSION=_rand();  echo $HTTP_SESSION;  $HTTP_Server="www.baidu.com";  $HTTP_URL="/";  $ch = curl_init();  curl_setopt ($ch,CURLOPT_URL,"http://".$HTTP_Server.$HTTP_URL);  curl_setopt($ch,CURLOPT_RETURNTRANSFER,true);  curl_setopt($ch,CURLOPT_USERAGENT,"Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322; .NET CLR 2.0.50727)");  //curl_setopt($ch,CURLOPT_COOKIE,$HTTP_SESSION);  $res = curl_exec($ch);  curl_close ($ch);  print_r($res);  刷论坛代码： 1、抓cookies程序： $URL="http://www.yoururl.com/bbs/login.asp?action=chk";  //填入论坛的登陆页面地址  $ch = curl_init();  curl_setopt($ch,CURLOPT_URL,$URL);  curl_setopt($ch,CURLOPT_REFERER,"http://www.hxfoods.com/bbs/login.asp");  //设置，访问页面的来源地址     curl_setopt($ch,CURLOPT_POST,1);  curl_setopt($ch,CURLOPT_POSTFIELDS,'username=→→敢死队→&password=168168');  //分析登陆页面，把用户名，密码分别对应起来  curl_setopt ($ch, CURLOPT_HEADER,true);  //使能显示http头，  curl_exec($ch);  if (curl_errno($ch))  {  print curl_error($ch);  }  else  {  curl_close($ch);  }  2、刷楼代码： set_time_limit(0);  //设置程序执行时间无限制  $i=10000;  //耍10000次  for($j=0;$j<$i;$j++)  {  $URL="http://www.yoururl.com/bbs/savepost.asp";  //这个地址是回复表单里面action的url地址  $ch = curl_init();  curl_setopt($ch,CURLOPT_URL,$URL);  curl_setopt($ch,CURLOPT_REFERER,"http://www.hxfoods.com/bbs/dispbbs.asp?boardid=14&replyid=672709&id=127437&page=1&skin=0&Star=53");  //设置来源地址，如果不设置，论坛服务器有可能有验证不允许回复  curl_setopt($ch,CURLOPT_COOKIESESSION,true);  //能保存cookie  curl_setopt($ch,CURLOPT_COOKIE,"DvForum=userid=24122&usercookies=0&userhidden=2&password=w0reu3g775VrY745&userclass=%96%7C&username=%A1%FA%A1%FA%B8%D2%CB%C0%B6%D3%A1%FA&StatUserID=2194783945 ");  //这儿就是设置cookie了  curl_setopt($ch,CURLOPT_POST,1);  curl_setopt($ch,CURLOPT_NOBODY,1);  //不显示内容，因为有很多论坛回复后要自动跳转。  curl_setopt($ch,CURLOPT_POSTFIELDS,'Body=gfdfgdfgasdfgdfgdfgdfg& followup=672709&RootID=127437&star=58&TotalUseTable=Dv_bbs3& amp;UserName=→→敢死队→&signflag=1&total=65535');  //把你分析的回复表单的参数分别赋值  curl_setopt ($ch, CURLOPT_HEADER,true);  curl_exec($ch);  if (curl_errno($ch))  {  print curl_error($ch);  }  else {  curl_close($ch);  }  }  #p#curl_setopt()函数经典实例#e# php,curl_setopt Php 北极星 未知 2011-06-25 16:51 http://www.okajax.com/a/201106/apache_rewrite.html 伪静态就是将动态网页生成静态文件，从而能减轻服务器压力，提高访问速度和搜索引擎收录。下面我们看一下Apache是如何实现伪静态的.Apache伪静态主要是靠mod_rewrite.so模块来完成的。如果你的Apache还没有安装，那么在安装配置Apache时加上--enable-rewrite选项就行了 伪静态就是将动态网页生成静态文件，从而能减轻服务器压力，提高访问速度和搜索引擎收录。下面我们看一下Apache是如何实现伪静态的.Apache伪静态主要是靠mod_rewrite.so模块来完成的。如果你的Apache还没有安装，那么在安装配置Apache时加上--enable-rewrite选项就行了，这样在你的Apache安装目录modules文件夹下就会生成mod_rewrite.so模块。倘若你已经安装完了Apache也没关系，我们可以利用Apache安装程序生成一个mod_rewrite.so模块。 1.检测Apache是否支持mod_rewrite   通过php提供的phpinfo()函数查看环境配置，通过Ctrl+F查找到“Loaded Modules”，其中列出了所有apache2handler已经开启的模块，如果里面包括“mod_rewrite”，则已经支持，不再需要继续设置。   如果没有开启“mod_rewrite”，则打开目录 您的apache安装目录“/apache/conf/” 下的 httpd.conf 文件，通过Ctrl+F查找到“LoadModule rewrite_module”，将前面的”#”号删除即可。   如果没有查找到，则到“LoadModule” 区域，在最后一行加入“LoadModule rewrite_module modules/mod_rewrite.so”（必选独占一行），然后重启apache服务器即可。 2.让apache服务器支持.htaccess 修改httpd.conf文件 Options FollowSymLinks AllowOverride None 改为 Options FollowSymLinks AllowOverride All 注意：除了要设置上面的地方以后，还得设置一下下面这个（网上很多资料都没有讲到这一块），否则你将会配制失败， 把 DocumentRoot 后面的参数改为你本地网站的目录 例如你网站的根目录为 D:/web/ 则得设置为 DocumentRoot "D:/web/" 也就是修改当前目录。此步骤设置好后也得重启apache服务器才能生效。 3.建立.htaccess 文件 建立.htaccess文件的3种方法：1）打开记事本，点击文件–另存为，在文件名窗口输入".htaccess"，注意是整个红色部分，也就是包含英文引号，然后点击保存就行了。2）在命令行下使用“echo a> .htaccess”建立，然后使用记事本编辑。如果这都嫌麻烦，那有更简单的，3）直接下载我为您准备的.htaccess文件,然后用记事本打开修改即可。 htaccess文件 4.填写网站伪静态规则（需要了解正则表达式） <IfModule mod_rewrite.c> RewriteEngine on  RewriteRule index.html$ index.php  RewriteRule index-([1-9]+[0-9]*).html$ index.php?p=$1  </IfModule>    apache,伪静态,rewrite IIS/Apache 北极星 未知 2011-06-24 20:43 http://www.okajax.com/a/201106/php_reg.html 对一个正则表达式模式或部分模式两边添加圆括号将导致相关匹配存储到一个临时缓冲区中，所捕获的每个子匹配都按照在正则表达式模式中从左至右所遇到的内容存储。存储子匹配的缓冲区编号从 1 开始，连续编号直至最大 99 个子表达式。每个缓冲区都可以使用 '\n' 访问，其 i 如果设定此修正符，模式中的字符将同时匹配大小写字母。 m 当设定了此修正符，“行起始”和“行结束”除了匹配整个字符串开头和结束外，还分别匹配其中的换行符的之后和之前。 s 如果设定了此修正符，模式中的圆点元字符（.）匹配所有的字符，包括换行符。没有此设定的话，则不包括换行符。 x 如果设定了此修正符，模式中的空白字符除了被转义的或在字符类中的以外完全被忽略，在未转义的字符类之外的 # 以及下一个换行符之间的所有字符，包括两头，也都被忽略。 e 如果设定了此修正符，preg_replace() 在替换字符串中对逆向引用作正常的替换， ? 在 . + 和 * 之后 表示非贪婪匹配: *、+和?限定符都是贪婪的，因为它们会尽可能多的匹配文字，只有在它们的后面加上一个?就可以实现非贪婪或最小匹配。 例如： <?php  $string = "上飞机离开我<img border='0' alt='' src='/uploadfile/2009/0921/20090921091612567.jpg' border='0' />sdfsdf";  $su = preg_match("/ \<[ ]*img.*src[ ]*\=[ ]*[\"|\'](.+?)[\"|\'] /", $string,$match); // 匹配src=的内容  print_r($match[1]); // 输出 /uploadfile/2009/0921/20090921091612567.jpg  $su = preg_match("/ \<[ ]*img.*src[ ]*\=[ ]*[\"|\'](.+)[\"|\'] /", $string,$match);  print_r($match[1]); // 输出 /uploadfile/2009/0921/20090921091612567.jpg' border='  ?>  例子：（?i）:     (?i)在PHP中的意思是内部修正符，i指不区分大小写，其它的修正符还有x,m,s,U等。和我们使用的模式修正符是一样的。区别在于它是在模式内部使用的。仅作用于(?i)所在的子模式内，如ccc(a(?i))bcd 匹配 cccabcd和cccAbcd，而a(?i)bc则和abc加上\i修正符是一样的因为(?i)作用于整个模式 后向引用 对一个正则表达式模式或部分模式两边添加圆括号将导致相关匹配存储到一个临时缓冲区中，所捕获的每个子匹配都按照在正则表达式模式中从左至右所遇到的内容存储。存储子匹配的缓冲区编号从 1 开始，连续编号直至最大 99 个子表达式。每个缓冲区都可以使用 '\n' 访问，其中 n 为一个标识特定缓冲区的一位或两位十进制数。 可以使用非捕获元字符 '?:', '?=', or '?!' 来忽略对相关匹配的保存。当设定了此修正符，“行起始”和“行结束”除了匹配整个字符串开头和结束外，还分别匹配其中的换行符的之后和之前。 php,正则 Php 北极星 未知 2011-06-24 11:04 http://www.okajax.com/a/201106/chinaz_alexa.html php采集chinaz的alexa网站排名 一般上,我们需要先得到采集页的html代码,如下: <?php  $url = "http://alexa.chinaz.com/?domain=phpchina.com";  $file = file_get_contents($url);  print_r($file);  ?>  但是因为chinaz采用了js防采集,结果是直接弹出js防采集提示。 解决办法是,模拟user-agent,代码如下: <?php  ini_set('user_agent', 'Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0)');  $url = "http://alexa.chinaz.com/?domain=phpchina.com";  $file = file_get_contents($url);  echo $file;  ?>    php,采集,chinaz,alexa Php 北极星 未知 2011-06-24 10:57 http://www.okajax.com/a/201106/jquery_12.html 由于jQuery对象本身是一个集合。所以如果jQuery对象要转换为dom对象则必须取出其中的某一项，一般可通过索引取出 由于jQuery对象本身是一个集合。所以如果jQuery对象要转换为dom对象则必须取出其中的某一项，一般可通过索引取出。 1、关于页面元素的引用 通过jQuery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法，且返回的对象为jQuery对象（集合对象），不能直接调用dom定义的方法。 2、jQuery对象与dom对象的转换 只有jQuery对象才能使用jQuery定义的方法。注意dom对象和jQuery对象是有区别的，调用方法时要注意操作的是dom对象还是jQuery对象。普通的dom对象一般可以通过$()转换成jQuery对象。 如：$(document.getElementById(”msg”))则为jQuery对象，可以使用jQuery的方法。 由于jQuery对象本身是一个集合。所以如果jQuery对象要转换为dom对象则必须取出其中的某一项，一般可通过索引取出。如：$(”#msg”)[0]，$(”div”).eq(1)[0]，$(”div”).get()[1]，$(”td”)[5]这些都是dom对象，可以使用dom中的方法，但不能再使用jQuery的方法。 以下几种写法都是正确的： $("#msg”).html();  $("#msg”)[0].innerHTML;  $("#msg”).eq(0)[0].innerHTML;  $("#msg”).get(0).innerHTML;  3、如何获取jQuery集合的某一项 对于获取的元素集合，获取其中的某一项（通过索引指定）可以使用eq或get(n)方法或者索引号获取，要注意，eq返回的是jQuery对象，而get(n)和索引返回的是dom元素对象。对于jQuery对象只能使用jQuery的方法，而dom对象只能使用dom的方法，如要获取第三个<div>元素的内容。有如下两种方法： $("div”).eq(2).html();    //调用jQuery对象的方法  $("div”).get(2).innerHTML; //调用dom的方法属性  4、同一函数实现set和get jQuery中的很多方法都是如此，主要包括如下几个： $("#msg").html();    //返回id为msg的元素节点的html内容。  $("#msg").html("<b>new content</b>");  //将“<b>new content</b>" 作为html串写入id为msg的元素节点内容中,页面显示粗体的new content  $("#msg").text();    //返回id为msg的元素节点的文本内容。  $("#msg").text("<b>new content</b>");  //将“<b>new content</b>" 作为普通文本串写入id为msg的元素节点内容中,页面显示<b>new content</b>  $("#msg").height();    //返回id为msg的元素的高度  $("#msg").height("300″); //将id为msg的元素的高度设为300  $("#msg").width();    //返回id为msg的元素的宽度  $("#msg").width("300″); //将id为msg的元素的宽度设为300  $("input").val("); //返回表单输入框的value值  $("input").val("test"); //将表单输入框的value值设为test  $("#msg").click(); //触发id为msg的元素的单击事件  $("#msg").click(fn); //为id为msg的元素单击事件添加函数  同样blur,focus,select,submit事件都可以有着两种调用方法 5、集合处理功能 对于jQuery返回的集合内容无需我们自己循环遍历并对每个对象分别做处理，jQuery已经为我们提供的很方便的方法进行集合的处理。包括两种形式： $("p”).each(function(i){this.style.color=['#f00','#0f0','#00f'][ i ]})  //为索引分别为0，1，2的p元素分别设定不同的字体颜色。  $("tr”).each(function(i){this.style.backgroundColor=['#ccc','#fff'][i%2]})  //实现表格的隔行换色效果  $("p”).click(function(){alert($(this).html())})  //为每个p元素增加了click事件，单击某个p元素则弹出其内容  6、扩展我们需要的功能 $.extend({  min: function(a, b){return a < b?a:b; },  max: function(a, b){return a > b?a:b; }  }); //为jQuery扩展了min,max两个方法  使用扩展的方法（通过“$.方法名”调用）： alert(”a=10,b=20,max=”+$.max(10,20)+”,min=”+$.min(10,20));  7、支持方法的连写 所谓连写，即可以对一个jQuery对象连续调用各种不同的方法。例如： $("p”).click(function(){alert($(this).html())})  .mouseover(function(){alert(’mouse over event’)})  .each(function(i){this.style.color=['#f00','#0f0','#00f'][ i ]});  8、操作元素的样式 主要包括以下几种方式： $("#msg").css("background");    //返回元素的背景颜色  $("#msg").css("background","#ccc") //设定元素背景为灰色  $("#msg").height(300); $("#msg").width("200″); //设定宽高  $("#msg").css({ color: “red", background: “blue" });//以名值对的形式设定样式  $("#msg").addClass("select"); //为元素增加名称为select的class  $("#msg").removeClass("select"); //删除元素名称为select的class  $("#msg").toggleClass("select"); //如果存在（不存在）就删除（添加）名称为select的class  9、完善的事件处理功能 jQuery已经为我们提供了各种事件处理方法，我们无需在html元素上直接写事件，而可以直接为通过jQuery获取的对象添加事件。如： $(”#msg”).click(function(){alert(”good”)}) //为元素添加了单击事件  $(“p”).click(function(i){this.style.color=['#f00','#0f0','#00f'][ i ]})  //为三个不同的p元素单击事件分别设定不同的处理  jQuery中几个自定义的事件： （1）hover(fn1,fn2)：一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。 //当鼠标放在表格的某行上时将class置为over，离开时置为out。  $("tr”).hover(function(){  $(this).addClass(”over”);  ,function(){  $(this).addClass(”out”);  });  （2）ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。 $(document).ready(function(){alert(”Load Success”)})  //页面加载完毕提示“Load Success”,相当于onload事件。与$(fn)等价  （3）toggle(evenFn,oddFn): 每次点击时切换要调用的函数。如果点击了一个匹配的元素，则触发指定的第一个函数，当再次点击同一元素时，则触发指定的第二个函数。随后的每次点击都重复对这两个函数的轮番调用。 //每次点击时轮换添加和删除名为selected的class。  $("p”).toggle(function(){  $(this).addClass(”selected”);  },function(){  $(this).removeClass(”selected”);  });  （4）trigger(eventtype): 在每一个匹配的元素上触发某类事件。例如： $("p”).trigger(”click”);    //触发所有p元素的click事件    （5）bind(eventtype,fn)，unbind(eventtype): 事件的绑定与反绑定 从每一个匹配的元素中（添加）删除绑定的事件。例如： $("p").bind("click", function(){alert($(this).text());}); //为每个p元素添加单击事件  $("p").unbind(); //删除所有p元素上的所有事件  $("p").unbind("click") //删除所有p元素上的单击事件  10、几个实用特效功能 其中toggle()和slidetoggle()方法提供了状态切换功能。如toggle()方法包括了hide()和show()方法。slideToggle()方法包括了slideDown()和slideUp方法。 11、几个有用的jQuery方法 $.browser.浏览器类型：检测浏览器类型。有效参数：safari, opera, msie, mozilla。如检测是否ie：$.browser.isie，是ie浏览器则返回true。 $.each(obj, fn)：通用的迭代函数。可用于近似地迭代对象和数组（代替循环）。如 $.each( [0,1,2], function(i, n){ alert( "Item #" + i + ": " + n ); });   等同于： var tempArr=[0,1,2];  for(var i=0;i<tempArr.length;i++){  alert("Item #"+i+": "+tempArr[ i ]);  }  也可以处理json数据，如 $.each( { name: "John", lang: "JS" }, function(i, n){ alert( "Name: " + i + ", Value: " + n ); });  结果为： Name:name, Value:John  Name:lang, Value:JS  $.extend(target,prop1,propN)：用一个或多个其他对象来扩展一个对象，返回这个被扩展的对象。这是jQuery实现的继承方式。如：  $.extend(settings, options);  //合并settings和options，并将合并结果返回settings中，相当于options继承setting并将继承结果保存在setting中。  var settings = $.extend({}, defaults, options);  //合并defaults和options，并将合并结果返回到setting中而不覆盖default内容。  可以有多个参数（合并多项并返回）$.map(array, fn)：数组映射。把一个数组中的项目(处理转换后)保存到到另一个新数组中，并返回生成的新数组。如： var tempArr=$.map( [0,1,2], function(i){ return i + 4; });  tempArr内容为：[4,5,6]  var tempArr=$.map( [0,1,2], function(i){ return i > 0 ? i + 1 : null; });  tempArr内容为：[2,3]   $.merge(arr1,arr2):合并两个数组并删除其中重复的项目。 如： $.merge( [0,1,2], [2,3,4] ) //返回[0,1,2,3,4]  $.trim(str)：删除字符串两端的空白字符。如： $.trim("   hello, how are you? "); //返回"hello,how are you? "  12、解决自定义方法或其他类库与jQuery的冲突 很多时候我们自己定义了$(id)方法来获取一个元素，或者其他的一些js类库如prototype也都定义了$方法，如果同时把这些内容放在一起就会引起变量方法定义冲突，jQuery对此专门提供了方法用于解决此问题。 使用jQuery中的jQuery.noConflict();方法即可把变量$的控制权让渡给第一个实现它的那个库或之前自定义的$方法。之后应用jQuery的时候只要将所有的$换成jQuery即可，如原来引用对象方法$("#msg")改为jQuery("#msg")。如： jQuery.noConflict();  // 开始使用jQuery  jQuery("div p").hide();  // 使用其他库的 $()  $("content").style.display = 'none';    12,jquery,技巧 jquery.js 北极星 未知 2011-06-13 20:52 http://www.okajax.com/a/201106/ajax_10.html AJAX 不是一种新的编程语言，而是一种用于创建更好更快以及交互性更强的 Web 应用程序的技术。本文介绍了Ajax开发10条标准守则，希望对你有帮助 AJAX 是一种独立于 Web 服务器软件的浏览器技术。AJAX 基于下列 Web 标准：JavaScript XML HTML CSS 在 AJAX 中使用的 Web 标准已被良好定义，并被所有的主流浏览器支持。AJAX 应用程序独立于浏览器和平台。Web 应用程序较桌面应用程序有诸多优势；它们能够涉及广大的用户，它们更易安装及维护，也更易开发。 不过，因特网应用程序并不像传统的桌面应用程序那样完善且友好。 通过AJAX，因特网应用程序可以变得更完善，更友好。下面为大家介绍Ajax开发守则。 1.前、端后都要做好安全的把关工作 不能单靠前端做安全验证工作，后端也必须有过滤机制，检验前方传来的资料。由于Ajax也会接收后端传送来的资料，对这些资料都要采不信任态度，必须加以检查。 2.尽量以HTTP POST方法传输资料 使用GET方法容易让有心人士得到资料，虽然POST并非万无一失，但比起GET至少较为安全。 3.不要直接用eval函式唤起JSON物件 JSON是采用JavaScript物件实字的资料格式，从后端传到Ajax程式时，必须采用eval函式将它从字串转成物件，这时必须先行检查资料中是否有非法字元，以免非法程式借机启用。 4.限制使用者可用的HTML语法 许多Ajax网站允许使用者在留言中使用HTML语法，而某些特定语法应该严格限制，例如＜plaintext＞或是＜!- -这类语法，都会让置于之后的程式码失效。 5.禁止可留言的网页页面使用JavaScript语法 虽然乍看之下觉得不可思议，不过的确在一些部落格平台上发生过，这让XSS攻击开了大门。 6.使用Ajax框架，必须注意安全性问题 由于骇客利用JavaScript进行攻击手法日新月异，当网页开发人员利用Ajax框架时，必须注意框架本身是否对某些特定手法具有防治行为。 7.让使用者知道自己身处的状况 当Ajax载入资料量大时，有时会让使用者产生错觉，不确定刚刚按下的按扭是否发生作用。因此开发人员必须设计适当的提示，让使用者了解目前程式的执行状况。 8.保持小量传输 Ajax的灵活性在于动态改变局部资料量，因此小量传输资料才能达到最高效益。如果一大张资料表都要透过DOM的操作来改变，不如就由后端程式与资料库来操作，效益更高。 9.注意易用性与内容的平衡 Ajax虽然为使用者带来浏览时的易用性，不过如果将所有内容都透过Ajax来产生，会造成搜寻引擎无法索引资料的情况。因此与内容相关的部分，需谨慎使用Ajax。 10.执行优雅降级原则 网站如果并非全面性采用Ajax技术，而只是为了局部增加互动性，这时必须考量不支援JavaScript的使用者，设法在不使用这些功能的前提下，让他们还能正常地浏览网站。 ajax,守则,标注,10 Ajax技巧教程 北极星 未知 2011-06-13 20:48 http://www.okajax.com/a/201106/ajax_4.html 我们用到的很多框架中都已经固化了基于页面的传统应用模式，同时这些应用模式也已经深深进入了我们的思想中。我们花几分钟来揭示出哪些核心概念是我们需要重新思考的，以及如何从Ajax的角度来重新思考 我们用到的很多框架中都已经固化了基于页面的传统应用模式，同时这些应用模式也已经深深进入了我们的思想中。我们花几分钟来揭示出哪些核心概念是我们需要重新思考的，以及如何从Ajax的角度来重新思考。   一、浏览器中的是应用而不是内容 在传统的基于页面的Web应用中，浏览器扮演着哑终端1的角色。它对用户处于操作流程哪一阶段一无所知。这些信息全部都保存在服务器上，确切地说，就是在用户会话上。时至今日，服务器端的用户会话早已是司空见惯。如果你使用Java 或者.NET 编程，服务器端的用户会话更是标准API 的一部分——还有Request、Response、MIME 类型——没有了它们简直不可想象。 当用户登录或者以其他方式初始化一个会话时，系统会创建几个服务器端的对象。例如，电子商务类型的网站需要创建表示购物车以及用户身份证明的对象。同时将浏览器站点的首页呈现给用户，这个HTML 标记的数据流由模板文件以及特定于该用户的数据和内容（例如该用户最近浏览的商品列表）组成。 用户每次和服务器交互，都会获得另一个文档。在这个文档中，除了特定于该用户的数据以外，包含的其他模板文件和数据都是相同的。浏览器总是忠实地丢弃掉老的文档，显示新的文档，因为它是哑终端，而且也不知道还可以做些什么。 当用户选择退出或者关闭浏览器的时候，应用退出，会话消失。这个时候持久层会把用户下次登录后需要显示的信息存储起来。Ajax则不同，它把一部分应用逻辑从服务器端移到了浏览器端。 传统Web应用的生命周期。用户和应用会话的所有状态都保留在Web服务器上。用户在会话中看到的是一系列的页面，每次页面切换都不可避免地要到服务器上走一个来回。 Ajax应用的生命周期。用户登录后，服务器交付一个客户端应用给浏览器。这个应用可以独立处理很多的用户交互，对于自己无法独立处理的交互，应用会以后台方式发送请求给服务器，而不会打断用户的操作流程。 用户登录的时候，服务器交付给浏览器一个复杂得多的文档，其中包含大量的JavaScript代码。这个文档将会在整个会话的生命周期内与用户相伴。在这一过程中，随着用户与其交互，它的外观可能会发生相当大的变化。它知道如何响应用户的输入，能够决定对于这些请求，是自行处理还是传递给Web服务器（Web服务器再去访问数据库或者其他资源），或者通过两者结合的方式进行处理。因为这个文档在整个用户会话中都存在，所以它可以保存状态1。例如，购物车的内容可以保存在浏览器中而不是服务器的会话中。 二、服务器交付的是数据而不是内容 我们已经提到，在传统的Web应用中，服务器在每个步骤都需要把模板文件、内容和数据混合发送给浏览器。但实际上，当向购物车中添加一件物品的时候，服务器真正需要响应的仅仅是更新一下购物车中的价格。 基于Ajax的购物车可以向服务器发起一个异步请求来完成这件事，这样做显得更聪明。模板文件、导航列表和页面布局上的其他部分已经随着初始页面发送给了浏览器，服务器无需重发，以后每次只需要发送相关的数据就可以了。Ajax应用可以通过多种方式来做这件事情。例如，返回一段JavaScript代码、一段纯文本或者一小段XML文档。这些方式各自的优缺点，我们将留到第5 章再详细考察。但是，毫无疑问的是，无论返回数据采用何种格式，这些方式所传输的数据量都要比传统的Web应用中一股脑返回一个大杂烩的方式少得多。 在Ajax应用中，网络的通信流量主要是集中在加载的前期，无论如何，用户登录后是需要一次性地将一个大而复杂的客户端交付给浏览器。但是在此之后，与服务器的通信则会有效率得多。对于瞬态应用来说，积累起来的通信流量要比以前的基于页面的Web应用少很多。与此同时，平均的交互次数则有所增加。整体而言，Ajax应用的带宽消耗要比传统的Web应用低一些。 三、用户交互变得流畅而连续 浏览器提供了两种输入机制：超链接和HTML 表单。超链接可以在服务器上创建，并预加载指向动态服务器页面或者servlet 的CGI 参数。可以用图片或者CSS（层叠样式表）来装饰超链接，并且当鼠标停在上面时还可以提供基本的反馈。经过合理设计，超链接可以变成一个很有想像力的UI 组件。表单则提供了桌面应用的一组基础UI 组件：输入文本框、单选按钮和多选按钮，还有下拉列表。但仍然缺少很多有用的UI 组件，例如，没有可用的树控件、可编辑的栅格、组合输入框等。表单像超链接一样，也指向服务器的一个URL 地址。 超链接和表单也可以指向JavaScript函数。这一技术通常用在将数据提交给服务器之前对表单输入进行简单的校验，如检验是否有空值，数值是否越界等等。这些JavaScript函数的生存期和页面本身是一致的，当页面提交之后，这些函数也就不存在了。 当一个页面已提交而下一个页面还没有显示出来的时候，用户实际上处于没人管的状态。老的页面还要显示一会儿，浏览器甚至还会允许用户点击一些链接。但这些点击可能会导致一些不可预料的结果，甚至破坏服务器端会话的状态。用户通常应该等到页面刷新完成，当然也可以选择在刷新完成之前就在新页面上做一些操作。例如，当页面只显示了一部分时从中选择一条裤子放进购物车不大可能会造成什么破坏（例如，不会修改顶级的服装分类：男装、女装、童装、配饰）。我们继续看这个购物车的例子。Ajax的购物车是通过异步方式发送数据的，用户可以很快地把东西拖进来，就像点击一样快。只要客户端购物车的代码足够健壮，它可以很轻松地处理这样的负载，而用户则可以继续做他想做的事。 要知道，在服务器端并没有一个真正的购物车等着装东西，只有会话中的一个对象而已。购物的时候，用户并不想知道会话对象，购物车对于用户而言是一个较恰当的比喻，用现实世界中熟悉的概念来描述这里发生的事情。对于用户来说，如果强迫他们去理解计算机领域中的术语，只会让他们远离网站。等待页面的刷新，一下子就把用户从愉快的使用体验中拽了出来，让他感觉到自己所面对的只不过是一台冰冷的机器罢了。使用Ajax来实现这些应用则可以避免这些令人不快的体验。当然了，在这个例子中的购物只是一个瞬态活动。考察一下其他的业务领域，例如，一个业务量很大的帮助中心或者一项复杂的工程任务，如果因为需要等待页面刷新，而将工作流程打断几秒钟，那肯定是不可接受的。 Ajax的另一个好处是，我们可以对丰富的用户操作事件进行捕获。类似于拖拽这样的复杂UI 概念也不再是遥不可及的。这使得Web应用的UI 体验可以全面提升到近乎与桌面应用的UI组件相媲美的高度。从可用性的角度来看，这很重要，不仅仅是因为它释放了我们的想象力，而且也是因为它可以将用户交互和服务器端的请求更加充分地混合起来。在传统的Web应用中，与服务器交互需要点击超链接或者提交表单，然后等待页面的刷新，这打断了用户的工作流程。与之相对应的是，让服务器响应鼠标移动、拖拽或者键盘输入这样的用户事件，也就是说，服务器在用户身边为用户服务，而不是挡在用户前面，打断他的操作。 google Suggest（www.google.com/webhp?complete=1）就是这样一个简单的但是很有说服力的例子。当用户在搜索框键入一些字符的时候，应用从服务器取回与用户已键入字符串相似的搜索条目（根据全世界其他人的搜索），并且显示在输入框下方的下拉列表中。 四、有纪律的严肃编程 现在传统的Web应用有时候也会用到JavaScript，不过主要是用来给页面添加一些花哨的东西。基于页面的模型使得这样的增强没有办法更进一步，限制了用户可以得到的更加理想的交互。这种类似于第22条军规的状况，使得JavaScript很不公平地获得了一种琐碎的、自由散漫的编程语言的名声，为那些严肃的开发者1所不屑。 为Ajax应用编程的情况则完全不同。提交给用户运行的应用将会一直运行直到用户关闭程序为止。不崩溃，不变慢，也没有内存泄漏之类的毛病。如果我们的产品定位于独占式应用的市场，这还意味着很多小时的密集使用。要达到这个目标，当然需要高性能的、可维护的代码，这与服务器端应用的要求是一致的。 相比之下，Ajax的代码库会比传统的Web应用大很多。对代码库进行良好的组织是非常重要的。编写代码不再是单个开发者的职责，而是整个团队来参与。可维护性、分离关注点、共同的编程风格以及设计模式，这些都是需要考虑的问题。 从某个角度来看，Ajax应用就是用户所使用的一块复杂的代码，它需要高效地与服务器进行通信。它显然来源于传统的基于页面的Web应用，但是它们之间的相似性也仅限于此，两者之间的差别就像是木马轮和现代自行车之间的差别。在脑海中要记得它们之间的这些差别，因为只有这样才能创造出真正引人注目的Web应用。 原文:http://www.yiiyaa.net/ ajax,开发,原则 Ajax技巧教程 神秘唯一 http://www.yiiyaa.net 2011-06-13 20:38 http://www.okajax.com/a/201106/win2003_restart.html windows2003服务器在长时间运行之后，系统资源就会占用率特别大，系统运行效率大大降低，此时访问服务器的普通用户也会受到影响，打开网页的反应时间会特别长。这时就需要清理某些服务，或者重启一下服务器了。人工手动去操作显然是繁杂而不现实的那么如何简单的实现服 windows2003服务器在长时间运行之后，系统资源就会占用率特别大，系统运行效率大大降低，此时访问服务器的普通用户也会受到影响，打开网页的反应时间会特别长。这时就需要清理某些服务，或者重启一下服务器了。人工手动去操作显然是繁杂而不现实的那么如何简单的实现服务器定时自动重启呢？ 其实在Windows Server 2003系统中，我们可以利用系统自带的shutdown命令和自带的任务计划，简单地实现远程定时重启服务器系统的目的。 具体方法步骤如下： 1、首先，打开记事本程序，输入如下命令代码： shutdown -r -f -t 30  命令解释：r参数指定服务器系统重新启动，f参数强行关闭服务器系统中的顽固进程和应用程序，t参数表示系统关机倒记时的时间。 然后选择"另存为"，注意文件类型选为"所有文件"，文件名输入为"Restart.bat"，即保存成“.bat”格式的批处理文件，并将之保存至合适的位置。 2、接着，依次单击“开始-程序-附件-系统工具-任务计划”命令（或者直接从控制面板中找到任务计划选项并打开），用鼠标双击其后界面中的“添加新任务”图标，打开新任务创建向导界面。 单击“下一步”按钮，从应用程序列表框中单击“浏览”按钮，打开文件选择对话框，将之前生成的“Restart.bat”文件选中并导入到向导窗口中。 然后为新建的计划任务取个合适的名称，并将“该任务的执行”设置为“每天”。单击“下一步”按钮后，进入设置界面，将新任务的运行起始时间指定为每天“4:00”。 再单击“完成”结束服务器定时重启任务的创建操作。 如此之后，服务器系统就会在设定时间自动重新启动。通过多个网站流量统计发现，每天2点到3点这个时间段网站访问人数最少，于是我把服务器定时重启时间设置为每天的3:00。 win,2003,服务器,定时,自动,重启 windows服务器 北极星 未知 2011-06-11 00:18 http://www.okajax.com/a/201106/qq_email_check.html 类似qq邮箱的收件人多选功能，简单实用。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>jquery实现左右加减</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script> <script language="javascript"> //第一步 $(document).ready(function(){//控制div显示隐藏    $("#input_name").focus(function(){   $("#listdiv").css("display","block");    $(".tree_right").find("li").each(function(){     var str02=$(this).text();    if(str02.substring(str02.length-1)==";"){//当onfocus时候坚持右侧显示的li里值是否有";"          $(this).text(str02.replace(";",""));//若有";"，则用空白替代掉       }       });       });  $("h5").click(function(){    $("#listdiv").css("display","none");    }) $("#cancel").click(function(){    $("#listdiv").css("display","none");     }) }); //第二步 $(document).ready(function(){//控制ul列表显示隐藏      $(".tree ul:first").show();//选择缺省状态下，tree下的第一个ul里所有元素都显示      $('.tree').find('b').click(function(){      var li_ul = $(this).next();//控制列表隐藏显示      var img_icon=$(this).find('img');//控制片加减图片轮换     if (li_ul.is(':visible')) {      img_icon.attr("src","http://bbs.okajax.com/static/image/common/collapsed_yes.gif");           li_ul.hide();     } else {      img_icon.attr("src","http://bbs.okajax.com/static/image/common/collapsed_no.gif");         li_ul.show();       }  }); }); //第三步 $(document).ready(function(){      $(".mepig li").click(function(){//往右侧增加li，及点击li自动删除       var abc=$(this);       if(abc.attr("class")=="a0"){   $("#num").text($(".tree_right li").length+1);//添加动态显示添加数目    abc.attr("class","a1").clone().appendTo(".tree_right").click(function(){    $(this).remove();    abc.attr("class","a0");    $("#num").text($(".tree_right li").length);//删除动态显示添加数目       });          }     }); }); //第四步 $(document).ready(function(){ $("#subbtn").click(function(){//确定提交按钮触发事件      $("#input_name").val($(".tree_right").find("li").each(function(){   var str01=$(this).text();//设置右侧每个li里的字符串为变量   if(str01.substring(str01.length-1)!=';'){$(this).html($(this).html()+";");}//检测判断右侧每个li里最后一个字符串   }).text());      $("#listdiv").css("display","none");    }); }) </script> <style> *{padding:0; margin:0; list-style:none; font-size:12px;} .tree li ul li{background:url(http://www.purplewater.cn/wp-content/uploads/2009/12/jli.jpg) no-repeat right; cursor:pointer;} .tree_right li{cursor:pointer;background:url(http://www.purplewater.cn/wp-content/uploads/2009/12/jcha.jpg) no-repeat right;} .boxlist{border:3px solid #D4E0F0; background-color:#fcfcfc; width:150px; padding:6px; height:220px;  overflow-x:hidden;overflow-y:auto; float:left; margin:10px;display:inline;} #listdiv{width:380px; height:320px; border:1px solid #7E9DB9; position:absolute; left:88px; background:#EBEFF3; display:none;} #listdiv h5{height:25px; background:#8DAED1 url(http://www.purplewater.cn/wp-content/uploads/2009/12/chacha.jpg) no-repeat right; padding:5px 0px 0px 10px; cursor:pointer;} .mepig{display:none;} .a0{padding-left:30px;} .a1{padding-left:30px;color:#ff0000;} </style> </head> <body> <form id="form1" name="form1" method="post" action=""> 发送用户：     <input name="text" type="text"  id="input_name" size="50" on/>       <div id="listdiv">  <h5>选择客户</h5>       <div class="boxlist">    <ul class="tree">   <li><b><img src="http://bbs.okajax.com/static/image/common/collapsed_no.gif">潜在1客</b>   <ul class="mepig">   <li class="a0">aaaa</li>   <li class="a0">bbbb</li>   <li class="a0">cccc</li>   </ul>   </li>   <li><b><img src="http://bbs.okajax.com/static/image/common/collapsed_yes.gif">潜在2客</b>   <ul class="mepig">   <li class="a0">dddd</li>   <li class="a0">eeee</li>   <li class="a0">ffff</li>   </ul>   </li>   <li><b><img src="http://bbs.okajax.com/static/image/common/collapsed_yes.gif">潜在客3</b>   <ul class="mepig">   <li class="a0">gggg</li>   <li class="a0">hhhh</li>   <li class="a0">uuuuu</li>   </ul>   </li>       </ul>  </div>  <div class="boxlist">      <ul class="tree_right">      <b>选中的客户<span id="num"></span></b>       </ul>  </div>  <div align="center"><input name="button" type="button" id="subbtn" value="保 存"/>       <input name="button2" type="button" value="取 消" id="cancel"/></div>    </div> </div>  </form> 请刷新页面，然后鼠标单击文本框查看效果，因远程调用的google的jquery代码“http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js”所以需要刷新后才能正常浏览，如果把代码库下载到本地测试则不出现类似问题。<br> Ajax中国http://www.okajax.com </body> </html> qq,邮箱,多选 功能代码 北极星 未知 2011-06-10 01:05 http://www.okajax.com/a/201106/select.html select多选 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script language="javascript">    function show(){   var sel = document.forms["form1"].s1;   var s = "";   for(var i=0;i<sel.options.length;i++){      if(sel.options[i].selected) s += sel.options[i].innerText + ",";   }   if(s!="") s = s.substr(0,s.length-1);   alert(s);      } </script> </head> <body> <form name="form1" id="form1"> <div width="300" height="160" border="1">  <select   name= "s1"   style= "WIDTH:   100px "   multiple   size=15  id="list"  >     <option>XHTML</option>             <option>CSS</option>             <option>JAVASCRIPT</option>             <option>XML</option>             <option>PHP</option>             <option>C#</option>             <option>JAVASCRIPT</option>             <option>XML</option>             <option>PHP</option>             <option>C#</option>             <option>JAVASCRIPT</option>             <option>XML</option>             <option>PHP</option>             <option>C#</option>             <option>JAVASCRIPT</option>             <option>XML</option>             <option>PHP</option>             <option>C#</option>             <option>JAVA</option>             <option>C++</option>             <option>PERL</option>     </select>     </div> <input name="button" type="button" onclick="show()" value="ShowOptionText"  /> </form> </body> </html> select,多选 功能代码 北极星 未知 2011-06-09 19:34 http://www.okajax.com/a/201106/ps_keyboard.html 最全的PS快捷键大全，photoshop快捷键大全。 快速恢复默认值 有些不擅长Photoshop的朋友为了调整出满意的效果真是几经周折，结果发现还是原来的默认效果最好，怎么恢复到默认值呢？试着轻轻点按选项栏上的工具图标，然后从上下文菜单中选取“复位工具”或者“复位所有工具”。 1、单独常用的快捷键。 ESC取消操作    双击Photoshop的背景空白处打开文件    F12 恢复为初始图像    选择工具的快捷键    选框-M   移动-V   套索-L   魔棒-W  喷枪-J   画笔-B   铅笔-N   橡皮图章-S    历史记录画笔-Y   橡皮擦-E   模糊-R   减淡-O  钢笔-P   文字-T   度量-U    渐变-G  油漆桶-K   吸管-I   抓手-H   缩放-Z    默认前景和背景色-D   切换前景和背景色-X   编辑模式切换-Q   显示模式切换-F    另外，如果我们按住Alt键后再单击显示的工具图标，或者按住Shift键并重复按字母快捷键则可以循环选择隐藏的工具。    获得精确光标    按Caps Lock键可以使画笔和磁性工具的光标显示为精确十字线，再按一次可恢复原状。    按Tab键可切换显示或隐藏所有的控制板(包括工具箱)，如果按Shift+Tab则工具箱不受影响，只显示或隐藏其他的控制板。 2、与shift一起使用的快捷键。（shift多数表示处于某种状态）  按Shift时可画出正圆和方形的选区、图形、直线。    按Shift时可画出垂直、水平和45度的直线    按Shitf时可用鼠标垂直、水平和45度的移动对象    按Shift时可快速的移动对象    按Shift+“选区工具”可增加选区，Alt+“选区工具”可减少选区    按Shift+Alt时可画出以某点为中心的正圆和正方形。    Shift+“Backspace”调出填充对话框    使用绘画工具如(如画笔组，橡皮等)，按住Shift键单击鼠标，可将两次单击点以直线连接。    若要将某一图层上的图像拷贝到尺寸不同的图像窗口中央位置时，可以在拖动鼠标的同时按住Shift键，图像拖动到目的窗口后会自动居中。 3、与ctrl一起使用的快捷键。（ctrl多数表示执行某个命令） 自由控制大小    Ctrl+ 0（零）满屏显示图像    Ctrl+“+”放大图像    Ctrl+“-”缩小图像    Ctrl+“N”或Ctrl+“双击”新建文件    Ctrl+“S”保存    Ctrl+ Shift+“S”另存为…    Ctrl+“O”打开文件    Ctrl+“W”关闭文件    Ctrl+“Q”退出程序    Ctrl+“C”复制    Ctrl+“X”剪切    Ctrl+“V”粘帖    Ctrl+Shift+“C”合并复制（复制多层内容）    Ctrl+Shift+“V”粘帖入选区内    Ctrl+“L”色阶设置    Ctrl+“M”色彩曲线设置    Ctrl+“B”色彩平衡设置    Ctrl+“I”色彩反相    Ctrl+“U”色相/饱和度设置    Ctrl+“J”把图层或图层中选重的部分复制一个新层    Ctrl+Shift+“N”新建图层    Ctrl+“E”向下合并图层    Ctrl+ Shift+“E”全并所有可见图层    Ctrl+“G”创建剪切蒙板层    Ctrl+“A”全选    Ctrl+“D”取消选择    Ctrl+ Shift+“I”反选    Ctrl+ Shift+“B”自动颜色    Ctrl+ Shift+“L”自动色阶    Ctrl+ Shift+Alt+“L”自动对比度    Ctrl+“Z”取消上一步的操作    Ctrl+ Alt+“Z”取消多步操作    Ctrl+ Shift+“Z”向前返回    Ctrl+Alt+“D”羽化….    Ctrl+“T”自由变换选区对象（选择菜单栏中的“变换选区”只对选区起作用，）在使用“编辑”→“自由变换”(Ctrl+T)命令时，按住Ctrl键并拖动某一控制点可以进行自由变形调整；按住Alt键并拖动某一控制点可以进行对称变形调整；按住Shift键并拖动某一控制点可以进行按比例缩放的调整；按住Shift+Ctrl键并拖动某一控制点可以进行透视效果的调整；按Alt+Ctrl键并拖动某一控制点可以进行斜切调整；按Enter键应用变换；按Esc键取消*作。    Ctrl+“P”打印    Ctrl+“[”往下移动图层    Ctrl+“]”往上移动图层    Ctrl+Shift+“[”置底层    Ctrl+Shift+“]”置顶层    Ctrl+“F”重复执行上一次滤镜操作    Ctrl+“Del” （Backspace）用背景色填充图层或选区，Alt+Del （Backspace）用前景色填充图层和选区。    Ctrl+“H”显示隐藏选区边框,辅助线、网格    Ctrl+“R”显示和隐藏标尺    Ctrl+“;”显示和隐藏参考线    Ctrl+“””显示和隐藏网格    Ctrl+“Y”校验颜色    不是在选取工具下，按Ctrl+鼠标也可自由的移动辅助线    Ctrl+ 单击（在图层、通道、路径面板中单击）可载入相应的选区。    Ctrl+ 选区 或“移动工具”移动选区对象    Ctrl+Alt+选区 或“Alt+移动工具”复制各选区对象    在使用“路径、选区”工具时按着Ctrl可移动对象    在执行直接选取工具或路径选取工具操作时按Ctrl可实现两者之间的切换。    在钢笔工具操作时按Ctrl，可切换到“直接选取工具”对路径中的各控制点进行调整、Alt可切换到“转换点工具”    在文字工具操作时按Ctrl, 可对文字进行缩放、旋转等调整 4、与alt一起作用的快捷键。（alt多数表示动作之间的操作切换）    Alt+橡皮工具。在图象上涂抹可以恢复擦除的部分。    Alt+“颜色选取工具”背景取色    执行钢笔工具操作时按Alt可变换成“转换点工具”，按Ctrl可变换成“直接选取工具”    Alt+菜单命令，可展开相应的菜单。    在编辑文字时，当光标在字母之间按Alt+“方向键”可调整字母之间的间距。    在执行套索工具操作时按Alt可实现“套索工具与多边形套索工具”、“磁性套索工具羽多边形套索工具”等之间的切换。    Alt+ 移动工具，可复制选区对象    Alt+ 上方向键可以复制多个对象。（形成立体效果图像）在选取工具下    Alt+ 双击Layers面板上的眼睛图标 隐藏或显示除此图层外的其它图层内容。    按Alt时在两个图层中间单击可把上层做为下一层的剪切层。    将对话框内的设定恢复为默认，先按住Alt键后，Cancel键会变成Reset键，再单击Reset键即可。    在Layers、Channels、Paths调色板上，按Alt单击这些调色板底部的工具图标时，对于有对话框   photoshop,ps,快捷键 图形图象 北极星 未知 2011-06-07 23:18 http://www.okajax.com/a/201105/jquery_scrollLoading.html 页面图片数量多，而且比较大时。要是页面载入就一次性加载完毕,需要用户等半天。所以针对这种情况,目前很流行的做法就是滚动动态加载，显示屏幕之外的图片默认是不加载的，随着页面的滚动，这个要显示图片的区域进入了浏览器可是窗口范围，则触发图片的加载显示。这种做 一、关于滚动显屏加载 常常会有这样子的页面，内容很丰富，页面很长，图片较多。比如说淘宝商城页面。页面图片数量多，而且比较大时。要是页面载入就一次性加载完毕,需要用户等半天。所以针对这种情况,目前很流行的做法就是滚动动态加载，显示屏幕之外的图片默认是不加载的，随着页面的滚动，这个要显示图片的区域进入了浏览器可是窗口范围，则触发图片的加载显示。这种做法的好处是，一是页面加载速度快（浏览器转啊转的圈圈或是进度条很快就玩完了），二是节约了流量，因为不可能每个用户浏览页面时从头滚到尾的。貌似我上面提到的几个站点就是采用的这种做法，例如，我以迅雷不及掩耳的速度从淘宝商城首页截下来的已触发滚动加载但是未加载完毕的图片： 这是提高前端性能，优化页面加载速度很实用的做法。看上去这种技巧有些技术门槛，其实很简单的。我们需要一个滚动事件，然后判断元素是否在浏览器窗口，然后，显示图片（或是其他元素）就可以啦。我在jQuery库下写了个实现此效果的插件，下面就将简单展示讲解此插件的使用以及滚动动态加载的实现。 二、jQuery滚动加载插件scrollLoading 虽然只有几十行代码，但是为了方便使用，我还是将其插件化了。插件名为jquery.scrollLoading.js，您可以狠狠地点击这里下载（右键 – [目标|链接]另存为），或是点击这里下载mini压缩版的。您可以狠狠地点击这里：jQuery滚动加载图片等demo，如果您的网速是在贫困线上挣扎，可以慢慢拖动滚动条，就可以很清楚的看到滚动加载的效果了；如果您的网速让你引以为豪，哥，你需要很快的拖动滚动条才能瞥见效果。效果类似下面：   demo页面中似乎有段破坏和谐的HTML片段，那是动态加载HTML后的效果，也就是说，此scrollLoading不仅可以用来滚动加载图片，Ajax load页面什么的也是可以的。 三、scrollLoading使用 不管怎样，首先调用jQuery库文件，还有jquery.scrollLoading.js，您可以直接在页面的某处添上如下的代码： <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script type="text/javascript" src="http://www.zhangxinxu.com/study/js/mini/jquery.scrollLoading-min.js"></script>  此插件的方法名就是scrollLoading，所以，直接：包装器.scrollLoading();就可以实现滚动加载效果了，简单的吧。如下： $(".scrollLoading").scrollLoading();  表示所有class为scrollLoading的元素绑定了滚动加载的方法。当然，不可能真的就如此简单，我们还需要做点小动作的。元素默认是不加载的，那么真正的加载地址显然要预先在元素上放置的，例如新浪微博默认把头像地址绑在了一个自定义的”dynamic-src”属性上，见下图： 在HTML5中，以data-开头的自定义属性都是合法的，且地址可以是图片，页面等。所以，我设定了绑定地址的自定义属性为”data-url”，此属性值设为真实的图片（或页面）地址就可以了。例如下面： <div class="scrollLoading" data-url="loaded.html">加载中...</div>  会在滚动时加载名为loaded.html的页面，并自动替换里面的内容。对于常用的图片，还有一点小问题，就是其默认的src图片地址。其src地址不能是真实的图片地址（否则会直接一次性全部加载），也不能是空地址或是坏地址，否则IE浏览器下会出现很惊悚的红叉叉。我的做法是默认链接的是一个1px * 1px的gif透明图片（大小很小），同时可以透出后面加载中gif动画图片，当滚动加载的时候直接把此gif图片替换掉。于是，对于图片，可能就有类似下面的代码： <img class="scrollLoading" data-url="http://image.zhangxinxu.com/image/study/head/s180/1.jpeg" src="http://www.zhangxinxu.com/study/image/pixel.gif" width="180" height="180" style="background:url(http://www.zhangxinxu.com/study/image/loading.gif) no-repeat center;" />  四、scrollLoading可选参数 scrollLoading是个很简单很小的插件（无注释YUI compressor min版仅508B），所以参数也很少，就一个，见下表：   参数 默认 释义 attr data-url 获取元素加载地址的属性名 就这些了。此插件只适用于页面默认滚动条的动态加载。对于内部div之类的滚动加载不支持。 http://www.okajax.com/uploads/allimg/110513/1215432930-0_lit.png jquery,滚轮,滚动,加载,图片 jquery.js zhangxinxu www.zhangxinxu.com 2011-05-13 12:07 http://www.okajax.com/a/201105/css_div_pic.html 纯css完美地解决图片在div内垂直水平居中，兼容IE7.0、IE6.0、IE5.5、IE5.0、FF、Opera、Safari...... 强烈推荐 纯css完美地解决图片在div内垂直水平居中，兼容IE7.0、IE6.0、IE5.5、IE5.0、FF、Opera、Safari...... 强烈推荐！   css实现div内图片的垂直、水平居中   <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title></title> <style type="text/css"> .img_v {   display:table-cell !important;   display:block;   position:static !important;   position:relative;   overflow:hidden;   width:400px;   height:400px;   border:1px solid #000;   vertical-align:middle;   text-align:center;  }   .img_v p {   display:table-cell !important;   display:block;   margin:0;   position:static !important;   position:absolute;   top:50%;   left:50%;   width:400px;   margin-left:auto;   margin-right:auto;  }   .img_v img {   position:static !important;   position:relative;   top:auto !important;   top:-50%;   left:auto !important;   left:-50%;  }  </style>  </head>  <body> <div class="img_v">   <p><img src="http://www.okajax.com/images/logo.gif"></p> </div>  </body>  </html>    http://www.okajax.com/uploads/allimg/110510/1_00122Q9D.gif css,div,pic Html+Css 北极星 未知 2011-05-10 00:07 http://www.okajax.com/a/201105/access_excel.html 有一个客户要求后台生成大数据量（每次生成几万条）的会员卡号及密码，金额等。生成的会员卡号及密码要印制在卡上对会员发放。生成大量数据在access库中，印制卡片的厂家要拿到数据进行印制怎么办呢？于是我想到用代码将access中的数据生成Excel表格导出。 有一个客户要求后台生成大数据量（每次生成几万条）的会员卡号及密码，金额等。生成的会员卡号及密码要印制在卡上对会员发放。生成大量数据在access库中，印制卡片的厂家要拿到数据进行印制怎么办呢？于是我想到用代码将access中的数据生成Excel表格导出。打印这样不就可以了吗？ <!--#include file="../conn.asp"-->  <%  if session("china_admin")="" then response.redirect "login.asp" dbpath="../" dblink  dim filename,fs,myfile,x,m,n,o,link  Set fs = server.CreateObject("scripting.filesystemobject")   Set rs = Server.CreateObject("ADODB.Recordset")  session("sql") = "select * from china_car" rs.Open session("sql"),conn,1,1  n=1   '==================================================================  '==============================================================建立excel文件系统  filename = Server.MapPath("car/CarTable"&n&".xls") '这个是为了方便，新建一个CAR的文件夹，这个可以自己设啦  if fs.FileExists(filename) then'如果文件存在，覆盖它。  fs.DeleteFile(filename)  end if  set myfile = fs.CreateTextFile(filename,true)   '========================================================================   dim strLine,responsestr  strLine=""  dim work,j,i  str="序号|卡号|密码|积分数|金额"　　'这个根据你的access数据表字段设置。  work=split(str,"|")  j=ubound(work)  i=0  o=0  do while not i>j  strLine= strLine & work(i) & chr(9)   i=i+1  loop   myfile.writeline strLine  Do while Not rs.EOF  o=o+1  m=20000    strLine=""  for each x in rs.Fields  strLine= strLine & x.value & chr(9)  if o>=m*n then  n=n+1  filename = Server.MapPath("car/CarTable"&n&".xls") '这个可以自己设啦  if fs.FileExists(filename) then'如果文件存在，覆盖它。  fs.DeleteFile(filename)  end if  set myfile = fs.CreateTextFile(filename,true)  end if  next   myfile.writeline strLine   rs.MoveNext  loop   rs.Close  set rs = nothing  conn.close  set conn = nothing  set myfile = nothing  Set fs=Nothing ExcelPath="car/CarTable"&n&".xls" response.Write "导出成功　　" response.write("<a href='" & server.URLEncode(ExcelPath) & "'><font=red>下载</font></a>")    %>    access,excel,asp Asp 北极星 未知 2011-05-10 00:02 http://www.okajax.com/a/201103/html5.html HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。HTML 的上一个版本诞生于 1999 年。自从那以后，Web 世界已经经历了巨变。HTML5 仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。 HTML5 是下一代的 HTML。 什么是 HTML5？ HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。 HTML 的上一个版本诞生于 1999 年。自从那以后，Web 世界已经经历了巨变。 HTML5 仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。 HTML5 是如何起步的？ HTML5 是 W3C 与 WHATWG 合作的结果。 编者注：W3C 指 World Wide Web Consortium，万维网联盟。 编者注：WHATWG 指 Web Hypertext Application Technology Working Group。 WHATWG 致力于 web 表单和应用程序，而 W3C 专注于 XHTML 2.0。在 2006 年，双方决定进行合作，来创建一个新版本的 HTML。 为 HTML5 建立的一些规则： 新特性应该基于 HTML、CSS、DOM 以及 JavaScript。 减少对外部插件的需求（比如 Flash） 更优秀的错误处理 更多取代脚本的标记 HTML5 应该独立于设备 开发进程应对公众透明 新特性 HTML5 中的一些有趣的新特性： 用于绘画的 canvas 元素 用于媒介回放的 video 和 audio 元素 对本地离线存储的更好的支持 新的特殊内容元素，比如 article、footer、header、nav、section 新的表单控件，比如 calendar、date、time、email、url、search 浏览器支持 最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。 html5 Html+Css 北极星 未知 2011-03-29 18:08 http://www.okajax.com/a/201103/company_website.html 信息化飞速发展的今天，不管是大型企业还是小公司，再或是工厂，基本上都已经拥有自己独立的网站了。而且很多企业网站都喜欢用大量的FLASH和图片元素来表现。单从营销的角度来说，这无可厚非，对网站浏览者来说无疑是一种美的享受。但是从网站优化和推广的角度来看：这 信息化飞速发展的今天，不管是大型企业还是小公司，再或是工厂，基本上都已经拥有自己独立的网站了。而且很多企业网站都喜欢用大量的FLASH和图片元素来表现。单从营销的角度来说，这无可厚非，对网站浏览者来说无疑是一种美的享受。但是从网站优化和推广的角度来看：这是比较失败的。企业网站绝对不能只是一个花瓶！以下笔者就对如何做好企业网站的推广工作给出以下几点建议。 一、网站尽量避免采用大量的FLASH和图片元素来表现的形式：这里笔者先做一个反问。假如你的网站大量使用FLASH或图片，3秒钟能显示全你的网站吗？如果不能，有几个人会再去等3秒钟？如果5到7秒之内还没有完全显示好你的站。OK，关浏览器走人，换下一家，百度上反正不只你这一家做这个产品的。在现阶段，网站采用文字的元素对搜索引擎来说才是最友好的。我们应该尽量少使用FLASH，同时注意在图片中加入alt属性。 二、网站内容更新：及时将公司的一些新产品资料和行业信息发布到自己的企业网站上去。同时也可将公司内部的一些活动发布上去，当然前提是不涉及公司的核心机密。在可能的情况下，要最大程度的保证网站内容有所变化。“外链为王，内容为皇”，足可证明网站内容和外链对于网站推广的重要性。这对于企业网站的推广是同等适用的。 三、行业宣传：花一千多元一个月雇佣一个电脑学校出来的学生，让她在企业所属的行业性网站上发布与你们产品相关的技术性信息，并带上企业的网址。这会有很多人看到的，当然也包括Baidu和GooGle等搜索引擎。这是一个很好的增加网站可见性（广泛度）的一个方法，对于提高网站关键词搜索排名也有一定的帮助。 四、将企业网站的网址登录提交到114目录：这是一个权重相对比较高的分类目录网站，其商业经济目录（http://www.114mulu.com/shangye/）中划分了工业制品，咨询服务，交通物流，广告营销，建筑环境，机械电子和金融保险目录（http://www.114mulu.com/jinrong/）等20个分类，基本含概了所有的企业类型。各位做企业网站推广的朋友大可选择适合的分类提交上去，如果能够成功收录的话对于提高企业网站搜索排名的效果还是比较可观的。而且还能从该网站获取潜在客户的有效流量，带来销售机会。 五、可以去阿里巴巴看看，学学别人的方法：如果别人有问题你了解的帮助回答一下，反正你又不缺那点时间，并留下你的网址，告诉他有兴趣可以赏光看看。或许他就是你的潜在客户；在此同时，你也可在阿里巴巴上找那些求购你这样产品的信息去，在线给他留言，注明产品型号和企业网址。 以上几点，讲的比较粗略，但希望大家能够从中延伸出更多更好的推广手段。总体而言：企业自己做网站推广的工作，相对会缺乏一定的专业性，网络推广前期也会缺乏必要的分析过程，存在很大的盲目性。企业如果没有SEO人员的话，建议可以考虑将此工作交给专业的网站推广公司来做。 企业网站 网站推广 114网站目录 2011-03-26 12:06 http://www.okajax.com/a/201103/pc_mobile.html 据国外媒体报道，在IBM成了100年之际，《硅谷内幕》网站对IBM的马克·迪恩（Mark Dean）进行了专访。在采访中，迪恩认为PC时代即将结束，PC终将被手机所替代。在重要性方面，PC已经被手机取代 据国外媒体报道，在IBM成了100年之际，《硅谷内幕》网站对IBM的马克·迪恩（Mark Dean）进行了专访。在采访中，迪恩认为PC时代即将结束，PC终将被手机所替代。在重要性方面，PC已经被手机取代。PC未来的命运将会像曾经的打字机一样。他还同意史蒂夫·乔布斯（Steve jobs）关于“后PC时代的说法”，但他认为手机的影响将比iPad等平板大得多，手机有可能最终取代人们的钱包、护照和相机。并且，迪恩还认为社交网络工具会进军企业。 关于迪恩的观点，笔者表示赞同。毕竟，现今人们对手机的依赖性极强。手机的应用功能强大，除了典型的电话功能外，还包含了PDA、游戏机、MP3、照相机、摄影、录音、GPS、上网等更多的功能。手机发展至今已抢占了很多行业的市场份额。手机体积小，携带方便，各种功能集合于一体，并让人与人之间的联系既简单又快捷。 手机对人们的影响不断扩大，手机用户逐渐增多。据工信部发布的《2011年1月份通信业运行状况》数据显示，2011年1月，全国电话用户总数达到11.64亿户。其中，固定电话用户2.94亿户，移动电话则达8.7亿户。在用户增值方面，移动电话用户净增1072.0万户，总数达8.7亿户。数据的显示，告诉我们一个信息，手机已逐渐普及，8.7亿的手机用户数占中国人口总数的67%，即每10个人中有6到7个人拥有手机。 随着手机逐渐发展的巨大趋势来看，手机用户数的增多给企业带来了一个商业上的冲击，除却手机各种不同的功能，我们仍不可忽略的是手机最基本的功能——手机短信功能。手机短信发送信息准确且直观，具有无可限量的商业价值。面对这一趋势，国内优秀的服务商时代互联提醒企业主，赶紧出手抓住手机短信功能所带来的商机。同时，时代互联（www.now.cn/mobile）开发出企业短信(sms)平台，帮助企业轻松搭建起属于自己的无线应用平台，随时沟通客户，时刻把握商机！ 时间的不停流逝，PC时代将不复以前的光芒，或终会被手机时代取而代之。企业必定要看好手机时代带来的所有商机，适时获取先机才能走在发展的前端。   手机，PC时代，短信，企业，时代 新闻咨询 时代 2011-03-23 16:44 http://www.okajax.com/a/201103/IE9_RC.html 在IE9 RC发布时微软表示，IE9 RC不仅支持更多的HTML5标准还在速度上取得了显著提升，在WebKit SunSpider测试中，IE9 RC比IE9 Beta快35%。今天，我们来看一下IE9 RC与其它四大浏览器在WebKit SunSpider测试中的成绩对比 在IE9 RC发布时微软表示，IE9 RC不仅支持更多的HTML5标准还在速度上取得了显著提升，在WebKit SunSpider测试中，IE9 RC比IE9 Beta快35%。今天，我们来看一下IE9 RC与其它四大浏览器在WebKit SunSpider测试中的成绩对比。 WebKit SunSpider是一种评测浏览器JavaScript执行性能的权威方法，此次测试选取了WebKit SunSpider JavaScript基准0.9.1版本，测试平台为戴尔Optiplex，采用3.0 GHz Core 2 Duo Intel处理器，4GB RAM，Intel Integrated Video，运行Windows 7系统。   参与此次测试的软件分别为：IE8、Firefox 3.6.13、Firefox 4.0 Beta 11、Safari 5.0.3、Chrome 9、Chrome 10.0.648.18最新开发者版本、Opera 11和IE9 RC。 IE9 RC测试结果为209毫秒（ms），成绩最好，位居首位；其次为Chrome 9（238ms）和Opera 11（240ms）。最后一名毫无疑问是IE8，其测试结果为3746ms，与IE9 RC相差很远。 得分当然越低越好 ie9,js,浏览器 浏览器研究 北极星 未知 2011-03-22 20:30 http://www.okajax.com/a/201103/css3_percent_11.html 例如：圆角、阴影、绚丽色彩、三维旋转等经典效果，都是无数flash设计者引以为豪的杰作，然而，利用css也可以做出一样的超炫效果，下面我们就用css实现11个超炫的效果，让您开开眼界，需要的朋友也可以加入自己的网页，让你的网页炫起来 例如：圆角、阴影、绚丽色彩、三维旋转等经典效果，都是无数flash设计者引以为豪的杰作，然而，利用css也可以做出一样的超炫效果，下面我们就用css实现11个超炫的效果，让您开开眼界，需要的朋友也可以加入自己的网页，让你的网页炫起来。 最近花了好些时间整理了一下CSS3的特效，利用比较直观易懂的方式表现出来跟大家分享一下，希望大家会有一点点的收获。 其中“ -moz- ” 一般指火狐的写法，“ -webkit- ” 一般指webkit内核浏览器的写法. 1、border-radius 实现圆角效果，只需一行CSS代码便可以实现，支持众多浏览器，当然不支持IE。 2、border-top-left-radius设置圆角各个角的半径值（不支持IE） 3、box-shadow实现阴影效果(不支持IE) 4、css3实现阴影和圆角完美结合，个人感觉这种效果挺不错的，很有立体感。 5、当别人机器上没有这种字体，而你又想让页面上设置成这种字体时，不防考虑将字体上传到服务器，只需要设置一个相对路径和字体名称就行。简单吧？ 6、text-shadow实现多重阴影效果，打造炫丽色彩。 7、opacity实现背景透明度（不支持IE） 8、transform:translate(X轴,Y轴)实现物体移动： 9、transform:scale(倍数)实现放大缩小。 10、transform:skew()将元素产生透视效果 11、transform:rotate(度数) 将元素旋转X度 css3,特效,演示 Html+Css 北极星 未知 2011-03-22 20:19 http://www.okajax.com/a/201103/jquery_14.html 基于Web的在线操作是一个逐步成熟的趋势，Web运用的富厚多样化，然而多数都是基于JavaScript框架实现的，此中 jQuery 框架被越来越多的Web开发者喜爱，它可以让你“少写，多做”轻松实现繁杂成效，这里便是基于jQuery 的14个图片放大编辑插件 基于Web的在线操作是一个逐步成熟的趋势，Web运用的富厚多样化，然而多数都是基于JavaScript框架实现的，此中 jQuery 框架被越来越多的Web开发者喜爱，它可以让你“少写，多做”轻松实现繁杂成效，这里便是基于jQuery 的14个图片放大编辑插件。 1，jQuery gzoom plugin 2，Hover Zoom 3，AnythingZoomer jQuery Plugin 4，JQZoom 5，jQuery Cycle plugin   6，crop, labelOver and pluck 7，ImgAreaSelect #p#14个漂亮的图片放大编辑的jQuery插件1-7#e# 8，Jcrop   9，PHP & jQuery image upload and crop 10，PanView 11，Zoomer Gallery 12，jQuery plugin : Fancy Zoom 13，Image Zoom 2.0 14，jQuery PhotoShoot Plugin via: JQuery Zoom Effekte zum Nachbauen #p#14个漂亮的图片放大编辑的jQuery插件8-14#e# http://www.okajax.com/uploads/allimg/110322/2013025096-0_lit.jpg jquery,插件 Ajax优秀资源 北极星 未知 2011-03-22 20:03 http://www.okajax.com/a/201103/jquery_content.html 让这个结构中有文字的显示一种颜色，没有文字的显示另一种颜色 网页中html代码如下: <style type="text/css"> *{ margin:0; padding:0; font-size:12px;}  body{ background:#EEE;}  a{ color:#666;}  li{ list-style:none;}  ul{ width:500px; height:230px; background:#fff; margin:50px auto;}  ul li{ width:500px; height:auto; overflow:hidden; margin-bottom:5px;}  ul li span{ display:block; float:left; width:100px; height:20px;}  </style>  <ul>        <li><span><a href="#">【专题】</a></span><a href="#">2005年超女王贝因整形意外身亡</a></li>        <li><span><a href="#"></a></span><a href="#">2005年超女王贝因整形意外身亡</a></li> </ul>  让<span><a href="#"></a></span>这个结构中有文字的显示一种颜色，没有文字的显示另一种颜色的JQ代码如下： <script type="text/javascript"> $(function(){         $("ul li span").each(function(){                if($(this).find("a:eq(0)").text()==""){                       $(this).css("background","blue");                }else{                       $(this).css("background","red");                }                         });                                 });  </script>    jquery,元素,内容 jquery.js 北极星 未知 2011-03-22 19:59 http://www.okajax.com/a/201103/website.html 网站目录是指建立网站的时候所创建的文件目录及所包含的文件所表现出来的结构，类似windows的文件目录结构。网站目录的结构往往容易被很多站长所忽略，但其实网站目录结构的层级对SEO的影响很大：目录层级不能太深，结构要相对简单，这样搜索引擎的访问就更容易。 对于 网站目录是指建立网站的时候所创建的文件目录及所包含的文件所表现出来的结构，类似windows的文件目录结构。网站目录的结构往往容易被很多站长所忽略，但其实网站目录结构的层级对SEO的影响很大：目录层级不能太深，结构要相对简单，这样搜索引擎的访问就更容易。 对于小型网站来说，可以采用将所有网页都放在网站根目录下的扁平式结构。这种单一目录的结构对搜索引擎而言是最为理想的，因为只要一次访问即可遍历。但是对于规模大一些的网站，往往需要二到三层甚至更多层级子目录才能保证文件内容页的正常存储，这种多层级目录也叫做树型结构。即根目录下再细分成多个频道或栏目，然后在每一个目录下面再存储属于这个目录的终极内容网页，这样的好处是维护容易，但是对于搜索引擎的抓取将会显得相对困难些。 对于栏目的优化：笔者鼓励各位站长按不同网站栏目分别建立子目录，且尽量使用意义明确的目录名称。比如可将图片放到/image/，css文件归放到/css/目录，等等。但是注意尽量不要使用中文名称（可以汉语拼音或英文名代替），但目录名称也不宜太过冗长，URL应该越短越好。比如笔者的114网站目录电脑网络分类我们没有将这个目录命名为/diannaowangluo/，而是使用了/diannao/这样的名称，这样即包含关键词又能保证URL不至于过长。如果你觉得这个关键词组都很重要，一定都要包含的话，建议使用“-”连字符进行分隔，即/diannao-wangluo/。 再来看看页面级文件的优化：最开始笔者也是使用（/栏目名/内容页）的形式，但是经过一段时间的使用发现很多网站会更改网站的主题，这时就需要对网站的分类进行调整。这样操作起来会相对麻烦一些，而且涉及到要更改内容页的URL，对搜索引擎来说也是不友好的。所以权衡之下，我们采用了将网页统一归类于/www/目录下的形式，比如：114网站目录收录Ajax中国的URL为：http://www.114mulu.com/www/okajax_com.asp，这样即在URL中充分体现了Ajax中国（www.okajax.com）这个网址，而且也方便日后调整网站分类。 最后，笔者在此还要提醒各位站长朋友：域名、目录和页面的权重是不一样的。在关键词排名竞争时，独立域名是最具排名优势的（且一级域名大于二级域名），目录级其次，最后才是页面级。因此，如果关键词排名前十位的大多数是页面级的站点在竞争，那我们就可以在网站之下建立一个目录来参与竞争；如果前十名都是目录级，那我们就可用域名级来争取排名；如果前十名都是域名级，那就要PK网站的权重和内容质量了。 网站目录,优化 建站经验 114网站目录 2011-03-14 09:09 http://www.okajax.com/a/201012/seo.html 以下收集的SEO在线工具可以为你有效对网站进行检查，而且他们都是免费的，在大多数情况下你不需要创建一个帐户就可直接使用。 1. 百度指数：http://index.baidu.com/ 2. Google关键字工具：https://adwords.google.com/select/KeywordToolExternal 3. Google趋势：http: 以下收集的SEO在线工具可以为你有效对网站进行检查，而且他们都是免费的，在大多数情况下你不需要创建一个帐户就可直接使用。 1. 百度指数：http://index.baidu.com/ 2. Google关键字工具：https://adwords.google.com/select/KeywordToolExternal 3. Google趋势：http://www.google.com/trends?hl=zh-CN 4. Whois - 域名信息查询：http://whois.domaintools.com/ 5. Google分析：http://www.google.com/analytics 6. 站长工具：http://tool.chinaz.com/ 7. 友情链接查询：http://link.chinaz.com/ 8. 百度关键词综合排名查询：http://e.baidu.com/keyword/ 9. 查询同一IP下所有网站(IP反查询域名工具) : http://www.myipneighbors.com/ http://www.yougetsignal.com/tools/web-sites-on-web-server/ 10. 搜索引擎蜘蛛模拟器（国外）：http://www.webconfs.com/search-engine-spider-simulator.php 11. 网页相似度检查工具 Similar Page Checker: http://www.webconfs.com/similar-page-checker.php 12. 反向链接锚文本分析工具: http://www.webconfs.com/anchor-text-analysis.php 13. 反向链接生成工具 Backlink Builder: http://www.webconfs.com/backlink-builder.php 14. 反向链接分析工具 Backlink Summary: http://www.webconfs.com/backlink-summary.php 15. 关键字密度检查工具 Keyword Density Checker: http://www.webconfs.com/keyword-density-checker.php 16. 友情链接检查工具 Reciprocal Link Check: http://www.webconfs.com/reciprocal-link-checker.php 17. 网站数据统计工具 Domain Stats Tool: http://www.webconfs.com/domain-stats.php 18. 域名年龄统计工具 Domain Age Tool: http://www.webconfs.com/domain-age.php 19. 关键字建议工具：http://www.webconfs.com/keyword-playground.php 20. URLs动态链接重写工具： http://www.webconfs.com/url-rewriting-tool.php 21. 反向链接检查(非常好用的Inbound Links Checker) http://www.online-utility.org/webmaster/backlink_domain_analyzer.jsp 22. 微软必应工具箱 必应管理员工具: http://cn.bing.com/toolbox/ 23. 关键字词挖掘工具：追词：http://www.zhuici.com/ 24. Meta搜索：http://www.meta.cn/ 25. SearchStatus：http://www.quirk.biz/searchstatus/ 这款工具不仅能够在网页加载时查询网站PR值，Alexa排名等重要的质量衡量指标，还可以快速的查看页面重要信息如：Title 标签，META元标签内容等。 26. Soso指数：http://index.soso.com/ 27. 百度站长平台：http://sitemap.baidu.com/ 28. 网站载入速度查看工具：http://www.iwebtool.com/speed_test 文章出自http://abroad.puying.com  转载请标明 SEO，SEO工具 SEO优化 南希王 2010-12-30 14:41 http://www.okajax.com/a/201012/jquery_tips.html 在 6om购物排行榜上发现了这个 jquery tips 商品图片提示框，非常漂亮。 使用 Jquery 类库，代码精简，并且带人性化缺口和阴影。 在 6om购物排行榜上发现了这个 jquery tips 商品图片提示框，非常漂亮。 使用 Jquery 类库，代码精简，并且带人性化缺口和阴影。 那个箭头不要以为是用图片做的，其实并没有，完全用 CSS 实现。 我把代码分享出来，新手们赶快研究一下，超实用的效果。 演示1（U盘排行榜）：http://paihang.gouwu.6om.cn/upan/ 演示2（化妆品排行榜）：http://paihang.gouwu.6om.cn/huazhuangpin/ 演示3（男装排行榜）：http://paihang.gouwu.6om.cn/nanzhuang/ 代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ｓｃｒｉｐｔ type="text/javaｓｃｒｉｐｔ" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></ｓｃｒｉｐｔ> <style type="text/css"> #tip            {position:absolute;color:#333;display:none;}  #tip s          {position:absolute;top:40px;left:-20px;display:block;width:0px;height:0px;font-size:0px;line-height:0px;border-color:transparent #BBA transparent transparent;border-style:dashed solid dashed dashed;border-width:10px;}  #tip s i            {position:absolute;top:-10px;left:-8px;display:block;width:0px;height:0px;font-size:0px;line-height:0px;border-color:transparent #fff transparent transparent;border-style:dashed solid dashed dashed;border-width:10px;}  #tip .t_box         {position:relative;background-color:#CCC;filter:alpha(opacity=50);-moz-opacity:0.5;bottom:-3px;right:-3px;}  #tip .t_box div     {position:relative;background-color:#FFF;border:1px solid #ACA899;background:#FFF;padding:1px;top:-3px;left:-3px;}   .tip            {width:82px;height:82px;border:1px solid #DDD;}  </style> <ｓｃｒｉｐｔ type="text/javaｓｃｒｉｐｔ"> $(function(){     $('.tip').mouseover(function(){        var $tip=$('<div id="tip"><div class="t_box"><div><s><i></i></s><img src="'+this.src+'" /></div></div></div>');        $('body').append($tip);        $('#tip').show('fast');     }).mouseout(function(){        $('#tip').remove();     }).mousemove(function(e){        $('#tip').css({"top":(e.pageY-60)+"px","left":(e.pageX+30)+"px"})     })  })  </ｓｃｒｉｐｔ> <p> </p> <a href="http://paihang.gouwu.6om.cn/upan/" ><img class="tip" src="http://img04.taobaocdn.com/bao/uploaded/i4/T1dEBQXipuXXczdj2a_091642.jpg_310x310.jpg" /></a> <a href="http://paihang.gouwu.6om.cn/nanzhuang/" ><img class="tip" src="http://img03.taobaocdn.com/bao/uploaded/i3/T1JrxRXhVjXXXPQgc2_044150.jpg_310x310.jpg" /></a> <a href="http://paihang.gouwu.6om.cn/huazhuangpin/" ><img class="tip" src="http://img03.taobaocdn.com/bao/uploaded/i3/T1tDNOXfNeXXXkeTI8_102031.jpg_310x310.jpg" /></a>    商品图片,jquery,tips,提示框,无 jquery.js 林嫣 2010-12-14 13:47 http://www.okajax.com/a/201012/ie_ff_chrome.html 目前，全球市场份额排名最高的三款浏览器产品：IE、Chrome和Firefox各自都在酝酿新版本 目前，全球市场份额排名最高的三款浏览器产品：IE、Chrome和Firefox各自都在酝酿新版本。下面从硬件加速角度对上述产品作一个简单介绍： 1、微软IE 9 随着现代浏览器的地位越来越重要，与之相关的各种技术发展也十分迅速。硬件加速功能正成为其发展的新趋势，支持硬件加速使浏览器可以使摆脱图像调整、渲染复杂文本，以及显示脚本动画等繁重的任务，将这些任务交由电脑的显卡完成。这有助于减轻电脑CPU的工作量，并提升页面加载速度。 我们发现在新版本中只有IE 9默认将硬件加速作为其基本功能之一，很明显，IE 9在支持云应用程序UX特性方面领先于Chrome和Firefox，且在测试中的得分较旧版IE有大幅上升。 最后的技术预览版IE 9 PP4 build 1.0.7.9.16.6000提供了完全的硬件加速功能，再加上Windows 7中DirectX 11的支持，IE 9处理图片、文本和多媒体文件时更加得心应手。 2、Mozilla Firefox 4 火狐4在硬件加速方面是最接近于IE 9的，Firefox 4的用户已经可以测试Drive D2D功能，当然这项功能默认是关闭的，需要用户手动开启。 Direct2D是一款矢量图形API，经过实际测试证明，Firefox加载Direct D2D后很多网页的渲染时间都明显缩短，且在包含动画SVG/CSS等丰富内容页面中，Direct2D打开的页面更加流畅。 最大的问题在于，开启后D2D的而速度极慢，需要在地址栏输入 about:config 设置 mozilla.widget.render-mode 为 6 gfx.font_rendering.directwrite.enabled 为 true.感兴趣的读者可以亲身体验一下。 3、谷歌Chrome 7 谷歌浏览器高级工程师范吉利斯·克维斯透露，Chrome 7中也将整合GPU硬件加速功能。但是Chrome浏览器采用的是沙箱渲染模式，且Chromium已经开始对部分内容实施硬件加速。对于普通的网页内容（文本、CSS、静态图片）依旧直接使用CPU渲染，而GPU负责大型媒体（如视频）的加速渲染任务，更为特殊的WebGL元素，则完全交由GPU渲染。总的来说，Chrome 7在此方面还略显落后。   ie9,chrome7,ff4,加速,性能 浏览器研究 北极星 未知 2010-12-13 18:06 http://www.okajax.com/a/201011/CSS_Sprites.html 众所周知，减少网站加载时间的最有效的方式之一就是减少网站的HTTP请求数。实现这一目标的一个有效的方法就是通过CSS Sprites——将多个图片整合到一个图片中，然后再用CSS来定位 众所周知，减少网站加载时间的最有效的方式之一就是减少网站的HTTP请求数。实现这一目标的一个有效的方法就是通过CSS Sprites——将多个图片整合到一个图片中，然后再用CSS来定位。 下面是一张样图： 本文的目的并不是讲CSS Sprite如何让一个网站更快，而是说一些使用CSS Sprite的时候的一些最佳实践。 不要等到你完成切片之后才开始sprite. 如果你边切图边写CSS，然后等你完成了整个网站之后再来拼接这些图片到一个Sprite中，你就不得不完全重写你的CSS，你也必须要花费很多的时间来用PS拼接大量的图片——这是件令人倍感纠结的事情。但是如果边切图边整合，就会比较容易些。 把图片放到它要显示的地方的相对的地方这个小技巧貌似比较难理解。 我直到创建一个比较大的sprite的时候才理解到这一点。比如，如果我们希望一个图片出现在一个元素的左侧： 将那个图片放到sprite图片的右边(本文开始的那个sprite图片)。这样的话，当你通过CSS移动背景图片的位置的时候，基本上不可能有其它的小图片意外的出现在它的附近。使用Sprite的时候常常遇到的一个问题是图片会出现在它不该出现的位置。 定位时避免使用bottom或right等 当使用CSS sprite的时候，只用background-position: bottom -300px或background-position: right -200px;非常容易。这刚开始的时候是可行的，但是问题是，当你在宽度上或高度上扩展相关sprite图片的时候，原先设置的位置可能是错的，因为那个图片已经不再Sprite图片的底部或右部了。使用确切的位置来避免这个问题。 给每个图片足够的空间 就像你在本文顶部的实例图片看到的那样，那些小图片都被预留了足够的空间。为什么不把他们塞到一块来让sprite图片更小呢？ 因为使用这些图片的元素通常都会有大量的内容而且可能会需要扩展的间距，以至于其它图片不会意外出现。 例子： 例子中的每个条目都有个带数字的图片作为背景图片。如果你仔细看了上面的那张图片，你可以看到这三个数字图片是如何错开排列的，这样如果内容增多，其它图片就不会意外出现。 不用担心Sprite图片的像素大小  如果你的网站经过良好的设计，那么你将会有一大堆的图片来整合进到sprite里面，这样你就需要你个非常大的sprite来恰当的放置这些图片。这是很不错的。sprite里的空白不会占用太多的文件大小。addons.mozilla.org上使用的Sprite图片有1,000px×2,000 px那么大，但是图片的大小仅仅16.7kb 简单介绍一下 CSS Sprites 的优点： 当用户往U盘中拷200张图片，会等很久。但是如果弄成一个文件，再拷贝就会快很多. CSS Sprites 的目的就是通过整合图片，减少对服务器的请求数量，从而加快页面加载速度。 实现方法： 首先将小图片整合到一张大的图片上  然后根据具体图标在大图上的位置，给背景定位。background-position:-8px -95px; CSS,Sprites,图片,合并 Html+Css 北极星 未知 2010-11-25 22:42 http://www.okajax.com/a/201011/program.html 原文作者乔纳森·丹尼可（Jonathan Danylko）是一位自由职业的web架构师和程序员，编程经验已超过20年，涉足领域有电子商务、生物技术、房地产、医疗、保险和公用事业。正如乔纳森在文中所言，本文适合刚毕业的大学生和刚入门的程序员。如果你已是高级开发人员，或许你 编者按：原文作者乔纳森·丹尼可（Jonathan Danylko）是一位自由职业的web架构师和程序员，编程经验已超过20年，涉足领域有电子商务、生物技术、房地产、医疗、保险和公用事业。正如乔纳森在文中所言，本文适合刚毕业的大学生和刚入门的程序员。如果你已是高级开发人员，或许你能在本文中看到自己的身影。 从11岁时，我就一直在编程，并且一直都很喜欢技术和编程。这些年来，我积累了一些艰难又容易的经验。作为一名程序员，你或许还没这些经验，但我会把它们献给那些想从中学到更多的朋友。 我会持续更新这些经验，我可能还会有更多的感想，但就我这20年来看，我想下面这个列表中基本不需要增添额外的东西了。下面就是我至今最难忘的经验。 1. 估算解决问题所需要的时间。不要怕，承认吧！我曾见过一些程序员为了解决一个特殊问题而坐在显示器前面8小时。为自己定一个时间限制吧，1小时、30分钟或甚至15分钟。如果在这期间你不能解决问题，那就去寻求帮助，或到网上找答案，而不是尝试去做“超级堆码员”。 2. 编程语言是一种语言，只是一种语言。随着时光推移，只要你理解了一种语言的原理，你会发现各种语言之间的相似之处 。你所选择的语言，你应该觉得“舒服”，并且能够写出有效（而且简洁）的代码。最重要的，让语言去适应项目，反之亦然。 3. 不要过于注重程序的“设计模式”。 有时候，写一个简单的算法，要比引入某种模式更容易。在多数情况下，程序代码应是简单易懂，甚至清洁工也能看懂。 4. 经常备份代码。在我年轻时，我就有过因硬盘故障而丢了大量代码的经历，这经历很恐怖的。只要你一次没有备份，就应当像有着严格的期限，客户明天就需要。此时就该源码/版本控制软件大显身手了。 5. 承认自己并不是最顶尖的程序员 - 知不足。我常想，我对编程了解已足够多，但是总有其他人比你优秀。正所谓，“一山总比一山高”。所以，向他们看齐吧！ 6、学习再学习。正如第5点所说，我经常会在手里拿一本计算机或编程相关的杂志或书（不信，可以问我的朋友）。诚然，总有很多你不知道的技术，你可以从中学习以保持不落后。如果你有一种灵巧的方式来获取你需要的新技术，那你每天都应该坚持学习。 7. 永恒的变化。你对待技术/编程知识，就应像你对待股票一样：多样化。不要在某一特定技术上自我感觉良好。如果那种技术或语言已经没有足够支持，那你还不如现在就开始更新你的简历，并启动培训新计划。我能保持前行的主要原则是什么呢？至少了解两到三种语言，所以，如果某种语言过时了，你在学习新技术的时候还可以依靠另一种语言。 8. 提携新人。协助并且培养初级/入门的开发人员学习优秀的编程方法和技巧。也许你还不知道，在帮助他们向更高一层前进时，你自己也在向更高一层提升，你会更加自信。 9. 简化算法。代码如恶魔，在你完成编码后，应回头并且优化它。从长远来看，这里或那里一些的改进，会让后来的支持人员更加轻松。 10. 编写文档。无论是Web服务的API，还是一个简单的类，你尽量编写相应文档。我曾经引以为豪的代码注释，因过度注释而有人指责。给三行代码加一行注释，只需要你几秒时间。如果那是一个比较难以理解的技术，千万别担心过多注释。如果你能很好做好自己的工作，大多数架构师、后备程序员、支持组都会感激你。 11. 测试、测试再测试。我是一名黑盒测试粉丝。当你完成编码后，你“被认可”的时候就开始了。如果你们公司有QA部门，如果你的代码中有错误，那你得到的评论，会比项目经理还多。如果你不彻底测试自己的代码，那恐怕你开发的就不只是代码，可能还会声名狼藉。 12. 庆祝每一次成功。我见过很多程序员在解决编程技术难题后，会和同伴握手、击掌或甚至手舞足蹈。每个人在生命中都会碰到“顿悟”。如果一个程序员高兴地跑来叫你去看他的非凡代码，也许你已经看过这样的代码100遍了，但你也应该为了这个家伙而庆祝第101次。（编者注：《庆祝成功的九种方式》。） 13. 经常检查代码。 在公司，你的代码要经常检查（包括自查和其他同事检查）。不要把别人的检查，看成是对代码风格的苛求。应该把它们看作是有建设性的批评。对个人来说，经常检查你的代码并且自问，“我怎样才能写得更好呢？” 这会加速你的成长，让你成为一个更优秀的程序员。 14. 回顾你的代码。在看到自己以前的代码时，通常会有两种方式：“难以至信，这代码是我写的”和“难以至信，这代码是我写的”。第一种往往是厌恶的语气，并在想如何改进它。你也许会惊叹，旧代码也能复活成为一种更好的程序，甚至是一个完整的产品。第二种通常带着惊奇和成就感。开发人员应该一到两个自己完成的项目成果，能让众人不禁而立并注目而观的项目。同样，基于你优越的编程能力，你可以把过去的程序或项目拿出来，把它们更新为更加优秀的产品或想法。 15. 幽默是不可缺的。在我20年的开发生涯中，我还没有碰到哪位程序员是没有幽默感的。实际上，干我们这行，幽默是一项必备品。 16. 谨防那些无所不知的程序员，不愿分享的程序员，还有经验不足的程序员。当你遇到这几种程序员时，你自己要谦虚。无所不知的程序员，更想当一个英雄而不是团队成员；保守的程序员则是在编写着他们独享的代码；而经验不足的程序员则会每十分钟就来问你一下，当代码完成后，代码已经是你的，而不是他们。 17. 任何项目都不会那么简单。朋友、家人和同事曾请求我仓促做一些事情，仓促做一个程序或者网站。对于这样的事，应该从双方做计划，才能做出令两方都会满意的东西。如果某人起初只是需要一个使用Microsoft Access的、只有有3个页面的网站，但来就很可能变成一个有15个页面的网站，并使用SQL Server，有一个论坛，还有一个定制的CMS（内容管理系统）。 18. 任何时候不要想当然。假如你承接一个简单的项目，你可能会认为某个部分可以轻松完成。千万别这样想！除非你有一个类、组件、或者一段已经写好的代码，并且在现有的项目已经测试通过。不要认为这将是很容易的。 19. 没有已经完成的软件。曾经有一位程序员告诉我，没有软件是已经完成的，它只是“暂时完成了”。这是明智的忠告。如果客户还在使用你写的程序，并经受了时间的考验。如果有机会，你仍在更新它，这并不是什么坏事，这让你不断地前行。 20. 耐心是一种美德。当客户、朋友或家庭成员用电脑的时候，他们也许会受挫，进而想砸电脑，或气冲冲地离开。我一直在告诉他们，“是你掌控电脑，不是电脑掌控你。”对于用作编程的电脑，你要有一定的耐心。一旦程序员知道问题所在后，他们就会站在电脑的角度看问题，并且说“哦，这就是为什么它是这样做。” 编者后话 对本文深有感触！虽然本文没有华丽的辞藻，其中朴实的道理，其实并非只适用程序员，同样可以扩展到其他行业。记得以前练字时，总感觉当时写得很好，但后来回头再看时，也会想“这居然是我写的字！” 20,编程,经验 其他 北极星 未知 2010-11-21 08:25 http://www.okajax.com/a/201011/google.html 一方面，如果你的排名一直在第一页下方徘徊，现在你也许会被踢到第二页去了。另外，如果用户要搜索的就是你网站的时候，你将会获得更多的曝光率，在搜索结果里展示来自网站的更多信息。当然这个情况不会总是发生，只在Google对那些很有把握的关键字上才会呈现出如此极端 今年8月Google曾经说他们在测试针对某个关键字显示超过2个来自同一域名的搜索结果，今天他们宣布扩大这种呈现多个结果来自同一域名的搜索结果，比如搜索“moma”(Museum of Modern Art)，根据以前的原则只会显示出两个来自moma官方网站域名的搜索结果条目，而现在他们将这一限制增加到了4个(如下图)。即便在第一个搜索结果下面富文本摘要里已经出现了营业时间这个链接，在下面依然单独列出营业时间的搜索结果链接。因为Google的算法现在可以更肯定你搜索的“moma”就是要得到现代艺术博物馆的信息，那么它的官网信息是最权威最准确的，为什么不多给出几个链接呢?   这对广大站长意味着什么?一方面，如果你的排名一直在第一页下方徘徊，现在你也许会被踢到第二页去了。另外，如果用户要搜索的就是你网站的时候，你将会获得更多的曝光率，在搜索结果里展示来自网站的更多信息。当然这个情况不会总是发生，只在Google对那些很有把握的关键字上才会呈现出如此极端的搜索结果页面。 google,域名,搜索 Google研究 北极星 Admin5 2010-11-21 08:07 http://www.okajax.com/a/201010/70_ajax.html 流行的70个AJAX演示及下载 Ajallerix : AJAX, simple, fast Web image gallery demo ; at Novell AJAX - microlink pattern tutorial : A microlink is a link that opens up content below it. Ajax BBC News RSS Reader : demo by Nigel Crawley AJAX Chat in Python with Dojo : at AquaAjax Ajax Chess : multiplayer chess Ajax examples at BackBase : examples demonstrating several aspects of the Backbase technology. Ajax examples at Rico : Inner HTML, JavaScript updater etc. Ajax examples using ColdFusionMX, SQLServer, SOAP : Contact Manager, NOAA 7 Day Forecast code and demos. Ajax Feed TV : News feed Ajax inline dictionary : Highlight any text on this site then right click. A tooltip containing the definition of the selected Word should show up. Ajaxload : Ajax loading gif generator. Ajax Login Demo : Creating a secure login system using XMLHttpRequest Ajax Newsletter Signup : A newsletter signup form that shows Thank You on the same page. ajaxProject : Project Management applicaiton with rich UI Ajax Rater : A star rating system that uses Ajax. AJAX-S : An Ajax-based slideshow system. AJAX Spell Checker : spell check text / form content. Ajax Toolbox : Tools for the Ajax Developer Amazon Catalog Tree : Amazon Catalog Tree Amazon Zuggest : Amazon product suggestion (like google suggest) Askeet by symfony : Digg-like AJAX interactions; open source Backbase - Ajax Demos : Ajax demos at BackBase Basic Ajax Examples : Ping, track changes, drop down, Google suggest hack etc at Clearnova Behaviour : Fading lists, Sortable lists, Dropout boxen, Shaky lists chat.app : ajax chat Chihuahua Word Puzzle : daily word puzzles Coloir : Ajax Slideshow DHTML arcade/action games : a collection that demonstrate the power of DHTML DomAPI : Windows Desktop, OutLook-like, RSS Reader Drag and Drop Shopping Cart Demo : at CyberDummy Easy AJAX inline text edit 2.0 : edit a pIEce of text inline FileChucker : File upload and progress bar at Encodable.com Gmail Style Check Username AJAX Demo : at CyberDummy Google Web Toolkit Example Projects : Hello World, Dynamic Table, Desktop App Clone etc GreyBox : Pop up window using idea of light box. FiftyFourEleven: Ajax Examples IntuiCat - ajax Catalogue : Ajax-based Catalogue Demo jsLINB programming demos : LINB(Lazy INternet and Browser) JSlog : Ajax logging tool. JS/UIX Unix Shell : JS/UIX is an UN*X-like OS for standard web-browsers, written entirely in JavaScript. Lace : free web chat application Lightbox : simple, unobtrusive script used to overlay images on the current page. Leightbox : Light Box with inline div’s instead of AJAX calls. Live Quote Demo : Simple way of creating an updating stock quote table in ajax. Magnetic Poetry : drag and drop poetry Metatron Chat Engine : PHP/MySQL/JavaScript powered chat engine Monket Calendar : online calendar Multi List Drag Drop Demo : at CyberDummy NetDirector : open and extensible framework for managing configurations of common open source network services. nexImage : Image processing demo Opera Platform : Enabling AJAX applications on mobile phones Orbeon examples : various examples illustrating the capabilities of OPS, from the OPS Tutorial examples to XForms examples OVO Suite : Online Virtual Office : virtual Office limited demo phpFreeChat : php Free Chat S5: A Simple Standards-Based Slide Show System : S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. script.aculo.us Reflector : image reflector script that uses uses opacity-based fades Slider Bar Demo : at CyberDummy SmallestAjax : Smallest Ajax example in the world? Spell Check demo : by Primal Grasp Super Maryo World : Japanese game demo Tacos : Tacos provides a library of useful Tapestry components. This application provides some examples to get you started. theList : to-do list / bug-tracker ThickBox : ThickBox is a Lightbox than can show html pages as well as images. Tooltip.js : Tooltip.js is a simple class to make it possible to add tooltips to your page. Treehouse Chat : ajax chat Tudu Lists : open-source to-do lists WeBoggle : Ajax Boggle XHTML live Chat : ajax chat YahooSearchAsYouType : Yahoo search as you type ZK Demo : demo programs for various components 流行,70,ajax,演示,下载 Ajax优秀资源 北极星 未知 2010-10-10 23:22 http://www.okajax.com/a/201010/alexa_rank.html 我这里所讲的绝不会是某种作弊的方法。比如你用搜索来搜一下“Alexa 刷"，你就会看到许多通过刷页面来提高Alexa，或者是互刷联盟，或者是工具来刷，再或者通过模拟IP来提高。这些都无法反映你的真实流量。 我这里所讲的绝不会是某种作弊的方法。比如你用搜索来搜一下“Alexa 刷"，你就会看到许多通过刷页面来提高Alexa，或者是互刷联盟，或者是工具来刷，再或者通过模拟IP来提高。这些都无法反映你的真实流量。 我这里所说的方法，都是合理合法的，既不会吹出大泡泡，也不会受到搜索引擎的惩罚，所以叫安全方法。 1) 安装Alexa工具条，或者安装Firefox下的SearchStatus插件。并且设置自己的Blog作为默认首页，这样每次你打开浏览器的时候，Alexa统计就开始工作了。 2) 把Alexa排名统计的widget放在Blog上，当它被点击的时候，也相当于Alexa统计到一次PV，即使那个用户没有安装Alexa工具条。 3) 如果可以的话，在你的公司或者办公室里的电脑里都安装上Alexa工具条。 4) 在站长论坛里发贴子的时候留下你的链接，一般站长安装Alexa的较多，当他们访问你的Blog的时候，当然会有帮助。 5) 使用Alexa重定向功能，当你留言的时候，可以留下这样的链接：http://redirect.alexa.com/redirect?okajax.com当用户点击这个链接的时候，就相当于给你的网站添加了一个PV，并且被Alexa统计到，哪怕他用的浏览器根本没有Alexa。 6) 给你的Blog添加一个Alexa分类，把有关Alexa的文章都放在里面，这样站长有更大的机会来到你的Blog，你的排名当然就容易上升。 7) 找到你的Blog上最受欢迎的文章，把Alexa的链接添加上，或者使用第五点中所说的重定向链接到你自己内部的文章。 8) 提供一些站长工具，这样站长就会经常来造访，并且提高你的Alexa排名，比如SEO 在线工具中的Google PageRank Checker就是一个很好的例子。 alexa,排名 Alexa排名 北极星 未知 2010-10-02 21:54 http://www.okajax.com/a/201010/mcafee_85i.html McAfee一款不错的杀毒软件，尤其是其企业版的灵活得到了用户的好评，麦咖啡8.5i大企业服务器版下载，可无限使用、在线更新 麦咖啡8.5i大企业服务器版下载，可无限使用、在线更新。 McAfee一款不错的杀毒软件，是服务器上最好用，最安全的杀毒软件，尤其是其企业版的灵活得到了用户的好评，现在分享授权码。   2705522-NAI(大企业授权) 1759124-NAI(中小企业授权) 1346326-NAI   McAfee Managed Virus Defense 1355415-NAI   McAfee Network Security Platform 1384386-NAI   McAfee Active Virus Defense SMB Edition 1362873-NAI   McAfee Active VirusScan 2106875-NAI   McAfee Active VirusScan 2106867-NAI   McAfee Active VirusScan 2102576-NAI  McAfee Active Virus Defense SMB Edition mcafee 8.5i 8.7i企业版安装方法、步骤 1、打开mcafee大企业版下载链接https://secure.nai.com/apps/downloads/my_products/login.asp?region=cn&segment=enterprise 在授权号码中，输入上述授权码，然后提交，如图1 图片1 2、在图2中点击查看可供下载的产品。   图片2 3、然后是图3的软件选择界面，一般上选8.5i或者8.7i版本，因为大家反映8.5i稳定性较好，系统资源占用少，所以建议下载8.5i版本，如果是服务器上用，建议同时安装AntiSpyware Enterprise Module v8.5 ，也就是反间谍专家，当然这个是8.5i配套安装的。见图3 图片3 最后下载安装，一路下一步就可以了，mcafee非常强大，如果想发挥它的最大用途，请网上搜索8.5i使用教程，很多、很详细，教你如何设置mcafee。 最后再放一个离线升级包的下载地址，如果第一次安装mcafee后，无法在线更新，请下载最新的离线升级包进行第一次更新，然后就可以直接从macfee的控制台里面在线更新了，升级包大概在70-80m大小，下载后，点击里面的exe文件安装即可，mcafee离线升级包下载：http://www.mcafee.com/apps/downloads/security_updates/superdat.asp?region=cn&segment=enterprise 打开上述网址后，点datfile下面的链接下载安装即可，见图4 图片4 最终效果如图5： 图片5 http://www.okajax.com/uploads/litimg/101108/1_20201V22.gif mcafee,8.5i,授权码,注册码,企业 安全防护 北极星 未知 2010-10-02 13:18 http://www.okajax.com/a/201010/web_design.html 在国内，“前端开发”这个名词逐步被熟知，“前端开发”这个职位越来越被企业重视，表明国内的Web前端开发正在慢慢走向成熟，更好地学习提高自身的前端开发技术能力是必须的，整理9个国内优秀的前端开发设计网站给大家，也希望能看到你推荐的中文前端开发网站和社区 在国内，“前端开发”这个名词逐步被熟知，“前端开发”这个职位越来越被企业重视，表明国内的Web前端开发正在慢慢走向成熟，更好地学习提高自身的前端开发技术能力是必须的，整理9个国内优秀的前端开发设计网站给大家，也希望能看到你推荐的中文前端开发网站和社区。 1, OKAJAX   OKAJAX是以ajax技术为主，涉及网站建设、网络编程、网页设计、网页特效、服务器技术、资源下载等的综合性网站。 2, 蓝色理想   诞生于1999年10月的蓝色理想，以建设网站设计与开发人员之家为宗旨，以介绍网络开发技术与网站创作设计交流为主要内容，是国内最大的设计类站点之一。 3, W3School W3School是最完善的在线教程站，包括 XHTML教程、XML教程JavaScript & AJAX、网站构建等前端开发人员必备的系统性学习教材。 4, 前端观察   前端观察是一个纯粹的前端技术分享网站，本站的目的是为前端技术人员提供所需的资讯及资源，挖掘国内优秀的原创设计及内容，加以高度的整理。 5, CSS88   CSS88专注前端开发，关注用户体验，是一个资深的Web前端开发站，不仅传播前端技术，更重要的是关注前端设计从业者的生存状态，有多个开放的前端交流群。 6, CssRain   CssRain实用的前端技术信息，原创和搜集前端开发中细节的内容，一本jQuery新书推荐<<锋利的jQuery>>你值得拥有。 7, 我爱CSS   我爱CSS，致力于Web标准在中国的应用和发展，提供CSS和XHTML学习教程。 8, iJavaScript   iJavaScript致力于JavaScript信息的共享，提供JavaScript基础教程、AJAX技术及JavaScript框架的学习和应用。 9.菠菜博 菠菜博是一个分享优质网站设计素材资源、关注Web前端开发与应用资源的博客。 http://www.okajax.com/uploads/allimg/101002/1316215622-0_lit.jpg web,design,前端,开发,优秀 新闻咨询 北极星 未知 2010-10-02 13:13 http://www.okajax.com/a/201010/photoshop_renxiang.html 大多数的数码照片都需要进行一些后期处理，如果你想玩一玩移花接木或是变换背景的魔术，那就一定离不开抠图。许多初学photoshop的朋友都在为抠图头痛，记得笔者第一次抠图时只会用魔棒和橡皮工具，结果一张图抠下来总是头晕眼花 大多数的数码照片都需要进行一些后期处理，如果你想玩一玩移花接木或是变换背景的魔术，那就一定离不开抠图。许多初学photoshop的朋友都在为抠图头痛，记得笔者第一次抠图时只会用魔棒和橡皮工具，结果一张图抠下来总是头晕眼花。使用Photoshop抠图有两种常用的方法，一种方法是使用通道，另一种方法就是使用滤镜。使用通道进行抠图有很多的局限性，并且还是需要花费很多时间进行修饰，而使用滤镜抠图即简单快速，抠图的效果又好。Photoshop 7.0自带的抽出滤镜(快捷键Alt＋Ctrl＋X)就是专门为抠图准备的，如果要抠取毛发或背景复杂的图片使用这个滤镜最合适不过了。   　　下面我们通过一个实例来学习使用抽出滤镜抠图的方法，在开始之前要提醒大家一句，使用抽出滤镜后会直接删除图片上被抠取部分以外的像素，为了稳妥起见，最好在使用抽出滤镜前复制图层。运行Photoshop后打开一张图片，选择滤镜菜单中的抽出命令，打开抽出滤镜控制窗口，如(图1)所示。可以看出这张图片背景复杂，人物和背景同为红色调，还有一条麻烦的羽毛围巾。     　　我们再来看看抽出滤镜的控制窗口，左侧是工具栏，右侧是控制栏。在抽出滤镜窗口中激活边缘高光器，并勾选智能高光显示复选框。按照(图2)所示勾选出人物的部分轮廓。智能高光显示是一项非常实用的功能，可以非常精确的选取人物与背景色对比较强烈的部分。接下来取消智能高光显示复选框的勾选，选择合适的画笔尺寸，勾选头发与围巾部分。要注意画笔尺寸不能太大否则一些我们需要保留的部分也会被去掉，并且高光部分要同时包括人物轮廓的内部和外部。如果高光部分过大可以使用橡皮工具擦除一部分高光，总之要确保人物轮廓选取的精确。最后使用填充工具对要抠取的部分进行填充，如(图3)所示。按下OK按钮，就是这么简单人物部分被完美的抠取出来。对背景层进行填充可以更好的观察抠图的效果，如(图4)所示。     　　如果在前面的操作中选取的高光部分过多，就会造成人物上想保留的一些部分也被删除。即使前面没有复制图像也有办法进行补救，激活橡皮工具后按下Alt键，使用历史记录橡皮就可以对人物或背景的一部分进行恢复。     　　除了前面介绍的抽出滤镜，Photoshop还有一些专门用于抠图的外部滤镜，如knockout和MaskPRo等。同抽出滤镜相比，它们的功能更加强大，抠图的效果也更好，感兴趣的朋友可以试一试。但是大家不要因为有了抠图滤镜就不去学习手工抠图的方法，有些时候基本功更加重要。 http://www.okajax.com/uploads/allimg/101001/235040Ic-0_lit.jpg photoshop,人像 图形图象 北极星 未知 2010-10-01 23:48