Que signifie '+ variable +'?

Qu'est-ce que cela signifie: '+ variable +' signifie?

J'utilise la méthode jjuery append pour ajouter un élément DOM:

$('#story_pages').append('<div><button value="'+window_value+'" onclick= "reload_to_canvas(this.value)" ><img id="w'+window_value+'", src=white_data_URL, width="100px", height="100px"/> </button></div>'); 

En fait, je ne veux pas pourquoi ça fonctionne … Si j'écris juste

 value= window_value img id= w+window_value 

, Et utilisez le sélecteur $ ('# (w + window_value)') pour trouver l'élément. Il doit échouer.
Quel est cet opérateur? '+ Variable +'
Et pourquoi devrions-nous utiliser la notation étrange "'+ variable +'"?
Quand devrions-nous utiliser cette notation?

Quel est cet opérateur? '+ Variable +'

Ce n'est pas un opérateur.

' Termine un littéral de chaîne

+ Est un opérateur de concaténation.

variable est une variable de chaîne

+ Est un autre opérateur de concaténation.

' Commence un nouveau lit de chaîne.

Et pourquoi devrions-nous utiliser la notation étrange "'+variable+'" ?

Les deux littéraux de chaîne ont " caractères dans leurs données.

L'objet est de construire ceci:

 '<element attribute="value">' 

Lorsque la valeur est une variable

 var myValue = "value"; '<element attribute="' + value + '">' 

La génération de code à partir du codage par concaténation de chaîne donne toujours un code laid, ce qui est relativement difficile à maintenir. Je aborderais le problème avec une approche plus détaillée:

 var content = $("<div>"); var button = $("<button>"); button.val(window_value); button.on('click', function() { reload_to_canvas(this.value); }); var img = $('<img>'); img.attr('id', 'w' + window_value); img.attr('src', 'white_data_URL'); // width and height can be handled in CSS button.append(img) content.append(button) $('#story_pages').append(content) 

Ceci construit une chaîne dynamiquement en utilisant les données d'une variable.

 var x = "World"; var text = "Hello " + x + ", how are you?"; 

La partie littérale de la chaîne peut être jointe soit par des guillemets simples, soit par des guillemets. Chacun fait exactement la même chose, mais si la chaîne elle-même contient des citations, l'une des deux est plus pratique.

 var text = 'Hello, "' + x + '", how are you?'; // double quotes inside var phrase = "Hello, '" + x + "', how are you?"; // single quotes inside 

Les devis doivent correspondre. La mise en évidence de la syntaxe (comme ici sur Stackoverflow) facilite cette tâche.

Si vous avez besoin de deux sortes de citations à l'intérieur de la chaîne, vous devez échapper à l'une d'entre elles avec une barre oblique inverse.

 var lotsOfQuotes = ' "Gosh, O\'Neill, what have you done", he said. '; 

Cela signifie qu'une chaîne est concaténée avec une variable.