解析并处理作为字符串输入的DOM [英] Parse and handle DOM that came as a string input
问题描述
这是事情，
我有一个包含HTML代码的textarea（包含IDinput_container），简单的例子是：
<！doctype html>
< html>
< head>< / head>
< body>
< a href =www.example.com>另一个地方< / a>
< / body>
< / html>
如何解析它并将其作为合法的DOM使用在jQuery？
例如，要执行
$（varWithDom）.find（...）
< code $ <$ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ / strong>
我试图用jQuery解析它，但有趣的是发生了 - jQuery删除了DOCTYPE和所有HEAD，只剩下了>
< a href =www.example.com>另一个地方< / a>
我的原始方法在这里： jQuery HTML解析器正在删除一些标签而没有警告，为什么以及如何防止它？
我从来没有找到解决方案。有任何想法吗？这可能是jQuery的错误，还是什么？
解决方案如果您需要整个内容作为元素，可以尝试使用 iframe 。
//创建并追加new iframe
var iframe = document.createElement（'iframe'）;
document.documentElement.appendChild（iframe）;
//设置其innerHTML
iframe.contentWindow.document.documentElement.innerHTML = varWithDOM;
//抓住`window`
var win = iframe.contentWindow;
//删除iframe
document.documentElement.removeChild（iframe）;
演示获取头： http://jsfiddle.net/K6tR2/
原始答案
jQuery删除它不是那么多因为它是浏览器。这种行为会因浏览器的不同而有所不同。
您可能会尝试将所有内容放在< div> ，以便成为您的上下文...
$（'< div> ;'+ varWithDom +'< / div>'）。find（...）
没有什么被剥离（除非你真的需要在< head> 中）的东西，因为它将都是外部 div 。
如果你不想要，那么你需要两次查询，一次用 .find（），一次与 .filter（） ...
var els = $（varWithDom）;
var links = els.find（'a [href]'）.add（els.filter（'a [href]'））;
Here is the thing,
I have a textarea (with ID "input_container") full of HTML code, the simple example is:
<!doctype html>
<html>
<head></head>
<body>
<a href="www.example.com">the other place</a>
</body>
</html>
How can I parse it and use it in jQuery as a legitimate DOM?
For example, to do
$(varWithDom).find(...)
with that DOM?
What I already tried
I tried to parse it using jQuery but a funny thing happened - jQuery removed the DOCTYPE and all of the HEAD, and left me with nothing but
<a href="www.example.com">the other place</a>
My original method is here: jQuery HTML parser is removing some tags without a warning, why and how to prevent it?
I never found a solution yet. Any ideas? might this be a bug on jQuery or what?
解决方案 If you need the entire content as elements, you might try using an iframe.
// create and append new iframe
var iframe = document.createElement('iframe');
document.documentElement.appendChild(iframe);
// set its innerHTML
iframe.contentWindow.document.documentElement.innerHTML = varWithDOM;
// grab the `window`
var win = iframe.contentWindow;
// remove the iframe
document.documentElement.removeChild(iframe);
Demo that grabs the head: http://jsfiddle.net/K6tR2/
original answer
It isn't so much jQuery removing it as it is the browser. This behavior will vary in different browsers.
One thing you might try would be to place the entire thing in a <div>, so that becomes your context...
$('<div>' + varWithDom + '</div>').find(...)
Now it won't really matter what is stripped away (unless you actually needed something in the <head>), because it will all be descendant of the outer div.
If you didn't want that, then you'd need to do your query twice, once with .find(), and once with .filter()...
var els = $( varWithDom );
var links = els.find( 'a[href]' ).add( els.filter( 'a[href]' ) );
这篇关于解析并处理作为字符串输入的DOM的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
