HTML öznitelik değerleri içinde tek/çift tırnaklara izin var mı?

Question

Tek bir alıntı içeren öznitelik değerini ayarlamak çalışıyorum: Ancak

var attr_value = "It's not working"; 
var html = "<label my_attr='" + attr_value + "'>Text</label>"; 
$('body').html(html); 

, aşağıdaki sonuç elde edersiniz:

<label working="" not="" s="" my_attr="It">Text</label> 

nasıl çözeriz diye?

Öznitelik değerlerinin içinde çift tırnak var mı? nitelik ayırıcı olarak

Answer 1

Evet, ikisi tırnak özellik değerlerinin izin verilir, ancak bir özellik değeri ayırıcı olarak kullandığınız alıntı yanı sıra diğer HTML-özel karakterler HTML-kaçış gerekir gibi < ve &:

function encodeHTML(s) { 
    return s.split('&').join('&amp;').split('<').join('&lt;').split('"').join('&quot;').split("'").join('&#39;'); 
} 

var html= '<label my_attr="'+encodeHTML(attr_value)+'">Text</label>'; 

Ancak, genellikle HTML dizeleri bir araya belgeyi girmeye çalışmak değil daha iyi uzakta. Her zaman kaçmayı unuttuğunuzda hatalar ve HTML-enjeksiyonu (siteler arası güvenlik açıklarına yol açar) riskiyle karşı karşıyasınız. Tersbölüleri

$('body').append(
    $('<label>', {my_attr: attr_value, text: 'Text'}) 
); 

Answer 2

var attr_value = "It's not working" 

Answer 3

kullanın çift tırnak:

var html = "<label my_attr=\"" + attr_value + "\">Text</label>"; 

Answer 4

Sen çift tırnak veya tek tırnak içine çift tırnak içine tek tırnak kullanabilirsiniz. Tek tırnak içinde tek tırnak veya çift tırnak içinde çift tırnak kullanmak istiyorsanız, bunları HTML kodlamak zorundasınız.

Geçerli işaretleme:

<label attr="This 'works'!" /> 
<label attr='This "works" too' /> 
<label attr="This does NOT \"work\"" /> 
<label attr="And this is &quot;OK&quot;, too" />