3

Bom pessoal a minha dúvida é o seguinte: Eu gostaria de saber se é possível atualizar o conteúdo de um arquivo de forma geral.

Exemplo: Tenho um arquivo chamado nome.html e dentro dele eu tem uma <h1>nome</h1>, Eu gostaria de fazer uma função que quando eu quiser pelo javascript eu consiga modificar de 'nome' para 'bomdia' e salvar o conteudo de modo que ao re-abrir o arquivo nome.html esteja escrito: <h1>bomdia</h1> É possível fazer isso com javascript? algum exemplo de como fazer?

1
  • Conseguiu resolver?
    – durtto
    Commented 25/01/2016 às 10:32

3 Respostas 3

4

Sim, é possível.

Você pode utilizar LocalStorage para armazenar conteúdo local via método setItem(), e obtê-lo de volta via getItem(). O código abaixo exemplifica essa funcionalidade:

  function dataSave(){
    var refVal = document.getElementById("valInput");
    localStorage.setItem("valor", refVal); // Salva o valor
    dataGet();
  }

  function dataGet(){
    var valorTemp = localStorage.getItem("valor") || 'nome'; // Carrega o valor, 
                                                             // com um default caso 
                                                             // este não exista
    
    document.getElementById('template').innerHTML = valorTemp;
    document.getElementById('valInput').value = valorTemp;
  }
<body onLoad="dataGet();">
  <h2 id='template'>placeholder</h2>

    <input type="text" id="valInput" placeholder="Valor a salvar">
    <button onClick="dataSave();">Salvar</button>
</body>

(Por rodar em modo sandbox, este snippet não funcionará no editor do StackOverflow. Salve este conteúdo em uma página no servidor local.)

4
  • Essa é uma solução com inúmeros poréms que você não explicou. Isso só funciona se o usuário sempre utilizar o mesmo browser, se o usuário não limpar os dados salvos nesse tal browser e se o .html for aberto através de um http server pois abrir diretamente (file:///) bloqueia localStorage.
    – BrunoRB
    Commented 25/01/2016 às 16:14
  • 3
    Agradeço o a justificativa, @BrunoRB. Quanto aos seus pontos: O OP está explicitamente focando em JS - banco de dados em nenhum momento é mencionado como um pré-requisito para a resposta. Segundo, eu explicitamente menciono que o conteúdo deve ser servido via um servidor local, e não diretamente via protocolo file.
    – OnoSendai
    Commented 25/01/2016 às 16:17
  • Olha pela pergunta do cara ele parece ser inicianete e nem sabe direito o que quer fazer, então eu acho que numa resposta desse tipo aí de largar o código gera a seguinte situação: ele vai tentar abrir .html não vai funcionar e ele vai abrir uma nova pergunta sobre porque não funciona. Ele vai fazer funcionar atrás do httpserver mas eventualmente vai limpar os dados do browser ou usar em outro ou até abrir o arquivo em outro computador e não vai mais funcionar e vai abrir uma pergunta sobre porque parou de funcionar.
    – BrunoRB
    Commented 25/01/2016 às 16:22
  • 3
    @BrunoRB por via de regra eu não assumo que o usuário possua dúvidas não expressas na pergunta, evitando assim respostas que saem do foco da pergunta proposta e poupando tanto o meu tempo quanto o do OP - e de futuros leitores também.
    – OnoSendai
    Commented 25/01/2016 às 16:26
0

Apenas com HTML/javascript não. HTML é um conjunto estático de tags e texto, o único jeito de você "salvar" uma alteração num arquivo desse tipo é editar ele, seja com um editor de texto ou com uma linguagem de programação tipo C, php, etc. Ok você tem javascript a disposição, mas isso não te ajuda visto que o arquivo html está em um servidor externo e JS é executado diretamente no navegador, lugares distintos. Mesmo que você esteja abrindo seu .html localmente não conseguiria alterar o arquivo pois uma série de restrições é imposta pelos browsers para o que código javascript pode fazer na máquina do usuário, sendo que alterar arquivos é uma delas.

Caso você esteja carregando o html através de um http server (apache, nginx) seria possível fazer uma gambiarra com localStorage, mas seria algo bem limitado e não iria de fato alterar o arquivo (por isso não vou detalhar).

0

Como o BrunoRB falou, provavelmente você não vai conseguir fazer o que você quer utilizando somente HTML/Javascript. Mas se sua pagina .html estiver em um servidor seu e você tenha acesso, você poderia altera-la utilizando apenas javascript, mas não seria a Engine do navegador do usuário e sim através do Node.JS, que é a Engine V8 do Chrome rodando no servidor.

Se você quer alterar o codigo-fonte de uma pagina, você basicamente tem duas alternativas, ou o altera no servidor, antes de mandar como resposta para o cliente (neste caso você poderia utilizar o NodeJS), ou você altera dinamicamente no cliente utilizando Javascript, que na verdade não é uma alteração verdadeira no codigo-fonte mas apenas uma manipulação do documento no cliente.

Você poderia também fazer algo complexo, como criar uma copia do arquivo .html no storage do client utilizando a FileAPI com mais uma serie de processos que obteria mais ou menos o resultado que você espera, mas acho que não é bem isso o que você quer. https://scotch.io/tutorials/use-the-html5-file-api-to-work-with-files-locally-in-the-browser

Para finalizar, o codigo javascript que você executa no navegador do client não tem acesso direto para seus arquivos no servidor, ou seja, você não poderia utilizar apenas ele para modificar seus codigo-fonte. Mas há meios para obter este resultado, modificar o codigo-fonte de uma pagina co javascript, mas isto envolve mais tecnologias que somente HTML/Javascript rodando no navegador.

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 .