2

Como coloco um link dentro de uma string?

var results = [
    {

        text: "Quero colocar um link aqui exemplo <a href="#"> Link </a>"; 
  },
1
  • 2
    É só escapar as aspas "<a href=\"#\">". Aliás, quando você postar uma pergunta, use a tag da linguagem.
    – Jéf Bueno
    Commented 19/02/2019 às 17:12

3 Respostas 3

2

Respondendo a pergunta:

Forma 1 - usando aspas simples:

text: "Quero colocar um link aqui exemplo <a href='#'> Link </a>";

Forma 2 - usando escape:

text: "Quero colocar um link aqui exemplo <a href=\"#\"> Link </a>";

Forma 3 - inserindo uma variável com a URL:

meulink = "#";
...
text: "Quero colocar um link aqui exemplo <a href=" + meulink + "> Link </a>";

Forma 4 - Escapando o texto todo:

text: `Quero colocar um link aqui exemplo <a href="#"> Link </a>`;

Informações extras

Baseando-me nos seus comentários, você provavelmente está se confundindo ao criar essa array e objeto, bem como tendo dificuldades em acessar por conta do primeiro erro. Veja:

var novo_array = [ 0, 1, 234 ];
var novo_objeto = { idade: 23, nome: "José da Silva", funcao: "Desenvolvedor" };
var objeto_em_array = [ 
    { 
        texto: "Objeto dentro do índice 0 do array", 
        texto2: "este também" 
    } 
];

Basicamente você está criando objetos dentro de um array. Como seu array tem índice 0, você acessa os itens do objeto assim - segundo o exemplo acima:

 objeto_em_array[0].texto

Não sei por que aninhou os dois ou se é necessário. Se não for, pode usar só o objeto.

Vou fornecer um exemplo funcional do que tentou fazer. Atente-se apenas ao resultado executável e ao JavaScript. O resto é desnecessário para o entendimento e pode ser ignorado pois serve apenas para ver a execução (visual). Veja

var resultados = [ 
  { 
    texto: "Clique aqui para abrir o poderoso <a href=\"https://www.google.com\">Google</a>!",
    texto2: "Another object"
  }, 
  "Outro item do array",
  "Mais um item do array"
];

var popular = function(id){

  alvo = document.getElementById(id);

  alvo.innerHTML = resultados[0].texto;

};
body { font-size: 12px; }

#nav { width: 22em; text-align: center; }

#formulario { float: left; width: 5em; margin: 0 2em 0 0; }

#saida { float: left; width: 15em; }

#cabecalho { background-color: #ffffaa; color: 333; padding: 0.5em; }

#destino { padding: 0.5em; }

.limpar { clear: both; }
<div id="nav">
  <div id="formulario">
    <form> 
      <input type="button" value="CLIQUE" onclick="javascript: popular('destino');" /> 
    </form>
  </div>

  <div id="saida" >
    <div id="cabecalho">SAÍDA</div>
    <div id="destino"></div>
  </div>

  <div class="limpar"></div>
</div>

2
  • Agradeço sua ajuda, porém nenhum desses métodos funcionou.. Você acha por eu estar usando uma Array, muda algo? Commented 19/02/2019 às 17:46
  • @OgaitEuqireh o fato de usar arrays, não. Mas você está usando array e objetos. O exemplo fornecido por você, especificamente text, é um objeto dentro da array results no índice 0. O acesso se daria por results[0].text Fiz modificações; dê uma lida.
    – José
    Commented 19/02/2019 às 19:59
1

É só utilizar aspas diferentes com as quais você abriu a string.

  
  (function(){
  var results = [
    {

        text: 'Quero colocar um link aqui exemplo <a href="#"> Link </a>'
  }]
  	document.getElementById('teste').innerHTML = results[0].text
  })()
<p id="teste"></p>

1

Existem três formas de você fazer isso, colocando uma " \ " (barra) no caractere desejado, iniciar a string com single quotes ou double quotes ou utilizando template literals (template strings).

A primeira forma é você iniciar com single quote e utilizar o double quote quando necessário:

var texto = 'Quero colocar um link aqui exemplo <a href="#"> Link </a>';

A segunda forma é você colocar a " \ " (barra invertida), ficando da seguinte maneira:

var texto = "Quero colocar um link aqui exemplo <a href=\"#\"> Link </a>";

A terceira forma é usar template literals, iniciando e finalizando a string com sinal de " ` " (Acento Grave)

var texto = `Quero colocar um link aqui exemplo <a href="#"> Link </a>`;

Note que esta última abordagem você precisará ficar atento quanto a compatibilidade dos navegadores. Um bom site de consulta é este link

Para mais informações sobre template literals, veja esta documentação

4
  • Muito obrigado, mas não funcionou, eu estou usando uma array, sera que influencia em algo? obrigado Commented 19/02/2019 às 18:05
  • Não influencia, seria a mesma coisa. Como você está atribuindo o valor ao array? Dá alguma mensagem de erro? Commented 19/02/2019 às 18:16
  • Não da erro, simplesmente fica sem o link tipo: texto texto <a href=""> link </a> estou atribuindo ele assim: $(".js-renderResults").on("click", function () { var result = getResults(); }); $(".js-resultsText").text(result.text); Commented 19/02/2019 às 19:48
  • Neste caso, acho que tem a ver com a atribuição do array pela posição. Dá uma lida na resposta do José que ele está explicando de forma mais completa como fazer isso. Commented 20/02/2019 às 20:03

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .