将字符串解析为非XML HTML5而不加载后裔元素

SO上有这个问题的多个版本，但他们都没有真正理解我想要做的事情。当启用JavaScript时，浏览器将noscript元素的内容视为未分离的文本。我使用该元素来提供我网站的所有内容，但对于那些拥有JavaScript的用户，我使用AJAX加载内容。将字符串解析为非XML HTML5而不加载后裔元素

...但后来我想，为什么当所有的内容都在noscript的附加请求与AJAX？我会尝试从noscript元素中的字符串中取出我需要的部分。起初，我尝试这样做：

do_stuff_with($($("noscript").text()))

但我很快发现，该方法立即导致浏览器做出分析的字符串中的所有替换元素（图像等）的请求。（我假设jQuery将它添加到DOM以解析它。）然后我浏览了$ .parseXML（），但很快让这个想法变成了因为标记不是XML（它是非XML格式的HTML5）。

有没有一些方法可以让樱桃从字符串中挑选元素而不做不必要的HTTP请求？

来源

2011-09-28 kojiro

我相信没有办法使用jQuery解析HTML，而无需将其添加到DOM。但是，如果您愿意得到一点俗气，可以在分析它之前通过修改noscript源来避免请求不需要/不需要的资产。

HTML

<noscript> 
    <span class="name">Mr. Smith</span> 
    <img src="/images/02938/avatar.jpg" /> 
    <span class="age">27</span> 
</noscript>

jQuery的

// Load raw content, make sure it's wrapped in a single node 
raw = '<div>' + $('noscript').text() + '</div>'; 

// "Fix" any elements that might reference external resources by 
// turning them into invalid HTML tags. 
raw = raw.replace(/img/g, 'cheese'); 

dom = $(raw); 

// Now we can access our variables without unnecessary resource requests 
name = dom.find('.name').text(); 
age = dom.find('.age').text();

来源

2011-09-28 18:09:39

我喜欢这种方法几乎和我喜欢的奶酪一样。那这个呢？ 'raw.replace（/ src = ['“]/g，”data-deferred- $ &");'，这个（如果我写的是正确的）会把'img'作为'img'，但是替换它的'src'属性与'data-deferred-src'具有相同的值。思考？ – kojiro

我说，如果它有效，请继续做下去:)。在Chrome中，您可以打开Network选项卡上的调试器，并使用类似http://jsfiddle.net/ACECK/的内容来确保它不会加载任何图像。 –

我在这里提出了另一个答案，因为它会做我想要的更有效，但我认为这是我问的问题的最佳答案。 – kojiro

我的一位同事谁没有或不想的SO帐户描述的解决方案，我认为是值得记录在这里。虽然它没有回答如何解析任意HTML5而没有立即提出请求，但它可能是我将要使用的解决方案。

说的同事的建议是把我的每个包含在单独的noscript元素。因此，我不需要用一个单独的长字符串解析整个内容，而只是解析我将要显示的元素。在这种情况下，如果他们在分析时开始加载图像和资源，那就好了。

现在看起来很简单...

来源

2011-09-29 14:34:29 kojiro

将字符串解析为非XML HTML5而不加载后裔元素

回答

相关问题