有谁知道DOM检查器JavaScript库或插件?

时间:2009-04-12 18:55:56

标签: javascript jquery html dom

有没有人知道DOM检查器javascript库或插件?

我想在我正在创建的网站中使用此代码,我搜索了很多但没找到我想要的除了这个:http://slayeroffice.com/tools/modi/v2.0/modi_help.html

更新 似乎没有人理解我的问题:(我想找一个让我实现DOM检查器的示例或插件。我不想要一个工具来检查DOM;我想写我自己的。

11 个答案:

答案 0 :(得分:7)

我也在寻找相同的东西,除了http://slayeroffice.com/tools/modi/v2.0/modi_help.html我发现:http://www.selectorgadget.com/https://github.com/iterationlabs/selectorgadget/

还遇到了这个https://github.com/josscrowcroft/Simple-JavaScript-DOM-Inspector

不幸的是我没有找到任何基于jQuery的东西。但是“Javascript DOM Inspector”似乎是寻找此类事物的正确关键词。

答案 1 :(得分:5)

Firebug Lite怎么样 - 它就像Firebug,但是你将它插入你的页面,这样你就可以在大多数浏览器(包括非FF浏览器)上调试你的html,css,Javascript和DOM < / p>

答案 2 :(得分:5)

Aardvark正式是一个firefox扩展,但您也可以将其用作javascript库。所述网站中的内联演示使用javascript实现。挖掘代码&amp;你会找到引导Aardvark模块的loader.js

答案 3 :(得分:5)

我找到了这个: http://userscripts.org/scripts/review/3006

这个也很好:

DOM Mouse-Over Element Selection and Isolation

使用几行代码非常简单,只需编辑一些内容就可以得到我想要的东西。

答案 4 :(得分:2)

Firebug是Firefox的一个很好的解决方案。您可以浏览页面的HTML,JavaScript,DOM,网络活动等.Safari还内置了相当不错的工具(我目前正在使用Safari 4测试版),尽管我发现在Firebug中导航更容易。

答案 5 :(得分:2)

最近,我需要使用JavaScript开发应用程序:当任何用户点击此网站的图像时,它会将图像URL发送到特定位置。以下是帮助我实现这一目标的文章:AspBoss - Javascript Library for Dom Inspector

这是the code

// DOM Inspector
// version 0.1
// 2006-01-25
// Copyright (c) 2006, Onur Mat
//
// --------------------------------------------------------------------
//
// This user script allows you to interact with elements of a web page
// by moving mouse pointer on a web page and clicking on selected elements.
//
// To install for Firefox, you need Greasemonkey: http://greasemonkey.mozdev.org/
// Then restart Firefox and revisit this script.
// Under Tools, there will be a new menu item to "Install User Script".
// Accept the default configuration and install.
//
// To install for Internet Explorer, you need Turnabout:
// http://www.reifysoft.com/turnabout.php
// See instructions for using Turnabout here:
// http://www.reifysoft.com/turnabout.php
//
// --------------------------------------------------------------------
//
// ==UserScript==
// @name          DOM Inspector
// @namespace     http://www.dominspector.com/
// @description   Inspect DHTML DOM elements interactively
// @include       *
// ==/UserScript==

function DIOnMouseOver(evt)
{
    element = evt.target;   // not IE

    // set the border around the element
    element.style.borderWidth = '2px';
    element.style.borderStyle = 'solid';
    element.style.borderColor = '#f00';
}


function DIOnMouseOut(evt)
{
    evt.target.style.borderStyle = 'none';
}


function DIOnClick(evt)
{
    var selection = evt.target.innerHTML;

    alert('Element is: ' + evt.target.toString() + '\n\nSelection is:\n\n' + selection);
    return false;
}


document.addEventListener("mouseover", DIOnMouseOver, true);
document.addEventListener("mouseout", DIOnMouseOut, true);
document.addEventListener("click", DIOnClick, true);

答案 6 :(得分:0)

是的,有很多。例如,Firefox有 DOM Inspector Firebug X-Ray。我认为Firebug是这三者中最好的一个。

答案 7 :(得分:0)

IE8上的开发者工具

答案 8 :(得分:0)

试试Backbase Debugger Application。它还有一个I / O检查器。

答案 9 :(得分:0)

我曾经一直使用Firebug和Firefox,现在感谢IE8,它有一个非常酷的工具叫做开发工具---它可以让你看到所有的Javascript,CSS以及真正很酷的调试功能。 MICROSOFT即将到来!

答案 10 :(得分:0)

一位同事向我推荐了这个:Web X-Ray Goggles https://secure.toolness.com/webxray/