2010-12-16 103 views
1

爲了加快我們的'內容更新審查過程',該過程用於批准發佈網頁內容,我期待實現一個JavaScript函數來比較兩個網頁版本。JavaScript網頁版本比較

到目前爲止,我創建了一個頁面,用於加載要與特定頁面的新舊版本進行比較的內容。是否有一種(相對)簡單的方式來遍歷每個使用JavaScript/jQuery的html,並突出顯示哪些內容已更改或缺失?

由於會有這麼多的html特定的細節(因爲這本質上是HTML文本comare),是否有我可以使用的JavaScript庫?

我應該補充說,我的第一個將是在PHP中實現這一點。不幸的是,我們有許多限制,只允許我們使用有限的資源,如JavaScript。

+3

它是否必須是Javascript?服務器端語言是不可能的? – 2010-12-16 19:44:59

+0

我們可以在ASP.NET中做到這一點,但我會誠實的。我在一家公共機構工作,任何涉及實際編碼的事情都需要IT部門的監督。不幸的是,我們需要在不到一年的時間內完成這項工作...... – 2010-12-16 19:50:57

+0

如果您正在尋求「不要實際編碼」,請將引用移至CMS。 – 2010-12-16 19:54:35

回答

2

版本控制是一個不平凡的問題。如果這是您的「內容更新審覈流程」的一部分,那麼您可能不應該從頭開始實施。

取而代之,請考慮使用工具SubversionGit或您最喜愛的源代碼控制解決方案。

如果你真的想要做到這一點,你可以從像正則表達式匹配到DOM匹配這樣簡單的事情。沒有「魔法圖書館」,我知道這將爲你封裝,所以這將是工作。工作,你可能會做錯。

認真考慮一個版本控制提供者,或者使用內置版本控制頁面的CMS。如果你感到壓力很大,請查看一個開源CMS(如Drupal),並試圖找出它們如何實現版本控制,然後自行對其進行逆向工程/重新設計。我希望這種低效率是顯而易見的。

1

我會做這3個步驟

1 /段含量爲2個陣列

每個 頁。選擇一個分隔符,如「。」或「」 。你具有的內容以大的字符串,將它和建立一個數組

2 /比較陣列在包含分段的內容這2個陣列

環,假設A [idxA]和B [idxB] 。如果A [idxA] == B [idxB],則idxA ++和idxB ++ 。否則查找是否有索引,其中A [idxA] == B [index] 。如果存在,則將idxB和索引之間的所有索引標記爲「B修改」 。否則,標記idxA爲「A修飾的」

3 /顯示差異

在最後你應該有所有A和B不相等的索引。然後,您可以在添加一些標記以突出顯示差異之後加入2個陣列。

這不是一個完美的解決方案,有時候會出錯。但是如果你正確選擇你的分隔符,通常不會。如果你想要它完美,你將不得不測試幾個匹配,並計算差異的數量,以使其最小化。