Aspas simples vs duplas ('vs ")

250

Eu sempre usei aspas simples ao escrever meu HTML manualmente. Eu trabalho com muito HTML renderizado, que sempre usa aspas duplas. Isso me permite determinar se o HTML foi escrito à mão ou gerado. isso é uma boa ideia?

Qual é a diferença entre os dois? Sei que ambos funcionam e são suportados por todos os navegadores modernos, mas existe uma diferença real em que um é realmente melhor que o outro em situações diferentes?

ctrlShiftBryan
fonte
5
Para responder à pergunta sobre o uso de aspas simples vs duplas como forma de determinar o HTML gerado à mão e gerado, não é provavelmente uma boa idéia. Embora o código que seja inconsistente (use o single em alguns lugares, o dobro em outros) seja provavelmente escrito à mão, tenho certeza de que muitas pessoas (inclusive eu) usam aspas duplas em todos os lugares, mas nosso código certamente não é gerado por computador; )
Doktor J
@ A resposta de Aito está correta e deve ser aceita ... Pessoalmente, uso aspas simples para atributos curtos, como palavras-chave / tags únicas, URL e referências; qualquer coisa que não tenha a intenção de ser lida por humanos, na verdade. Para textos mais longos ou qualquer coisa que possa incluir espaços ou aspas / apóstrofos - como conteúdo, uso aspas duplas. É apenas uma questão de seu estilo (ou a guia de estilo que você usa)
cedbeu
1
confira 10 sites principais e veja o que a maioria deles usa, como stackoverflow, youtube / google, wikipedia. Até agora, tenho problemas para encontrar sites importantes que usam aspas simples.
Timo Huovinen

Respostas:

391

A organização w3 disse :

