javascript 如何使用jQuery将元素转换为字符串
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9176528/
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
How to transform element to string with jQuery
提问by Fisher
I don't need innerHTML i need innerHTML withenclosing tags. Lets write some example:
我不需要innerHTML，我需要带有封闭标签的innerHTML 。让我们写一些例子：
<div id="1" style="qwe"><span class="1"></span></div>
<div id="2" style="asd"><span class="2"></span></div>
<div id="3" style="zxc"><span class="3"></span></div>
I can get element by id:
我可以通过 id 获取元素：
$("#1")
And how can i get string like that:
我怎样才能得到这样的字符串：
<div id="1" style="qwe"><span class="1"></span></div>
Of course html() doesn't work becouse it will return only span.
当然 html() 不起作用，因为它只会返回跨度。
采纳答案by meo
you could do something like this:
你可以做这样的事情：
alert( $('#\31 ').wrap("<div />").parent().html() )
$('#\31 ').unwrap()
回答by James Hill
Something like this should work fine:
像这样的事情应该可以正常工作：
jQuery.fn.outerHTML = function(s) {
return s
? this.before(s).remove()
: jQuery("<p>").append(this.eq(0).clone()).html();
};
var outer = $("#1").outerHTML();
Here's a working fiddle.
这是一个工作小提琴。
Additional Info
附加信息
See http://www.yelotofu.com/2008/08/jquery-outerhtml/for original article .
有关原始文章，请参阅http://www.yelotofu.com/2008/08/jquery-outerhtml/。
回答by Mathias Bynens
Use this jQuery plugin: https://github.com/brandonaaron/jquery-outerhtml/blob/master/jquery.outerhtml.js
使用这个 jQuery 插件：https: //github.com/brandonaaron/jquery-outerhtml/blob/master/jquery.outerhtml.js
/*! Copyright (c) 2006 Brandon Aaron ([email protected] || http://brandonaaron.net)
* Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
* and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
*/
(function($){
var div;
$.fn.outerHTML = function() {
var elem = this[0],
tmp;
return !elem ? null
: typeof ( tmp = elem.outerHTML ) === 'string' ? tmp
: ( div = div || $('<div/>') ).html( this.eq(0).clone() ).html();
};
})(jQuery);
Use it as follows:
使用方法如下：
$('#some-element').outerHTML();
回答by Ben
You can use outerhtmlbut in JavaScriptover the DOMand not jQuery, for example:
您可以在and not 上使用outerhtmlbut ，例如：JavaScriptDOMjQuery
var text = document.getElementById('hello').outerHTML;
jsbin code to demonstrate: http://jsbin.com/obutul/edit#javascript,html,live
jsbin 代码演示：http://jsbin.com/obutul/edit#javascript,html,live
回答by wheresrhys
outerHTML is implemented across nearly all browsers now (including old versions of ie - firefox is the only one dragging its feet, but it's scheduled for v11), so I've adapted @James Hill's answer to use this native functionality where present as it should be more efficient.
现在几乎所有浏览器都实现了 externalHTML（包括旧版本的 ie - firefox 是唯一一个拖着脚的浏览器，但它计划用于 v11），所以我已经调整了@James Hill 的答案，以便在它应该出现的地方使用这个本机功能更有效率。
jQuery.fn.outerHTML = function(s) {
return this[0].outerHTML ? this[0].outerHTML :
s ? this.before(s).remove()
: jQuery("<p>").append(this.eq(0).clone()).html();
};
var outer = $("#1").outerHTML();
Be aware though that there are a few cross-browser inconsistencies in outerHTML (e.g look at this pagein chrome and compare with ie)
请注意，outerHTML 中存在一些跨浏览器的不一致（例如，在 chrome 中查看此页面并与 ie 进行比较）
回答by Sirko
回答by Jashwant
You can wrap the desired div in another div and then fetch the parent div's html.
您可以将所需的 div 包装在另一个 div 中，然后获取父 div 的 html。
<div><div id="1" style="qwe"><span class="1"></span></div></div>
<div><div id="2" style="asd"><span class="2"></span></div></div>
<div><div id="3" style="zxc"><span class="3"></span></div></div>
Now,
现在，
$("#1").parent().html()will fetch the desired string.
$("#1").parent().html()将获取所需的字符串。
