【问题标题】:document.getElementsByTagName("*") Or document.alldocument.getElementsByTagName("*") 或 document.all
【发布时间】:2011-01-06 22:43:54
【问题描述】:

document.getElementsByTagName("*") 适用于 IE/Firefox/Opera,但不适用于 Chrome 和 Safari。

document.all 适用于 IE/Chrom/Safari,但不适用于 Firefox。

我该如何处理?

【问题讨论】:

  • 你到底想做什么?可能有更好的方法来解决实际问题,而无需使用其中任何一种。

标签: javascript google-chrome firefox dom cross-browser


【解决方案1】:

试试这样:

if (document.all !== undefined)
{
   allElements = document.all;
}
else
{
   allElements = document.getElementsByTagName("*");
}

或更短的版本

allElements = document.all ? document.all : document.getElementsByTagName("*");

【讨论】:

  • 我刚刚检查过,它可以在 Chrome 上运行,我敢打赌它也可以在 Safari 上运行。
  • "works" 是相对的——我在试图获取文档的所有后代元素时遇到了这个问题……在 Android/Chrome WebKit 中我正在获取所有文档级别的子项(html/head/body ) 另一方面,当执行 document.getElementsByTagName("") 以及 document.all 时,document.body.getElementsByTagName("") 返回作品(无 html/head/body)错误或功能,你来评判
  • 请注意,document.all 在 Chrome 上的计算结果为 false。您需要执行类似document.all !== undefined 之类的操作,或者对于简短版本,'all'in document
【解决方案2】:

document.getElementsByTagName() 在所有现代浏览器(比 IE5 更新的所有浏览器)中都能完美运行。

如果它在 Chrome 或 Safari 中似乎不起作用,那么很可能只是您在其他地方遇到的错误的症状。

【讨论】:

    【解决方案3】:

    我承认今天可能有一些我不知道的技术允许以跨浏览器格式完成这类事情,但我过去一直必须这样做的方式是检查您正在使用的浏览器。

    不过,一个更简单的解决方案是尝试运行其中一个,如果没有得到任何/null/错误,请使用另一个。

    无论如何,如果你真的不想自己处理它,你应该使用一个可以为你处理它的库(例如,jQuery)。

    【讨论】:

      【解决方案4】:

      虽然我不鼓励你做一个 document.all 因为这意味着你正在做很多不需要的客户端解析,但我确实知道那里有很多遗留的东西等等。我想在 document.all 的包装方法上发表我的想法的一点扩展。

      document.all = document.all || function(){
         return document.getElementsByTagName("*");
      };
      

      当然,这假设您有一个 getElementsByTagName 函数,应该就是这样。

      【讨论】:

      • 请注意,document.all 在 Chrome 上的计算结果为 false。您需要执行document.all !== undefined 之类的操作,或者使用简短版本'all'in document 来检查它是否存在。
      • 这不是真的。 'all' in documentdocument.all 完全相同。在 Chrome 中如何评估为 false?
      【解决方案5】:

      没有足够的代表来评论@Khurram Hassan 的回答,我会把它和我对原始问题的回答一起放在这里。

      首先,原始问题。我的解决方案是(并且在我自己的代码中,等待我在这个网站上提出的问题的答案)document.getElementsByTagName("*"),它实际上确实获得了 Chrome 上的每一个元素。我在 Google Chrome 上的 google.com 上进行了测试,加载了一个配置文件并列出了八个最常访问的网站,结果是 356 个带有标签名称的单独元素。公平地说,这包括 html、head、body 和其他可能没用的东西,但它仍然得到了它们。我目前无法访问 Opera,但由于 Chrome 仍然接受那段 JavaScript,我看不出它在你的代码中不接受它的原因。

      其次,对于@Khurram hassan,document.getElementById() 在这种情况下不能使用。我刚刚在 Chrome 上对其进行了测试,它得出了一个 null 值。理论上,在这种情况下,可能会使用具有一般形式 getElementsBy* 而不是 getElementBy* 的任何东西。因此,要添加到我之前的答案,您还可以尝试 ClassNameNameTagNameNS,具体取决于您要执行的操作。在与之前相同的页面上,我测试了这三个,虽然只有 TagNameNS 有效,但其余的只是返回空列表,而不是错误。

      此外,如果您的代码中确实不需要<!DOCTYPE html>,也许您可​​以将工作代码发布为您的答案的编辑,以便我们可以看到它。据我所知,<!DOCTYPE html> 似乎是启动 HTML 页面的普遍接受(并且通常被认为是强制性的)方式。如果没有必要,那将是新信息(至少对我而言),可能在调试或非公开网页中有用。

      【讨论】:

        【解决方案6】:

        document.all 应避免使用,因为它不符合标准。相反,您可以将 document.getElementById() 用于特定节点或使用 $("*") 用于使用 jQuery 选择所有元素。

        但是,如果您仍然想使用 document.all,请确保从您的页面中删除 <!DOCTYPE> 标签,以及从您的 <html> 标签中删除 xmlns 属性。

        更改如下:

        <!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">
        

        收件人:

        <html>
        

        我已经在 FireFox 19.0.2 上对其进行了测试,document.all 对我来说效果很好。

        原因:当您使用 &lt;!DOCTYPE&gt; 标签时,您是在告诉浏览器您的网页符合标准,该标准告诉您不要在脚本中使用 document.all,因此浏览器也不允许。

        但是当你想使用它时,你显然没有遵循标准,所以甚至不要费心添加&lt;!DOCTYPE&gt;标签,否则document.all将不起作用。

        【讨论】:

        • 你是认真的吗? document.getElementById() 如何用于选择所有元素?为什么您认为删除 doctype 是个好主意?
        • 只是为了一笑而过,尝试在这个网站上使用 document.all(它有一个 doctype)并告诉我们会发生什么。
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2021-08-14
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2010-12-23
        相关资源
        最近更新 更多