Por padrão, o SGML exige que todos os valores de atributo sejam delimitados usando aspas duplas (ASCII decimal 34) ou aspas simples (ASCII decimal 39). As aspas simples podem ser incluídas no valor do atributo quando o valor é delimitado por aspas duplas e vice-versa. Os autores também podem usar referências de caracteres numéricos para representar aspas duplas ( ") e aspas simples ( '). Para aspas duplas, os autores também podem usar a referência de entidade de caracteres ".

Então ... parece não haver diferença. Depende apenas do seu estilo.

Aito
fonte
38
e ser consistente (com 'ou ") provavelmente resultará em taxas de compactação mais altas no caso de você servir páginas compactadas (gzip, deflate)
cherouvim
2
@ Aito, isso é para SGML. Para HTML, nem todos os valores de atributos precisam ser delimitados
Pacerier
4
Sugiro, porém, mais do que o dobro - Por que usar dois quando se pode fazer o trabalho.
Ujjwal Singh
7
@ JohnHunt: Acabei de fazer um teste rápido em um arquivo js de 1823 bytes (um Backbone Model aleatório de um aplicativo aleatório). A saída gzip se todas as aspas forem iguais ( 'ou ") será de 809 bytes. Misturá-los aumentou a saída para 829 bytes. Isso pode ser irrelevante para você, mas isso não significa que é irrelevante para todos.
precisa saber é
3
Se alguém disser "oh, é um potencial tão baixo, provavelmente irrelevante" a cem "coisas provavelmente irrelevantes", a morte de mil agulhas ocorre. Com um esforço razoável, tudo o que você pode salvar vale a pena salvar o IMO.
CONTRATO DIZ QUE ESTOU CERTO
67

Uso "como camada superior e 'segunda, como imagino que a maioria das pessoas faz. Por exemplo

<a href="#" onclick="alert('Clicked!');">Click Me!</a>

Nesse exemplo, você deve usar os dois, é inevitável.

NibblyPig
fonte
38
Eu faço isso também, mas pode ser evitado se você evitar embutir o javascript dentro do html.
precisa saber é
4
Existem outras situações em que o JavaScript não está embutido, onde aspas simples podem ser necessárias, como ao usar o código personalizado data-* atributos . Dependendo do seu aplicativo e de como você usa os data-*atributos, pode ser necessário usar 's dentro "de. Às vezes nós usá-los para o acompanhamento de eventos do Google Analytics:<a href="..." data-track="Homepage Banner|Clicked|Dick's Sporting Goods">click me</a>
Jake Wilson
3
Considerevar x = "<a href='" + url + "'>click me</a>";
NibblyPig
4
Pode ser facilmente evitado assim: <a onclick="alert(\"Clicked!\")">. No entanto, isso é muito menos legível.
Fabspro
2
No entanto, não tenho certeza se isso é oficialmente suportado pelo SGML e HTML5.
Fabspro
26

Convenções de cotação para desenvolvedores da Web

A resposta curta

No HTML, o uso de aspas simples (') e aspas duplas (") é intercambiável, não há diferença.

Mas a consistência é recomendada, portanto, devemos escolher uma convenção de sintaxe e usá-la regularmente.

A resposta longa

Desenvolvimento Web geralmente consiste em muitas linguagens de programação. HTML, JS, CSS, PHP, ASP, RoR, Python, ect. Por esse motivo, temos muitas convenções de sintaxe para diferentes linguagens de programação. Muitas vezes, habbits de um idioma nos seguem para outros idiomas, mesmo que não seja considerado "adequado", isto é, convenções de comentários. As convenções de citação também se enquadram nessa categoria para mim.

Mas eu costumo usar HTML em conjunto com o PHP. E no PHP há uma grande diferença entre aspas simples e aspas duplas. No PHP com aspas duplas "você pode inserir variáveis ​​diretamente no texto da string". (scriptingok.com) E ao usar aspas simples "o texto aparece como está". (scriptingok.com)

PHP leva mais tempo para processar seqüências de caracteres duplas . Como o analisador PHP precisa ler toda a string com antecedência para detectar qualquer variável interna - e concatená-la - leva mais tempo para processar do que uma única string entre aspas. (scriptingok.com)

 

Aspas simples são mais fáceis no servidor . Como o PHP não precisa ler toda a string com antecedência, o servidor pode trabalhar mais rápido e mais feliz. (scriptingok.com)

Outras coisas a considerar

  1. Frequência de aspas duplas na string. Acho que preciso usar aspas duplas (") nas minhas strings com mais frequência do que preciso usar aspas simples (') nas strings. Para reduzir o número de escapes de caracteres necessários, prefiro delimitadores de aspas simples.
  2. É mais fácil fazer uma única cotação. Isso é bastante autoexplicativo, mas para esclarecer, por que pressionar a tecla SHIFT mais vezes do que você precisa?

Minha convenção

Com esse entendimento do PHP, estabeleci a convenção (para mim e para o resto da minha empresa) de que as strings devem ser representadas como aspas simples por padrão para otimização do servidor. As aspas duplas são usadas na cadeia se forem necessárias aspas, como JavaScript em um atributo, por exemplo:

<button onClick='func("param");'>Press Me</button>

Obviamente, se estamos no PHP e queremos que o analisador manipule variáveis ​​PHP dentro da string, devemos usar intencionalmente aspas duplas. $a='Awesome'; $b = "Not $a";

Fontes

Aspas simples vs Aspas duplas em PHP. (sd). Recuperado em 26 de novembro de 2014, em http://www.scriptingok.com/tutorial/Single-quotes-vs-double-quotes-in-PHP

Dustin Poissant
fonte
3
O apóstrofo vs diferença dupla desempenho citação em PHP era conhecido por ser zero de anos antes que você respondeu a esta pergunta: nikic.github.io/2012/01/09/...
Conor Mancone
1
Você encontra mais aspas duplas do que aspas simples em suas strings? Interessante. Não me lembro da última vez que tive uma citação dupla nas minhas cordas.
Zonker.in.Geneva
Constantemente. Nos últimos 10 anos, como desenvolvedor full-stack, me vejo precisando usar aspas duplas em uma string 10 vezes mais frequentemente do que aspas simples. O exemplo mais comum para JavaScript é que os seletores de atributo SOMENTE funcionam com aspas duplas, portanto document.querySelector("[name^='myname']"), não funcionam de maneira alguma enquanto document.querySelector('[name^="myname"]')funcionam perfeitamente.
Dustin Poissant
@DustinPoissant WHAAAT ?? Em qual navegador ??
Sr. Lister
14

Se for o mesmo, talvez seja melhor usar aspas simples, pois não exige a tecla Shift pressionada. Menos pressionamentos de tecla == menos chance de RSI.

stko
fonte
2
bem, pelo menos no layout Galactic Common. (hush-hush)
n611x007
1
Qual o risco do RSI e o número de pressionamentos de tecla relacionados aos padrões de codificação?
Dib
tantas opiniões que não há diferença entre aspas simples e duplas, mas apenas uma que esclarece que o número de pressionamentos de tecla difere um fator de DOIS. E precisamos de muitas citações. Posso acrescentar com a sugestão de que talvez seja necessário disparar mais neurônios para o reconhecimento de padrões de uma citação dupla em nosso cérebro?
Roland
Isso não é verdade para teclados franceses.
Tokeeen.com
11

Em HTML, não acredito que seja importante usar "ou ', mas deve ser usado de forma consistente em todo o documento.

Meu próprio uso prefere o uso de atributos / html ", enquanto todo o javascript usa '.

Isso facilita um pouco a leitura e a verificação para mim. Se o seu uso faz mais sentido para você do que o meu, não há necessidade de mudança. Mas, para mim, o código seria sentir confuso. É pessoal é tudo.

David diz para restabelecer Monica
fonte
Por que ele precisa ser usado de forma consistente? Apenas por legibilidade?
horárioof
Porque é mais fácil evitar erros dessa maneira.
David diz que restabelece Monica
2
Geralmente, também tenho os atributos em uso ", mas outras vezes estou escrevendo código em código PHP, onde prefiro os echousos "para permitir a análise. Qualquer atributo html dentro desse eco é mais legível se você estiver usando '. Claro que não é consistente, mas é muito mais fácil sem todas as barras invertidas.
horárioof
3
Tudo o que funciona para você é bom; ser consistente não significa 'sempre faça X', apenas significa 'na situação X faça assim', 'consistência pode ser sensível ao contexto; e é melhor usado como tal.
David diz que restabelece Monica
9

Na verdade, o melhor caminho é o que o Google recomenda. Aspas duplas: https://google.github.io/styleguide/htmlcssguide.xml?showone=HTML_Quotation_Marks#HTML_Quotation_Marks

Consulte https://google.github.io/styleguide/htmlcssguide.xml?showone=HTML_Validity#HTML_Validity Assessoria citada pelo Google: "O uso de HTML válido é um atributo de qualidade de linha de base mensurável que contribui para o aprendizado sobre requisitos e restrições técnicas e garante a uso adequado de HTML ".

Stuart
fonte
A grande maioria dos sites que eu encontrei até agora, incluindo stackoverflow, usa aspas duplas, acho que a consistência na web é para melhor, então a resposta correta IMHO também é "aspas duplas".
Timo Huovinen
2
Mas por que!? Por que "acabou '?
São
2
Consistência @ San, principalmente. Segue o padrão do inglês americano que aspas duplas são para aspas e aspas simples são para sub-aspas.
Nielsvh
6

Sei que MUITAS pessoas não concordariam, mas é isso que faço e gosto muito desse estilo de codificação: na verdade, não uso nenhuma citação em HTML, a menos que seja absolutamente necessário.

Exemplo:

<form method=post action=#>
<fieldset>
<legend>Register here: </legend>
  <label for=account>Account: </label>
  <input id=account type=text name=account required><br>
  <label for=password>Password: </label>
  <input id=password type=password name=password required><br>
...

Aspas duplas são usadas apenas quando há espaços nos valores do atributo ou o que for:

<form class="val1 val2 val3" method=post action=#>
  ...
</form>
Randy Tang
fonte
1
Existe uma razão por trás? Ou você apenas "realmente gosta desse estilo de codificação"?
Bugs Bunny
4
Sem aspas, o HTML parece muito mais limpo (e o tamanho do arquivo é um pouco menor). Essa é a única razão e nada mais. Além disso, não consigo entender o motivo de exigir que todos os atributos tenham aspas. Por que não pode ser simplesmente omitido para salvar o problema? Até o w3.org aceita valores de atributos não citados ( w3.org/TR/html-markup/syntax.html#syntax-attr-unquoted ). Simples é melhor que complexo. É algum tipo de religião ter citações?
Randy Tang
5
Não, nenhuma religião que eu conheço. Estive em HTML há algum tempo e nunca vi seu estilo usado antes ... portanto, perguntei.
Bugs Bunny
1
Além disso, os minificadores de HTML também tiram aspas desnecessárias.
Nimrod
2
O problema de deixar de fora aspas em torno dos valores dos atributos é que padrões diferentes têm listas diferentes de caracteres que precisam ser citadas. Por exemplo, o HTML4 disse que apenas os valores que consistem em letras, dígitos, traços e pontos podem ficar sem aspas, mas o HTML5 diz que qualquer coisa vale, exceto espaços e "'` <=>, portanto, você deve ter cuidado, especialmente com navegadores mais antigos!
Sr. Lister
5

Usando aspas duplas para HTML

ie

<div class="colorFont"></div>

Usando aspas simples para JavaScript

ie

$('#container').addClass('colorFont');
$('<div class="colorFont2></div>');
Alan Dong
fonte
2

Eu tive um problema ao usar o Bootstrap, onde o uso de aspas duplas importava versus o uso de aspas simples (o que não funcionou). class = 'row-fluid' deu-me problemas para que o último período caísse abaixo dos outros vãos, em vez de ficar bem ao lado na extrema direita, enquanto class = "row-fluid" funcionou.

MikeP
fonte
1

se você estiver escrevendo asp.net, ocasionalmente, precisará usar aspas duplas nas instruções Eval e aspas simples para delimitar os valores - principalmente para que o código inline C # saiba que está usando uma string no contêiner eval, em vez de um caractere. Pessoalmente, eu usaria apenas um ou outro como padrão e não os misturava, parece uma bagunça.

Mauro
fonte
1

Usando "em vez de" quando:

<input value="user"/> //Standard html
<input value="user's choice"/> //Need to use single quote
<input onclick="alert('hi')"/> //When giving string as parameter for javascript function

Usando 'em vez de "quando:

<input value='"User"'/> //Need to use double quote
var html = "<input name='username'/>" //When assigning html content to a javascript variable
a1204773
fonte
3
No seu caso de "atribuir conteúdo html fazer variável js", eu geralmente preferem fazer o oposto: var html = '<input name="username" />';e manter a coerência com o ther resto html :)
Erenor Paz
1

Não faz diferença para o html, mas se você estiver gerando html dinamicamente com outra linguagem de programação, uma maneira poderá ser mais fácil que a outra.

Por exemplo, em Java, as aspas duplas são usadas para indicar o início e o fim de uma String, portanto, se você deseja incluir uma aspas duplas na String, é necessário escapá-la com uma barra invertida.

String s = "<a href=\"link\">a Link</a>"

Você não tem esse problema com as aspas simples, portanto, o uso das aspas simples cria um código mais legível em Java.

String s = "<a href='link'>a Link</a>"

Especialmente se você precisar escrever elementos html com muitos atributos (note que geralmente uso uma biblioteca como jhtml para escrever html em Java, mas nem sempre é prático fazê-lo)

Paul Taylor
fonte
Fiz dois estágios em servlets. Eu estava analisando meu código e só agora comecei a perceber a realidade entre aspas duplas, aspas simples e concatenações de strings. O site que eu estudava usava aspas duplas em html e aspas simples em java. Nem percebi. Fico feliz que finalmente entendi ... #
Michael Michael
0

Sou novato aqui, mas só uso aspas simples quando uso aspas duplas dentro da primeira. Se não estiver claro, mostro-lhe um exemplo:

<p align="center" title='One quote mark at the beginning so now I can
"cite".'> ... </p>

Espero ter ajudado.

Marcin C
fonte
-5

No PHP, o uso de aspas duplas causa uma ligeira diminuição no desempenho, porque os nomes das variáveis ​​são avaliados; portanto, na prática, eu sempre uso aspas simples ao escrever o código:

echo "This will print you the value of $this_variable!";
echo 'This will literally say $this_variable with no evaluation.';

Então você pode escrever isso;

echo 'This will show ' . $this_variable . '!';

Acredito que o Javascript funcione da mesma forma, portanto, uma pequena melhoria no desempenho, se isso for importante para você.


Além disso, se você olhar até a especificação 2.0 do HTML, todas as tags listadas aqui;

Referência DTD HTML W3

(Use aspas duplas.) A consistência é importante, não importa qual você tenda a usar com mais frequência.

Raiden
fonte
13
JavaScript não avalia nomes de variáveis ​​em strings. Não há diferença entre "e" em JavaScript.
John Mellor
-9

Aspas duplas são usadas para strings (ou seja, "esta é uma string") e as aspas simples são usadas para um caractere (ou seja, 'a', 'b' ou 'c'). Dependendo da linguagem de programação e do contexto, você pode usar aspas duplas para um caractere, mas não aspas simples para uma string.

O HTML não se importa com qual deles você usa. No entanto, se você estiver escrevendo HTML dentro de um script PHP, deve usar aspas duplas, pois será necessário escapá-las (por exemplo, "o que for") para evitar confundir você e o PHP.

CD Reimer
fonte
Conheço várias linguagens de programação, mas uma onde isso é verdade.
Mikl
1
A prática geral do @mikl em C # e Java é Strings em aspas duplas e caracteres em aspas simples. Mas isso não dá validação para esta resposta. A menos que essa seja a resposta para uma pergunta diferente.
Evorlor