用於DOM的JavaScript解析器

我們在項目中有一個特殊的需求，我們必須通過JavaScript解析HTML（來自AJAX響應）客戶端的字符串（僅限於）。那是正確的在PHP或Java中沒有解析！我已經經歷了整個一週的StackOverflow，但還沒有得到一個可接受的解決方案。用於DOM的JavaScript解析器

上要求更多的細節：

我們可以使用任何庫（最好是Dojo和/或jQuery的），或入鄉隨俗！
我們需要分析，我們得到一個字符串，包括<head>和<body>的整個HTML文檔。

我們還需要將經過分析的DOM結構有時序列化爲字符串。

最後，我們不想將解析的DOM附加到當前文檔。相反，我們會將其發送回服務器進行永久存儲。

例如：我們需要這樣的東西

var dom = HTMLtoDOM('<html><head><title> This is the old title. </title></head></html>'); dom.getElementsByTagName('title')[0].innerHTML = "This is a new Title";

隨着我的研究，這是我們的選擇：

一個TinyMCE Parser。問題？我們需要包含一位我認爲的編輯。如何在不需要編輯器的情況下解析HTML？

John Resig's Parser。應該是我們最好的選擇。不幸的是，當給定頁面的全部內容時，解析器崩潰！

jQuery $（htmlString）或dojo.toDom（htmlString）。兩者都依靠文檔分區，因此吞噬了<head>和<body>！

編輯：我們想要序列化的HTML，所以我們可以通過正則表達式捕獲某些自定義HTML Commnets。我們需要讓用戶有機會編輯元標籤，標題標籤等，因此HTML解析器。

哦，我覺得我會在堆棧溢出中遇害，即使我只是提示在通過RegExp解析HTML！

來源

2012-03-02 Gaurav Ramanan

創建一個IFRAME節點並把它放在那裏？ – 2012-03-02 21:01:51

但是..我不明白你爲什麼要在將已經序列化的HTML字符串發送到服務器之前解析它。你必須將它重新序列化回一個字符串，然後傳回給服務器，對吧？ – 2012-03-02 21:02:52

@JensRoland我們想要從RegExp中捕獲某些自定義HTML註釋，然後進行序列化。我們希望讓用戶能夠編輯標題標籤，元標籤等，從而進行DOM解析！ – 2012-03-02 21:13:12

您可以利用當前文檔而不添加任何節點。

嘗試這樣：

function toNode(html) { 
    var doc = document.createElement('html'); 
    doc.innerHTML = html; 
    return doc; 
} 

var node = toNode('<html><head><title> This is the old title. </title></head></html>'); 

console.log(node);

http://jsfiddle.net/6SvqA/3/

來源

2012-03-02 21:26:26

現在_this_是優雅的。 +1！但是我們仍然存在這樣的問題：解析DOM是初始問題的錯誤方法。但這不是這個答案的錯。 – jwueller 2012-03-02 21:34:28

@elusive它可能是值得信賴的用戶，如外地代理或其他東西，你永遠不知道。 – 2012-03-02 21:41:47

@elusive用戶非常信任！ – 2012-03-03 13:09:31

我會建議一個2部分的解決方案，從中讀取jQuery不會爲您解析的標記，然後將其餘部分傳遞給jQuery。如果你正在尋找一個純粹的JavaScript解析HTML數據結構，jQuery可能是你最好的選擇，因爲它有許多內置的操作數據的功能。你實際上可以將你的插件作爲一個jQuery插件來構建，可以通過$ .parser或者其他類似的東西來調用它。如果使用自己的函數擴展jQuery來解析數據，還可以返回一個擴展jQuery對象，該對象包含函數，甚至可以從頭中讀取特定的數據元素，因爲您可以手動解析...信息並將其存儲在同一個對象中。

來源

2012-03-02 21:00:55 Brian

因爲HTML本質上是XML，你可以使用jQuery parseXML

var dom = $.parseXML(html); 

$('title', dom).text("This is a new Title");

編輯：

如果你想要得到它放回一個字符串，你需要使用XML插件，但我無法找到它的原始源，那就是：

/** 
* jQuery xml plugin 
* Converts XML node(s) to string 
* 
* Copyright (c) 2009 Radim Svoboda 
* Dual licensed under the MIT (MIT-LICENSE.txt) 
* and GPL (GPL-LICENSE.txt) licenses. 
* 
* @author Radim Svoboda, user Zzzzzz 
* @version 1.0.0 
*/ 


/** 
* Converts XML node(s) to string using web-browser features. 
* Similar to .html() with HTML nodes 
* This method is READ-ONLY. 
* 
* @param all set to TRUE (1,"all",etc.) process all elements, 
* otherwise process content of the first matched element 
* 
* @return string obtained from XML node(s) 
*/   
jQuery.fn.xml = function(all) { 

    //result to return 
    var s = ""; 

    //Anything to process ? 
    if(this.length) 

    //"object" with nodes to convert to string 
    (
     ((typeof all != 'undefined') && all) ? 
     //all the nodes 
     this 
     : 
     //content of the first matched element 
     jQuery(this[0]).contents() 
    ) 
    //convert node(s) to string 
    .each(function(){ 
    s += window.ActiveXObject ?//== IE browser ? 
     //for IE 
     this.xml 
     : 
     //for other browsers 
     (new XMLSerializer()).serializeToString(this) 
     ; 
    }); 


    return s;  

    };

來源

2012-03-02 21:01:30

這會保留HTML文檔結構嗎？例如和標籤？ – 2012-03-02 21:11:53

是不是'jQuery.parseXML（）'意味着用於XML？這裏我們正在討論HTML。它們不兼容。 – jwueller 2012-03-02 21:15:28

據我所知，但測試取決於你。我用這個類似的情況，迄今沒有問題:) – 2012-03-02 21:15:54

我不知道爲什麼有人應該需要這個，但我建議你只是轉儲源到iframe。瀏覽器可以爲你解析。你甚至可以對結果運行DOM查詢。

來源

2012-03-02 21:02:53 jwueller

是的，我試過了！但請參考我們可能需要將DOM序列化回字符串的點。我們如何爲iframe做到這一點？我們正在爲此定製CMS，其中可編輯區域將通過自定義HTML註釋進行標記。 – 2012-03-02 21:10:52

@Dream Factory：[jQuery.fn.html（）]（http://api.jquery.com/html）怎麼樣？ – jwueller 2012-03-02 21:13:26

如果你想有一個完整的解析器，不是依靠現有的一些東西在瀏覽器中引導你的解釋，在dom.js HTML解析器是一流的。它的全部目的是解析HTML以用於JavaScript託管的DOM，因此它必須兼顧DOM規範以及需要解析和使用js中的結果，而不是假設除了基本JS之外的任何現有工具。它可以在node.js或spidermonkey的jsshell或webworkers中工作。 https://github.com/andreasgal/dom.js

它也有序列化的一部分，但要做到這一點，您需要承諾不僅僅使用解析器部分。您可以找到獨立的序列化程序，儘管可以使用任何類似於DOM的結構。

來源

2012-03-02 21:29:22

不錯，但它是客戶？ – 2012-03-03 13:45:51

用於DOM的JavaScript解析器

回答

相關問題