.::灵狼天::. » JavaScript

如何获取 Element 的 XPath [PHP/Javascript]

icyleaf — Fri, 02 Apr 2010 03:04:20 +0000

这两天研究 HTML 的 DOM 需要寻找某个 Element 元素的完整 XPath 路径，由于使用的是 PHP Simple HTML DOM Parser 开源库，这个库类的使用方法几乎兼容 Javascript 的 DOM 语法并附带 DOM 选择器。虽然功能强大但是并不能直接获取 Element 的 XPath。这个怎么办呢，依稀记得 Firebug 有一个功能，选择某个元素在它的控制台可以显示 XPath。嗯，着手实践一下发现不仅可以显示而且还可以复制 XPath，如下图所示：于是想，如果可以找到 Javascript 版的相关代码就一定可以改成 PHP 版本的，结果在 Google 的新家搜索找到了... ba635bdf3302088d6b03e19c76214100002 PHP 改进版： ba635bdf3302088d6b03e19c76214100003 大家同样可以把上面的代码直接 crack 到 PHP Simple HTML DOM Parser 库中。

jquery Selectors：让你迅速了解 jquery

icyleaf — Tue, 18 Nov 2008 02:40:52 +0000

jquery 作为一个风靡流行 JavaScript 框架，一直在互联网开发做着重要的角色，其实它上手也很简单，今天在订阅的 Gr 发现了这个 labs 性的 jquery Selectors。打开这个页面，你会看到在左侧有很多的 jquery 选择器，大家可以通过点击各种的按钮可以在右侧清楚的看到实现选择了那个元素。同时还配有文档说明，很棒的教学学习资料：）如果你想给离线的朋友使用，那也没有关系，它提供了源码的下载，就在右侧的顶部（点击这里也可以下载）。看到它这样页面的顶部信息让我有发现了两个很不错 jquery 学习资料网站：LearningjQuery | codylindley。 BTW，人家顶部信息说了：FYI (ie6 != supported)，难道你还在用 IE6 开发么? XD

Blackbird：JavaScript调试，对alert说拜拜

icyleaf — Wed, 15 Oct 2008 09:07:41 +0000

最近就在用 JavaScript 写公司系统的报表文件生成编辑器工具。调试的头胀闹大的。尤其是加入 alert() 调试框，一不小心就会进入慢长的循环，点不掉的 alert 框...幸好在 webappers 发现了 Blackbird 提供一种非常酷的 JavaScript 调试信息显示方法。直接让我告别了 alert() 时代。:) Blackbird 支持当前的主流版本浏览器（IE 6+，Firefox 2+，Safari 2+，Opera 9.5），可以区别输入 debug，info，warn，error，profile。同时可以通过热键来控制显示/隐藏，情况记录调试信息等操作！使用方法也很简单，加载 js 和 css 文件并加载到 header 区域，直接使用就可以输出调试信息： ba635bdf3302088d6b03e19c76214100005 演示：http://www.gscottolson.com/blackbirdjs/ 下载：当前版本 blackbirdjs v1.0

Devunity：随心所欲在线编程

icyleaf — Tue, 07 Oct 2008 03:53:48 +0000

Devunity 是一个极具创意性的在线编程服务网站，使用它就像是在使用系统的文本编辑器一样，支php，Python，Javascript，Perl，Html，Asp，Css，Ruby语言语法高亮，行数显示，支持 Tags。最大的特性还属创建项目，从SVN服务导入代码，支持多种服务的API（如 Twitter，Flickr，BOSS，Google Apps Engine,，Digg，Facebook等等）接口编程到团队协作，添加 Todos。 Devunity 是TechCrunch 最新评出来的 TC50 之一。目前这个服务还属于开发当作，之前只是申请才能获得邀请，过了一个10.1终于给了邀请，碰巧通过内测用户邀请是可以直接申请到用户，所以，如果你想尝试一下，留下你的 Email 地址吧:)

图片保护脚本：dwProtector

icyleaf — Mon, 11 Aug 2008 07:49:16 +0000

网站的图片保护是一个热门话题，为什么呢？你想想如果您辛辛苦苦花了两个小时设计出来个设计，你会希望它被别人无情的PS，修改做别人的东西吗？当然是被允许的，这就是dwProtector产生的原因。 dwProtector是基于mootools开发的插件。那么，dwProtector的功能强度有多大呢，看下面列表：守护右键“（图片）另存为”（"Save Image As"）守护右键“背景图片另存为”（"Save Background As"）守护拖拽图片到桌面甚至是守护右键在线功能演示：http://davidwalsh.name/dw-content/image-protector.php 里面的图片很凶猛哦... 核心代码： ba635bdf3302088d6b03e19c76214100009 通过上面的代码可以发现，用户虽然可以上面的方法保存图片，不过下载下来的图片只是我们函数里面替换掉的blank.gif。使用方法： 1. 下载mootools和dwProtector以及空的替换图片blank.gif，下载后放置在网站合适的位置。 2. 把下面代码插入到全局的头部文件中(）： ba635bdf3302088d6b03e19c76214100010 3.在你的图片加入 class="protect"（可以通过步骤2修改保护图片标记），如： ba635bdf3302088d6b03e19c76214100011 作者在结尾声明，对于查看网页源文件或其他方法还是可以很轻松的获得图片的地址，而且我还尝试用选中图片，复制，粘贴在富文本编辑器下面也是可以显示的...不过作者目前还在想办法解决这方面的问题，让我们一起为作者加油吧！

