Close Menu
Código Simples .NETCódigo Simples .NET
    Facebook X (Twitter) Instagram
    Trending
    • NewSQL em 2025: O Estado Atual, Tendências e o Futuro dos Bancos de Dados Relacionais Escaláveis
    • 12 Regras Essenciais para Reduzir a Latência de Aplicações
    • Cache Hit Ratio: Como uma Simples Métrica Pode Revolucionar sua Arquitetura
    • Como a Uber calcula o tempo estimado de chegada
    • 30 APIs Gratuitas para desenvolvedores
    • Por que escalar escrita é tão mais difícil do que escalar leitura?
    • MongoDB Analyzer para .NET: Visualize e otimize suas consultas de forma simples
    • Cardinalidade: O Conceito que Transforma o Desempenho de Bancos de Dados SQL e NoSQL
    Facebook X (Twitter) Instagram
    Código Simples .NETCódigo Simples .NET
    Código Simples .NETCódigo Simples .NET
    Home»Front-End»Exportar HTML para excel com Jquery

    Exportar HTML para excel com Jquery

    Jhonathan SoaresBy Jhonathan Soares27 de novembro de 20141 Min Read Front-End
    Share
    Facebook Twitter LinkedIn WhatsApp Copy Link

    Pessoal, hoje a dica é simples e rápida, vamos aprender a exportar um conteúdo HTML, pode ser uma div, ou table, o que você quiser, para excel!

    Vou mostrar para vocês como exportar para excel utilizando Jquery e um plugin que encontrei na internet chamado btechco.excelexport que possibilita que você modifique o nome da planilha na qual você quer exportar

    Veja o código:

     

    <!DOCTYPE html>
    <html lang="en" class="no-js">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <title>Export HTML table to Excel Format With Jquery- WSnippets.com</title>
        <meta name="description" content="Export HTML table to Excel Format With Jquery- WSnippets.com" />
        <link rel="stylesheet" href="style.css" />    
        <!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
    </head>
    
    <body>
    <div class="wrapper">
        <div id="test">
            <div class="wrapper">
                <h2>WSnippets.com - Export HTML table to Excel Format With Jquery</h2>
                 <div id="dv">
        			<table id="tblExport" style="border:1px solid black; ">
    					<thead>
    						<tr>
    							<th>#</th>
    							<th>First Name</th>
    							<th>Last Name</th>
    							<th>Username</th>
    						</tr>
    					</thead>
    					<tbody>
    						<tr>
    							<td style='background-color:red;'>1</td>
    							<td>Mark</td>
    							<td>Otto</td>
    							<td>@mdo</td>
    						</tr>
    						<tr>
    							<td>2</td>
    							<td>Jacob</td>
    							<td>Thornton</td>
    							<td>@fat</td>
    						</tr>
    						<tr>
    							<td>3</td>
    							<td>Larry</td>
    							<td>the Bird</td>
    							<td>@twitter</td>
    						</tr>
    					</tbody>
    				</table>
    			</div>
    			<div>
    				<button id="btnExport">Export to excel</button>
    			</div>
            </div>
        </div>
    </div>
    
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    <script src="jquery.btechco.excelexport.js"></script>
    <script src="jquery.base64.js"></script>
    
    <script>
        $(document).ready(function () {
            $("#btnExport").click(function () {
                $("#tblExport").btechco_excelexport({
                    containerid: "tblExport"
                   , datatype: $datatype.Table
                   , filename: 'sample'
                });
            });
        });
    </script>
    
    </body>
    </html>

     

    Você pode fazer download dos arquivos aqui.

    Um abraço! 🙂

    Share. Facebook Twitter LinkedIn Telegram WhatsApp Copy Link
    Jhonathan Soares
    • Website
    • Facebook
    • X (Twitter)
    • LinkedIn

    Criador do blog Código Simples e com mais 15 anos de experiência em TI, com títulos de MVP Microsoft na área de Visual Studio Development, Neo4j Top 50 Certificate, Scrum Master e MongoDB Evangelist.

    Posts Relacionados

    Happy Hour com Dados #17 – Azure vs AWS vs GCP

    Front-End 26 de maio de 20211 Min Read

    Blazor .NET – CRUD com MongoDB

    C# Front-End NoSql 2 de janeiro de 20195 Mins Read

    Introdução ao Blazor, o SPA da Microsoft

    C# Front-End 29 de dezembro de 20185 Mins Read
    Newsletter

    Digite seu endereço de e-mail para receber notificações de novas publicações por e-mail.

    Junte-se a 25mil outros assinantes
    Posts recentes
    • NewSQL em 2025: O Estado Atual, Tendências e o Futuro dos Bancos de Dados Relacionais Escaláveis
    • 12 Regras Essenciais para Reduzir a Latência de Aplicações
    • Cache Hit Ratio: Como uma Simples Métrica Pode Revolucionar sua Arquitetura
    • Como a Uber calcula o tempo estimado de chegada
    • 30 APIs Gratuitas para desenvolvedores
    Categorias
    • Arquitetura (14)
      • Testes (2)
    • Asp.net (120)
      • C# (89)
      • Mvc (13)
    • Banco de dados (90)
      • NoSql (58)
      • Sql (38)
    • Boas práticas (29)
      • Gestão & Produtividade (1)
      • Metodologias Ágeis (6)
    • Cursos (52)
    • Dicas (105)
    • Front-End (92)
    • IA (1)
    • Linux (6)
    • NodeJS (4)
    • Post do Leitor (9)
    • Python (5)
    • Seo (12)
    • Tecnologia (30)
      • ITIL (1)
      • Padrões de Projeto (4)
    • Testes (2)

    VEJA TAMBÉM

    Cursos
    12 de fevereiro de 20166 Mins Read

    1000 livros gratuitos sobre programação!

    Olha que dica bacana! A pagina só com livros sobre programação é mantida no GitHub…

    30 APIs Gratuitas para desenvolvedores

    Facebook X (Twitter) Instagram LinkedIn

    Type above and press Enter to search. Press Esc to cancel.

    Vá para versão mobile