web-dev-qa-db-fra.com

Quel est ce personnage de l'espace INSANE ??? (Google Chrome)

Cela me conduit absolument,! &&% & $ insane ... il défie tout ce que je peux penser.

CE caractère ici ... " "

Entre ces citations ... ouvrez Google Chrome et inspectez. Vous verrez que c'est un  ... normal non? Maintenant, faites un clic droit et affichez réellement la source de cette page de débordement de pile. C'est un espace normal ... (le personnage que j'ai copié était aussi un espace réel).

Je pourrais comprendre s’il s’agit d’une sorte d’éditeur de texte enrichi ou quelque chose du genre, mais dans la source HTML brute, c’est un espace normal;

Voici juste en appuyant sur la touche espace (qui fonctionne bien) ... " ".

Vous pouvez même le copier et le coller partout, semer le chaos et faire en sorte que le chrome mette   partout. Même si ce qui est copié dans votre presse-papiers n’est qu’un espace.

J'ai ces personnages stupides apparaissent partout au hasard sur mon site et je ne sais pas d'où ils viennent, ou pourquoi Google convertit un espace en un nbsp;

J'ai essayé d'inspecter le code du personnage et c'est un espace régulier de tout ce que je peux trouver ...

Chaque méthode que j'essaie montre comme un espace NORMAL ... alors qu'est-ce qui donne?

Si j'utilise Ruby et que je fais " ".ord, je reçois 32. Si je le fais avec l'espace cassé, j'obtiens aussi 32.

S'il vous plaît, aidez-moi à perdre mon esprit.

edit : vous pouvez le prouver ... voir la source de cette page et vous verrez deux " " vides comme d’habitude. Maintenant, regardez dans la console et seul celui qui sera un  , mais le source brut est identique.

Image pour les personnes n'utilisant pas le chrome (il s'agit de regarder ce billet via les outils de développement de chrome): enter image description here

Voici le code HTML du même texte que celui que vous voyez lorsque vous affichez la source ... Aucun nbsp n’a été trouvé.

enter image description here

22
Tallboy

Lorsque je visualise le code source de cette page dans Internet Explorer ou que je le télécharge directement à partir du serveur et que je le visualise dans un éditeur de texte, le premier caractère d'espacement en question est formaté comme ceci dans le code HTML réel:

THIS character right here... " "

Notez l'entité  . C’est le code Unicode U+00A0 NO-BREAK SPACE. Chrome est juste en train d’être gentil et le reformate en   lors de l’inspection du HTML. Mais ne vous y méprenez pas, il s’agit d’un véritable espace insécable, et non d’un point de code Unicode U+0020 SPACE comme vous le souhaiteriez. U+00A0 est affiché visuellement de la même manière que U+0020, mais ce sont des caractères sémantiquement différents.

Le deuxième caractère d'espace en question est formaté comme ceci dans le code HTML réel:

<p>Here's just with hitting the space key (which works fine)... <code>" "</code>.</p>

Il s’agit donc d’un point de code Unicode U+0020 et non de U+00A0. Voir les données hexadécimales brutes de cette page confirme que:

screenshot showing non-breaking space

screenshot showing normal space

27
Remy Lebeau

Il s'avère que les deux caractères d'espaces apparemment identiques ne sont pas les mêmes. 

Voir:

var characters = ["a", "b", "c", "d", " "];

var typedSpace  = " ";
var copiedSpace = " ";

alert("Typed: " + characters.indexOf(typedSpace));   // -1
alert("Copied: " + characters.indexOf(copiedSpace)); // 4    
alert(typedSpace === copiedSpace);                   // false

JSFiddle

typedSpace.charCodeAt(0) renvoie 32, l'espace &#32; classique. Alors que copiedSpace.charCodeAt(0) renvoie 160, le &#160 AKA &nbsp;

La différence entre les deux est qu’un tas de &#160; répétés l’un après l’autre tiendra leur place et créer un espace supplémentaire entre eux, alors que tout un tas de caractères &#32; répétés s’uniront en un seul espace.

Par exemple:

A &#160;&#160;&#160;&#160;&#160; B résulte en: A B

A &#32;&#32;&#32;&#32;&#32; B résulte en: A B

Pour convertir le caractère &#160; avec un caractère &#32; dans une chaîne, essayez ceci:

.replace(new RegExp(String.fromCharCode(160),"g")," ");

À l'avenir, comme moi, aux personnes qui ont dû résoudre ce problème depuis le plus haut niveau jusqu'aux codes de caractères, je vous salue.

5
Charles Clayton

C'est un espace insécable. &nbsp; est l'entité utilisée pour représenter un espace insécable. Il s’agit essentiellement d’un espace standard, la principale différence étant qu’un navigateur ne doit pas casser (ni mettre en boucle) une ligne de texte au point occupé par ce &nbsp;.

Très probablement, le caractère est inséré par votre éditeur HTML. Pourriez-vous donner un exemple plus spécifique dans son contexte?

2
TooltotheDeath

Il ne s'agit pas en réalité d'une réponse à la question, mais d'un outil qui peut être utilisé pour détecter cet espace blanc spécial dans le code HTML des pages d'un site Web afin que nous puissions le localiser et le supprimer.

L'outil qui fait fondamentalement est:

  1. Récupère le contenu d'une URL
  2. Recherche les occurrences de chr(194).chr(160) dans le contenu HTML
  3. Remplace et met en évidence les occurrences avec quelque chose de plus visible

De cette façon, vous pouvez réellement savoir où sont les espaces et éditer votre page correctement pour les supprimer.

La version en ligne de l'outil peut être trouvée ici: 

http://tools.heavydots.com/nbsp-space-char-detect/

Un exemple de travail peut être vu avec l’url de cette question qui contient une occurrence: 

http://tools.heavydots.com/nbsp-space-char-detect/?url=http%3A%2F%2Fstackoverflow.com%2Fquestions%2F26962323%2Fwhat-is-this-insane-space-character-google -chrome & highlight = 1 & hstring =% 7BNBSP% 7D

Un dépôt Github est disponible si quelqu'un veut que le code soit exécuté localement:
https://github.com/HeavyDots/nbsp-space-char-detect

J'espère que quelqu'un trouvera cela utile. Pour les commentaires, il existe une section de commentaires sur la page de l'outil.

Mis à jour le 5 janvier 2017

Sur notre blog d'entreprise, nous venons d'écrire un article amusant sur cet espace blanc agaçant. Vous êtes invités à passer et à le lire! :-) 

http://heavydots.com/blog/when-the-white-space-became-a-beast

Comme les réponses précédentes l'ont mentionné, il s'agit d'un espace insécable (nbsp). Sur Mac, ce caractère est inséré lorsque vous appuyez accidentellement sur Alt + Espace (cela se produit généralement lorsque vous saisissez un code qui requiert Alt pour des caractères spéciaux, par exemple [ sur un clavier allemand).

Pour remapper cette combinaison de touches en un simple caractère SPACE, vous pouvez modifier votre liaison par défaut comme suggéré sur Apple SE

1
Frank Schmitt

Pour les espaces, appuyez sur "Alt + 0160" qui est également un caractère.

0
Keyur Sureliya