Question

首先让我说我不是100％处理这个问题的方式是正确的，但无论如何......

我正在将HTML从文件加载到字符串中 - 并将该字符串放在jquery对象中。

我的HTML（示例）：

<!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>
         ...
    <link href="template.css" rel="stylesheet" type="text/css" />
    </head>
    <body>

     <img src="img.png"/> 

     ...

     </body>
</html>

以上是一个名为htmlstr：

的变量

var htmlstr = theFunctionThatLoadsMyHTMLString();
$html = $(htmlstr);

现在，我将浏览HTML并在将其放入iframe之前尝试进行一些更改。

这适用于图像：

 $html.find("img").each(function(){
      // do something
 });

但是，当我尝试访问LINK标记（更改css href）时，它找不到“链接”。

 $html.find("link").each(function(){
      // do something
 });

为了尝试调试问题，我写了这段代码：

$html.find('*').each(function(index){
    addline(index+': '+this.tagName+'');
});

它打印出为每个元素找到的HTML标记（addline是一个执行此操作的函数）。这就是我得到的：

0: IMG
1: DIV
2: DIV
....

所以看起来好像它出于某种原因可能会在BODY中出现，而忽略了标题？

我在这里做错了什么？

我不会撒谎，我不是100％肯定$（'代码在这里'）如何在jQuery中工作..飞行的盲目。

Answer 1

此处可能存在特定于浏览器的效果。 jQuery docs说

传递复杂的HTML时，某些浏览器可能无法生成DOM 它完全复制了提供的HTML源代码。如上所述，我们使用浏览器的.innerHTML属性，用于解析传递的HTML和插入它进入当前的文件。在此过程中，某些浏览器过滤掉某些元素，例如<html>，<title>或<head> 元素。结果，插入的元素可能不具有代表性传递的原始字符串。

Answer 2

在JSFiddle中重现了这个问题，发现如果知道它在数组中的位置，你实际上可以选择链接。因此，鉴于这是一个固定的HTML，您可以使用它来查找链接。但是，我无法使用任何选择器来查找它，这很奇怪......

http://jsfiddle.net/66UjW/

如果你计划使用它，你应该测试它是否存在crossbrowser问题，因为所有的浏览器可能都不会解析头部问题。

在jQuery对象中查找元素

2 个答案: