我的部分代码获得了 OuterHTML 属性
"<LI onclick="TabClicked(this, 'SearchName', 'TabGroup1');">Name "
所以我可以做一些涉及解析它的事情。
但是,firefox 上的 javascript 中没有 OuterHTML 属性,我找不到获取此字符串的替代方法。想法?
我的部分代码获得了 OuterHTML 属性
"<LI onclick="TabClicked(this, 'SearchName', 'TabGroup1');">Name "
所以我可以做一些涉及解析它的事情。
但是,firefox 上的 javascript 中没有 OuterHTML 属性,我找不到获取此字符串的替代方法。想法?
这是我们在pure.js 中使用的函数:
function outerHTML(node){
return node.outerHTML || new XMLSerializer().serializeToString(node);
}
以 DOM 方式使用它:
outerHTML(document.getElementById('theNode'));
它可以跨浏览器工作
编辑:警告!
XMLSerializer 有问题,它生成一个 XML(XHTML) 字符串。
这意味着您最终可以使用类似的标签<div class="team" />
而不是<div class="team"></div>
某些浏览器不喜欢它。我最近对 Firefox 3.5 感到有些痛苦。
所以对于我们的pure.js
库,我们又回到了旧的和安全的方式:
function outerHTML(node){
// if IE, Chrome take the internal method otherwise build one
return node.outerHTML || (
function(n){
var div = document.createElement('div'), h;
div.appendChild( n.cloneNode(true) );
h = div.innerHTML;
div = null;
return h;
})(node);
}
正确的方法(对于非 IE 浏览器)是:
var sOuterHTML = new XMLSerializer().serializeToString(oElement);
如果你愿意使用 jQuery 那么它相对简单:
$('<div>').append( $(ElementSelector).clone() ).html();
如果选择了多个元素,这将获得多个元素的外部 HTML。
Firefox 现在支持外层 HTML:
Firefox 11 于 2012 年 3 月 13 日发布。本文提供有关此版本中修复的新功能和主要错误的信息,以及指向 Web 开发人员和附加组件开发人员的更详细文档的链接。
- HTML 元素现在支持 element.outerHTML 属性。
由于 W3C 不包含 outerHTML 属性,您只需要添加以下内容:
if (typeof (HTMLElement) != "undefined" && !window.opera)
{
HTMLElement.prototype._____defineGetter_____("outerHTML", function()
{
var a = this.attributes, str = "<" + this.tagName, i = 0; for (; i < a.length; i++)
if (a[i].specified)
str += " " + a[i].name + '="' + a[i].value + '"';
if (!this.canHaveChildren)
return str + " />";
return str + ">" + this.innerHTML + "</" + this.tagName + ">";
});
HTMLElement.prototype._____defineSetter_____("outerHTML", function(s)
{
var r = this.ownerDocument.createRange();
r.setStartBefore(this);
var df = r.createContextualFragment(s);
this.parentNode.replaceChild(df, this);
return s;
});
HTMLElement.prototype._____defineGetter_____("canHaveChildren", function()
{
return !/^(area|base|basefont|col|frame|hr|img|br|input|isindex|link|meta|param)$/.test(this.tagName.toLowerCase());
});
}