如何使用JavaScript從HTML字符串中刪除整個HTML，HEAD標籤和BODY標籤？

我有一個名爲myWebsite.html的模板文件。它包含HTML模板需要的所有內容。所以它有HTML，HEAD和BODY標籤。我想用JavaScript加載它，並把它放到網站上的一個div上。所以我不想擁有HTML，HEAD和BODY標籤。這個怎麼做？如何使用JavaScript從HTML字符串中刪除整個HTML，HEAD標籤和BODY標籤？

這是什麼，我需要有一個原型：

$val = getData('myWebsite.html'); 
$val = removeHTMLHEADBODYTAGS($val); //remove these tags with everything insite, also remove the body tag but leave the contents in the body tag. Also remove the end tags of body and html - HOW TO DO THIS? 
div.innerHTML = $val;

我想這樣做，在純JavaScript = NO jQuery的

來源

2012-03-16 Tomasz Smykowski

你嘗試過什麼了嗎？因爲聽起來你想讓我們爲你編程。 – 2012-03-16 12:25:53

+勞倫斯你寫的是非常沒有禮貌的。 – 2012-03-16 12:31:58

你可以用正則表達式提取它。例如：/\<body[^>]*\>(.*)\<\/body/m - 應該返回<BODY>元素中的所有內容。

$val = getData('myWebsite.html'); 
var reg = /\<body[^>]*\>([^]*)\<\/body/m; 
div.innerHTML = $val.match(reg)[1];

實施例的jsfiddle代碼：http://jsfiddle.net/x4hPZ/1/

來源

2012-03-16 12:31:00 thomthom

它不適用於\ r \ n作爲新行。有任何想法嗎？ http://jsfiddle.net/czg88/1/ – 2012-03-16 13:29:28

hm - CR LF是我用過的行。我也沒有看到你發佈的jsFiddle代碼有任何問題。（我在Win7 Firefox10上）你在用什麼？我認爲，正則表達式中的m標誌將處理任何行結束... – thomthom 2012-03-16 13:37:33

好的 - 發現這篇文章：http://siphon9.net/loune/2011/02/match-any-character-including-new- line-in-javascript-regexp /根據以下內容對代碼進行了修改：http://jsfiddle.net/czg88/2/這樣做是否更好？由於我無法重現這個問題，我無法證實我自己。 – thomthom 2012-03-16 13:43:54

爲什麼不取出來的標籤上的信息，然後與工作那？沒有必要獲取所有信息和刪除HTML，頭和身體：

content = $val.getElementsByTagName('body')[0].innerHTML();

來源

2012-03-16 12:29:50

+ Hidde對。這將是一個很好的解決方案，但如果val是字符串時如何能夠調用getElementsByTagName？ – 2012-03-16 12:33:04

這可以通過將val字符串轉換爲具有新元素的dom元素來實現。我在這裏做了一個小例子：[link]（http://jsfiddle.net/TwVbU/） – 2012-03-16 12:48:31

+ Hidde它使用MooTools。所以這不是我正在尋找的解決方案。 – 2012-03-16 13:15:22

怎麼樣：

var bodyContents = htmlstring.split('<body');//no >, body could have a property 
bodyContents = bodyContents[1].replace('</body>','').replace('</html>','').replace(/^.*\>/,'');

最後的正則表達式替換移除開口身體標記的關閉>，以及所有可能的代碼屬性。我想創建一個（i）Frame節點，將html加載到該框架中，並從body標籤中獲取innerHTML。。只是一個建議。

對，iFrame的方式：

var document.ifrm = document.createElement('iframe') 
document.ifrm.style = 'visibility:hidden'; 
document.body.appendChild(document.ifrm); 
idoc = (document.ifrm.contentDocument ? document.ifrm.contentDocument : document.ifrm.contentWindow.document;) 
idoc.open(); 
idoc.writeln('<html><head><title>foobar</title></head><body><p>Content</p></body></html>'); 
idoc.close(); 
var bodyContents = idoc.body.innerHTML;

對於代碼的解釋：http://softwareas.com/injecting-html-into-an-iframe

或任何其他擊中在google.com上爲此事:)

來源

2012-03-16 12:32:53

嗯......這聽起來像一個解決方案，但...第一行後bodyContents不是一個數組？還有更多......關於iFrame ......我只是不喜歡這種解決方案。這有點亂。 – 2012-03-16 12:34:54

你是對的，對不起...第二行應該讀'bodyContents [1] = bodyContents [1] .replace（...'。我不知道爲什麼你覺得使用臨時幀的解決方案是創建一個框架，不附加到當前文檔，解析html，並給你所有的方法來提取你需要的部分，你甚至可以在你的網站中使用它之前操作/檢查數據。實際上，我認爲這是一個更好的解決方案，但正如我所說，這只是一個建議:) – 2012-03-16 12:36:57

+ Elias也許如果我看到這個解決方案，它會更清晰。 – 2012-03-16 13:16:44

使用jQuery，你可以不喜歡它此：

$(document).ready(function(){ 
    var your_content = $("html").clone().find("head,body").remove().end().html(); 
});

得到與「HTML」選擇
內容進行復制與clone
find要刪除
刪除它們的標籤和
轉換回HTML

所有在一行。

HTH，

--hennson

來源

2012-03-16 12:37:08 hennson

hennson ...請... – 2012-03-16 12:38:14

...或者如果您想在沒有框架的情況下工作，請參閱http://stackoverflow.com/questions/7869393/parsing-specific-html-tags-in-javascript ... – hennson 2012-03-16 12:42:38

沒有解決方案 – 2012-03-16 13:05:10

如何使用JavaScript從HTML字符串中刪除整個HTML，HEAD標籤和BODY標籤？

回答

相關問題