jQuery 选择器返回的对象的完整 HTML
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3535284/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
full HTML of object returned by jQuery selector
提问by mikkelbreum
given this html:
鉴于此 html：
<li id="the_list_item"><img src="some_img"></li>
and this selectior:
和这个选择器：
$("#the_list_item")
I want to get the full html from the object return by the jQuery selector.
我想从 jQuery 选择器返回的对象中获取完整的 html。
Using:
使用：
$("#the_list_item").html()
...just gives me the inner html (the <img src="some_img">part)
...只是给我内部的html（<img src="some_img">部分）
But since:
但由于：
$("#the_list_item").attr("id")
gives me 'the_list_item', this indicated that the whole list item is indeed included in the object returned.. so how do I get the full code from that object?
给我'the_list_item'，这表明整个列表项确实包含在返回的对象中..那么我如何从该对象获取完整代码？
I want to get a String: <li id="the_list_item"><img src="some_img"></li>from my object, but can't find the way to do it.
我想<li id="the_list_item"><img src="some_img"></li>从我的对象中获取一个 String: ，但找不到方法。
回答by Tatu Ulmanen
I'm not sure if this works, but it might be worth a shot:
我不确定这是否有效，但可能值得一试：
var html = $('#the_list_item')[0].outerHTML;
alert(html);
var html = $('#the_list_item')[0].outerHTML;
console.log(html);<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
<li id="the_list_item"><img src="some_img"></li>
</ul>回答by Ken Redler
One way is to create your own wrapper:
一种方法是创建自己的包装器：
$("#the_list_item").wrap('<div>').parent().html();
...do your thing, then unwrap:
...做你的事，然后解开：
$("#the_list_item").unwrap();
回答by Becasita
Leaving just in case someone nowadays is still looking for this.
Full jQuery solution:
离开以防万一现在有人仍在寻找这个。
完整的jQuery解决方案：
$('#the_list_item').prop('outerHTML');
回答by user3815508
Here my solution, No jQuery required!
这是我的解决方案，不需要 jQuery！
// Get a reference to the element by its ID.
var oEl = document.getElementById('the_list_item');
// Getting the outerHTML of an element:
var sOuterHTML = oEl.outerHTML;
alert( sOuterHTML );
Alternatively, it could be get the reference of element by means of jQuery, and then get the outerHTML.
或者，也可以通过jQuery获取元素的引用，然后获取outerHTML。
var sOuterHTML = $('#the_list_item')[0].outerHTML;
alert( sOuterHTML );
// or
var sOuterHTML = $('#the_list_item').get(0).outerHTML;
alert( sOuterHTML );
回答by user1185554
Unfortunately, the outerHTML solution (accepted solution above) did not work for me on FireFox 9 / Windows 7 / JQuery 1.7 ...
不幸的是，outerHTML 解决方案（上面接受的解决方案）在 FireFox 9 / Windows 7 / JQuery 1.7 上对我不起作用......
Here is something that worked for me, according to Chetan Sastry (answer above):
根据 Chetan Sastry（上面的答案）的说法，这里有一些对我有用的东西：
var el = jQuery('#the_list_item').first();
var outerHtml = jQuery('<div>').append(el).html();
回答by codersarepeople
There's no "outer html" equivalent in jQuery, but this might help: http://jquery-howto.blogspot.com/2009/02/how-to-get-full-html-string-including.html
jQuery 中没有“外部 html”等价物，但这可能会有所帮助：http: //jquery-howto.blogspot.com/2009/02/how-to-get-full-html-string-including.html
回答by KeatsKelleher
Have you tried $("#the_list_item").parent().html()?
你试过$("#the_list_item").parent().html()吗？
回答by Otto Kanellis
Creating a new div DOM object and appending a clone of the div, then get the contents of wrapped div and finally removing the created DOM object.
创建一个新的 div DOM 对象并附加一个 div 的副本，然后获取包装的 div 的内容，最后删除创建的 DOM 对象。
var html = $('<div>').append($('#the_list_item').clone()).remove().html();
回答by davehauser
Here you can find a nice solution in the form of the code for a jQuery outerHtml plugin: http://yelotofu.com/2008/08/jquery-outerhtml/
在这里，你可以找到在一个jQuery插件outerHtml代码的形式很好的解决方案：http://yelotofu.com/2008/08/jquery-outerhtml/
回答by Chetan Sastry
There are plugins for that. Just google for "jQuery outerhtml". The idea behind most of them is to clone the element, append it to an empty div and get that div's html.
有插件。只需谷歌搜索“jQuery outerhtml”。他们中的大多数人背后的想法是克隆元素，将其附加到一个空的 div 并获取该 div 的 html。
