将字符串解析为非XML HTML5而不加载descendent-elements

时间:2011-09-28 17:34:23

标签: jquery html5 html-parsing noscript

这个问题有多个版本,但它们都没有真正触及我想要做的事情的核心。启用JavaScript后,浏览器会将noscript元素的内容视为未解析的文本。我正在使用该元素来提供我网站的所有内容,但是对于那些有JavaScript的人我使用AJAX加载内容。

...但后来我想,为什么当所有内容都在noscript时,用AJAX发出额外请求?我会尝试从noscript元素中的字符串中获取我需要的部分。起初我试过这个:

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

但我很快发现该方法会立即让浏览器对解析后的字符串中的所有替换元素(图像等)发出请求。 (我假设jQuery将它添加到DOM中以便解析它。)然后我瞥了一眼$ .parseXML(),但很快就让这个想法消失了,因为标记不是XML(它是非XML形式的HTML5)。

有没有什么方法可以从字符串中挑选元素而不会产生不必要的HTTP请求?

2 个答案:

答案 0 :(得分:1)

我相信没有办法用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();

答案 1 :(得分:1)

我的一位没有或想要SO帐户的同事描述了我认为值得记录的解决方案。虽然它没有完全回答如何在不立即请求的情况下解析任意HTML5,但它可能是我将要使用的解决方案。

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

现在看起来很简单......