क्या कोई उपकरण है जो डीओएम संरचना द्वारा एचटीएमएल दस्तावेजों की तुलना कर सकता है?

Question

मैं दो HTML दस्तावेज़ों की तुलना करना चाहता हूं, और जानना चाहता हूं कि वे समान हैं या नहीं। लेकिन केवल डीओएम संरचना से तुलना करें, जिसका अर्थ है टैग में विशेषताओं के क्रम को अनदेखा करना, उदाहरण के लिए, <table id="one" name="table">, <table name="table" id="one"> समान हैं।

Answer 1

अगर आप स्थैतिक सामग्री की तुलना करने की जरूरत है आप diffxml या xmldiff एक कोशिश (html फ़ाइलें के लिए समर्थन बाद में भी दे सकते हैं।

Answer 2

डोम स्तर 3 कोर विधि isEqualNode() जो सामग्री एक पार्स डोम नोड दे तुलना प्रदान करता है।

यह फ़ायरफ़ॉक्स, क्रोम, सफारी और IE9, लेकिन नहीं ओपेरा या उससे पहले ब्राउज़रों द्वारा समर्थित है आपने अन्य ब्राउज़र में समर्थन की जरूरत है तो आप इसे अपने आप को लागू करने के लिए होगा यहाँ जे एस में एक आंशिक कार्यान्वयन है:।।

function Node_isEqualNode(that, other) { 
    // Use native support where available 
    // 
    if ('isEqualNode' in that) 
     return that.isEqualNode(other); 

    // Check general node properties match 
    // 
    var props= ['nodeType', 'nodeName', 'localName', 'namespaceURI', 'prefix', 'nodeValue']; 
    for (var i= props.length; i-->0;) 
     if (that[props[i]]!==other[props[i]]) 
      return false; 

    // Check element attributes match 
    // 
    if (that.nodeType===1) { 
     if (that.attributes.length!==other.attributes.length) 
      return false; 
     for (var i= that.attributes.length; i-->0;) 
      if (!Node_isEqualNode(that.attributes[i], other.getAttribute(that.attributes[i].name))) 
       return false; 
    } 

    // Check children match, recursively 
    // 
    if (that.childNodes.length!==other.childNodes.length) 
     return false; 
    for (var i= that.childNodes.length; i-->0;) 
     if (!Node_isEqualNode(that.childNodes[i], other.childNodes[i])) 
      return false; 
    return true; 
} 

ध्यान दें कि यह अतिरिक्त DocumentType गुणों के लिए परीक्षण नहीं करता है क्योंकि डोम लेवल 3 कोर की आवश्यकता होती है। आप इसे काफी आसानी से जोड़ सकते हैं, लेकिन फिर entities जैसी चीजों का ब्राउज़र समर्थन वैसे भी कमजोर है।

Answer 3

मैं समस्या का समाधान है, daisydiff एक समाधान

Answer 4

मैं एक hella लंबे समय के लिए WinMerge का उपयोग किया है है और मैं इसे के साथ कोई समस्या थी कभी नहीं किया है।

मैं इसे php/html/css आदि के लिए उपयोग करता हूं - लेकिन मेरे सहयोगी भी इसका उपयोग डेल्फी, सी # और अधिक के लिए करते हैं।

Answer 5

मैं इस मुद्दे था और jQuery के .html() समारोह का उपयोग कर इस प्रकार कोड का एक विहित प्रतिनिधित्व हो रही एक div में मेरी एचटीएमएल कोड डाल दिया और फिर इसे वापस बाहर फिर से लेने के लिए, द्वारा इसे हल करने में सक्षम था। कम से कम फ़ायरफ़ॉक्स 4 और आईई 8 में ठीक काम करने लगता है।

function compareHtml(a, b) { 
    var div = $(document.createElement('div')); 
    div.html(a); 
    var aNormalized = div.html() 
    div.html(b); 
    var bNormalized = div.html() 
    return aNormalized == bNormalized; 
}