网络开发者调试工具小盘点

icyleaf — Tue, 05 Aug 2008 09:01:52 +0000

无论是什么样的开发者都必不可缺少的就是调试，当然本篇介绍的工具均是适用于网络开发者，我按照软件平台的不同分了几类：Firefox扩展类，IE插件类，书签工具类，JavaScript类，当然还有其他类等。其中之前介绍的5个最棒的Firebug扩展可以分在Firefox扩展类，其他本篇将主要介绍剩下的两个分类的调试工具。书签工具类所谓书签工具类，实际上就是通过点击书签就可以实现运行调试工具的方法类别。安装方法也非常的简单，对于FireFox用户，直接把指定保存书签的按钮（或链接）拖拉到书签工具栏；对于IE用户，在指定保存书签的按钮（或链接）右键，选择“添加到收藏夹“。使用的时候，直接点击那个书签即可运行调试工具。 XRAY （支持IE6+/Firefox/Safari/Camino）简单的DOM查看器，运行后点击网页的元素，弹出的窗口会显示相关的DOM信息。不过要注意对于查看的元素是链接是无法查看的。因为....因为...浏览器直接就跳转到你点击了那个链接上去了... Firebug Lite （支持IE6+/Firefox/Safari/Opera）没错，Firebug的作者为了让不同浏览器的开发者都能用到Firebug，精心打造了这个JavaScript版本，此版本实现了fx扩展的大部分功能。强烈推荐哦，哈哈。 ReCSS （支持IE6+/Firefox/Safari）功能是重载CSS，其实看名字也会了解，主要是为了在修改CSS后，同时在不重新加载网页内容的情况下达到重载CSS后的效果。简单的说只节省调试时间，要不每次都是全部重载所有的资料多浪费时间啊～ Layout Grid Bookmarklet （支持IE6+/Firefox/Safari/Opera）标尺工具，可以让你的网页背景变成一个标尺，提供的版本比较多（固定版和浮动版），大家使用时需要多看看，标尺长宽为1000x1000像素。 JavsScript类 Firebug Lite （支持IE6+/Firefox/Safari/Opera）没错，它不仅提供书签工具版也提供JavaScript版本，直接把下面的代码放在你要调试的网页里面就可以啦。 Pi.debugger 直接点上面的链接吧，那个是我之前专门介绍的文章XD IE插件类如果你使用的是IE8就算了，就跳过本类别吧:)另外这个类别不做重点简单介绍，因为网上这样的文章太泛滥了。首先我要介绍和推荐的是微软自己出的Visual Web Developer，免费产品，功能还蛮不错，再者就是收费产品IE WebDeveloper，这个其实我还是蛮喜欢的，网上破解/注册版一片，我就不多说。其他的还有IEDevToolBar。

编写即运行：JavaScript在线版

icyleaf — Fri, 27 Jun 2008 01:34:01 +0000

Obsessing 是一个刚发布的在线javascript编辑器，最大的特点就在于编写后，点击顶部的“Run”按钮，就能运行你做编写的Javascript代码，而且在“Run”按钮的右边还有一个代码的差错功能，通过下面的截图也能看到。这个服务提供用户注册，注册之后享受的功能会更多，打开，保存，导入，导出..... 不过目前还处于一个测试预览阶段，可能会有一些bug存在，例如你编写：alert("Hello World");之后就会不断的弹出内容是“Hello World”的提示框.... 整体的界面很不错，我需要向它学习，努力争取把代码墙完善的更好:)

jsvi：文本编辑器VI的在线版！

icyleaf — Fri, 09 May 2008 02:16:30 +0000

Vi是Linux（Unix）下默认的文本编辑，也是非常出色的一个。在lifehacker上面评出来5个最受欢迎文本编辑之一。不过这次的主角并不是vi，而是在Webware横行的今天，一款克隆vi界面甚至是命令和操作均一样的浏览器版横空出世，那就是jsvi（我这里登录不上去，貌似被和谐掉了），这是一个用javascritp编写的，体积也不大，82kb而已。为了保证大家能够正常体验，我就无耻的把jsvi剽窃到了我的网站上面，说剽窃主要是因为其实本身它并没有提供下载，我通过源代码获取的核心文件。下面大家可以尝试下，如果你没有用过vi，可以先搜索下vi的命令都有哪些，如何进行操作，否则体验也是白搭。体验在线版Vi：点击这里源码下载：Download@纳米盘

Pi.Debugger：随时调试你的网页代码

icyleaf — Mon, 14 Apr 2008 03:18:21 +0000

pi.debugger 是用JavaScript编写而成的网页代码调试工具，其界面类似于FireFox浏览器的FireBug，如下图：而且这个JavaScript不依赖任何的库，为压缩在整个的体积也才40Kb而已，适用于IE6/IE7,OPERA 9.2, WEBKIT/525.1, FIREFOX 2浏览器平台，这个工具可谓给非Firefox的开发者提供了便利和时间。那么我们就亲自操作一下他吧～效果是不是很酷，也也方便，而且安装起来也非常的简单，只需要在网页之间加入如下代码即可： ba635bdf3302088d6b03e19c76214100013