chrome点击书签栏书签_随处可以（书签）

chrome点击书签栏书签" width="403px" height="256px" style="outline: none;" />

chrome点击书签栏书签

Hooked on YUI? You can now take it anywhere you go. The thing is Yahoo hosts the libraries publicly, so they are available at any time. Let's say you visit a page and you want to do something with it. Comes the YUI bookmaklet that adds a new script tag to the page pointing to utilities.js that contains all YUI utilities (DOM, Event, DragDrop, Animation, Connection...). Then just open your Firebug console and start messing with the page. The powerful toolset that YUI is, is at your disposal.

迷上了YUI ？现在，您可以随身携带它。问题是Yahoo公开托管这些库，因此它们随时都可以使用。假设您访问了某个页面，并且想要对其进行处理。随附YUI手册，该手册将新脚本标签添加到指向Utility.js的页面，该脚本包含所有YUI实用程序(DOM，Event，DragDrop，Animation，Connection ...)。然后只要打开Firebug控制台并开始弄乱页面即可。您可以使用YUI强大的工具集。

代码 (The code)

The code for the bookmarklet is really simple, just a question of adding a new script tag.

小书签的代码非常简单，只是添加新脚本标签的问题。

(function(){
    var s = document.createElement('script');
    s.src='http://yui.yahooapis.com/2.2.2/build/utilities/utilities.js';
    document.getElementsByTagName('head')[0].appendChild(s);
})()

安装 (Install)

Right-click, add to favorites, or drag to bookmarks.

右键单击，添加到收藏夹或拖动到书签。

YUI anywhere YUI随处可见

让乐趣开始(Let the fun begin)

So you go to any page, click the bookmarklet and for example decide to make the logo on the page draggable. All you need to write in your JS console (or in address bar for IE) is:

因此，您可以转到任何页面，单击书签，然后决定使页面上的徽标可拖动。您需要在JS控制台(或IE的地址栏中)中编写的所有内容是：

new YAHOO.util.DD('logo')

The result is really not bad for a one-liner. But why stop there? Let's make everything on a page draggable.

这样的结果对于单线而言确实不错。但是为什么要停在那里？让我们使页面上的所有内容都可拖动。

var all = document.getElementsByTagName('*');for(var i = 0; i < all.length; i++) {new YAHOO.util.DD(all[i])}

Whoa! We can mess up with other people's pages like we've never messed up with other people's pages before! Example:

哇！我们可以弄乱别人的页面，就像我们以前从未弄乱别人的页面一样！例：

And why only other people's pages, what about ours? Imagine you're sitting with a client or boss, showing the new site and they go: - Hmm, well, you know, I don't know about this spacing between the images here ... And you: - Hold that thought (clicking bookmarklet, making everything draggable, dragging the offending image). Is this how you prefer it? Client: - Well, maybe, or actually it was better before. You: - Ah, OK, whatever suits your business needs

为什么只有别人的页面，我们的页面呢？想象一下，您正与客户或老板坐在一起，展示新网站，然后他们走了：-嗯，嗯，您知道的，我不知道这里图像之间的间距...而且您：-保持这种想法(点击书签，使所有内容都可拖动，并拖动有问题的图片)。这是您喜欢的方式吗？客户：-也许，或者实际上以前更好。您：-嗯，好，适合您的业务需求

Update: Some more one-liners to prevent loading a new page when you attempt to drag a link or a submit button.

更新：更多的单行代码可防止您尝试拖动链接或提交按钮时加载新页面。

Disable links: YAHOO.util.Event.addListener(window, 'click', function(e){ if (e.target.nodeName.toUpperCase() == 'A'){ YAHOO.util.Event.preventDefault(e) } });

禁用链接： YAHOO.util.Event.addListener(window, 'click', function(e){ if (e.target.nodeName.toUpperCase() == 'A'){ YAHOO.util.Event.preventDefault(e) } });

Prompt before unload: YAHOO.util.Event.addListener(window,'beforeunload',function(e){ e.returnValue = "Sure?" });

卸载前提示： YAHOO.util.Event.addListener(window,'beforeunload',function(e){ e.returnValue = "Sure?" });

Tell your friends about this post on Facebook and Twitter

在Facebook和Twitter上告诉您的朋友有关此帖子的信息

翻译自: https://www.phpied.com/yui-anywhere-bookmarklet/

chrome点击书签栏书签