Tarayıcı neden html tag öznitelik değerlerini otomatik olarak unescape yapar?

Question

Aşağıda bir HTML etiketine sahibim ve pencere öğesi özniteliğinin değerini ayıklamak için JavaScript kullanın. tarayıcı otomatik öznitelik değerlerini çıkış karakterini yüzden bu kod yerine <test> ait <test> uyarır:

alert(document.getElementById("hau").attributes[1].value)

<div id="hau" widget="&lt;test&gt;"></div>

Sorularım şunlardır

:

1. bu davranış yanında herhangi bir şekilde önlenebilir öznitelik içeriklerinden çift kaçış mı yapıyorsunuz? (Şunun gibi görünecekti: <test>)
2. Tarayıcı neden böyle davrandığını bilen var mı? HTML özelliklerinde bu davranışın açıkça belirtildiği herhangi bir yer var mı?

Answer 1

1) Bu sizindir htmlEncode() daha yakın gibi

Görünüşe çift kaçış yapıyor olmadan yapılabilir. kullanmakta sakınca yoksa jQuery

alert(htmlEncode($('#hau').attr('widget'))) 
 

 
function htmlEncode(value){ 
 
    //create a in-memory div, set it's inner text(which jQuery automatically encodes) 
 
    //then grab the encoded contents back out. The div never exists on the page. 
 
    return $('<div/>').text(value).html(); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="hau" widget="&lt;test&gt;"></div>

Eğer saf vanilya js çözümü ilgileniyorsanız

alert(htmlEncode(document.getElementById("hau").attributes[1].value)) 
 
function htmlEncode(html) { 
 
    return document.createElement('a').appendChild( 
 
     document.createTextNode(html)).parentNode.innerHTML; 
 
};

<div id="hau" widget="&lt;test&gt;"></div>

2) Neden tarayıcı böyle davranır?

Yalnızca bu davranışın, biz tek yolu eklemek için mümkünse olmazdı böyle aşağıda gösterildiği gibi önceden doldurulmuş giriş alanının içine tırnak dahil olarak belirli birkaç şey, yapabilir çünkü " tekrar \

<input type='text' value="&quot;You &apos;should&apos; see the double quotes here&quot;" />

gibi başka karakter ile kaçan gerektirecek kendisini eklemektir

Answer 2

Tarayıcı, belgeyi ayrıştırır yüklemez nitelik değerini sıfırlar (belirtilen here). Bunun nedenlerinden biri, örneğin, öznitelik değerinizde çifte alıntılar eklemenin imkansız olması olabilir (iyi, teknik olarak eğer değeri tek tırnak içine koyarsanız yaparsınız, ama sonra bunu dahil edemezdiniz) değerindeki tek tırnaklar.

Bu, davranışın bir parçası olan HTML öğeleriyle gerçekten kullanmanız gerekiyorsa da, özel karakterlerinizi kodların içine geri döndürmeniz gerekebiliyor olsa da, bu davranış engellenemez dedi (Bu tür bir görev için Underscore's escape öneririm).