[英]How to transform element to string with jQuery
我不需要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>
我可以通过id获取元素:
$("#1")
我怎么能得到这样的字符串:
<div id="1" style="qwe"><span class="1"></span></div>
当然html()不起作用因为它只返回span。
你可以这样做:
alert( $('#\\31 ').wrap("<div />").parent().html() )
$('#\\31 ').unwrap()
像这样的东西应该工作正常:
jQuery.fn.outerHTML = function(s) {
return s
? this.before(s).remove()
: jQuery("<p>").append(this.eq(0).clone()).html();
};
var outer = $("#1").outerHTML();
这是一个工作小提琴 。
附加信息
有关原始文章,请访问http://www.yelotofu.com/2008/08/jquery-outerhtml/ 。
使用这个jQuery插件: https : //github.com/brandonaaron/jquery-outerhtml/blob/master/jquery.outerhtml.js
/*! Copyright (c) 2006 Brandon Aaron (brandon.aaron@gmail.com || 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);
使用方法如下:
$('#some-element').outerHTML();
您可以在DOM
使用outerhtml
但在JavaScript
使用而不是jQuery
,例如:
var text = document.getElementById('hello').outerHTML;
jsbin代码演示: http ://jsbin.com/obutul/edit#javascript,html,live
html元素上还有一个outerHTML属性,它包含所选元素本身。
现在几乎所有的浏览器都实现了outerHTML(包括旧版本的ie - firefox是唯一拖延它的版本,但它已经安排在第11版 ),所以我调整了@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();
请注意,在outerHTML中存在一些跨浏览器的不一致性(例如,在chrome中查看此页面并与ie进行比较)
您可以将所需的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>
现在,
$("#1").parent().html()
将获取所需的字符串。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.