在插入DOM之前处理html字符串

Question

我有一个htmlString。 然后，我将该字符串放入iframe。 该代码是

var iframe = document.createElement('iframe'); 
var html = '<html> <head></head> <body> //contents </body> </html>';

document.body.appendChild(iframe);
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(html);
iframe.contentWindow.document.close();

现在我要做的是插入标签

<base href="some url" >

插入htmlString的头部。 然后，我想将iframe附加到dom中，并将htmlString写入该iframe。

如何在将htmlString插入iframe之前对其进行操作？

Answer 1

在这里，您可以前往： https : //jsfiddle.net/tjcwyem6/

我使用以下JavaScript：

var iframe = document.createElement('iframe'),
    html = '<html> <head></head> <body> //contents </body> </html>',
    newurl = "https://www.facebook.com/",
    basehref = "<base href='" + newurl + "'>",
    n = html.indexOf("</head>");

var newhtml = [html.slice(0, n), basehref, html.slice(n)].join('');

document.body.appendChild(iframe);
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(newhtml);
iframe.contentWindow.document.close();

console.log(newhtml);

我的修改如下：

将您的url值存储在newurl 。
将其放在字符串basehref 。
获取HTML字符串中</head>位置。
添加basehref到newhtml通过切割和连接字符串。

Answer 2

您可以使用jquery附加iframe内容，例如-

$("iframe").contents().find("head").append('<base href="some url" >');

Answer 3

您可以通过将html作为XML加载到jquery中并使用jquery进行操作来操纵html：

var xml = $.parseXML("<html> <head></head> <body> //contents </body> </html>");    
$("head", xml).append("<base url='x'/>")

var html;
if (window.ActiveXObject) {
    html = xml.xml;
} else {
    html = (new XMLSerializer()).serializeToString(xml);
}

iframe.contentWindow.document.write(html);

xml到html的详细答案

您无法将html作为html加载到jquery中，因为它会剥离正文/头部。

Answer 4

String.prototype.insertAt=function(index, string) { 
        return this.substr(0, index) + string + this.substr(index);
}
var myhtml = "<html> <head></head> <body></body> </html>";
var m = myhtml.indexOf("</head>");
myhtml = myhtml.insertAt(m, '<base href="some url" >');
console.log(myhtml);

在插入DOM之前处理html字符串

问题描述

4 个解决方案

解决方案1
1 已采纳 2016-05-18 09:10:40

解决方案2
0 2016-05-18 09:10:52

解决方案3
0 2016-05-18 09:15:43

解决方案4
0 2016-05-18 09:27:27

在插入DOM之前处理html字符串

问题描述

4 个解决方案

解决方案1 1 已采纳 2016-05-18 09:10:40

解决方案2 0 2016-05-18 09:10:52

解决方案3 0 2016-05-18 09:15:43

解决方案4 0 2016-05-18 09:27:27

解决方案1
1 已采纳 2016-05-18 09:10:40

解决方案2
0 2016-05-18 09:10:52

解决方案3
0 2016-05-18 09:15:43

解决方案4
0 2016-05-18 09:27:27