{"id":169,"date":"2019-07-25T19:38:51","date_gmt":"2019-07-25T22:38:51","guid":{"rendered":"http:\/\/fabiobrandao.net.br\/blog\/?p=169"},"modified":"2023-03-11T23:56:02","modified_gmt":"2023-03-12T02:56:02","slug":"jquery-contar-elementos","status":"publish","type":"post","link":"https:\/\/fabiobrandao.net.br\/blog\/javascript-e-bivliotecas\/jquery-contar-elementos\/","title":{"rendered":"JQuery &#8211; Contar elementos"},"content":{"rendered":"<p>A <strong>contagem<\/strong> de elementos com <strong>jQuery<\/strong> \u00e9 bem simples. Voc\u00ea pode contar todos os elementos que utilizam uma determinada classe ou os elementos que utilizam uma determinada etiqueta HTML.<\/p>\n<p>Se voc\u00ea caiu de para-quedas aqui e n\u00e3o sabe o que \u00e9 <strong>jQuery<\/strong> d\u00ea uma olhada neste <a href=\"http:\/\/fabiobrandao.net.br\/blog\/jquery\/introducao-ao-jquery\/\">post de introdu\u00e7\u00e3o<\/a>.<\/p>\n<p>Suponha que voc\u00ea tenha uma tabela contendo uma lista de dados que pode receber novos dados com acr\u00e9scimo de tr ou a exclus\u00e3o de dados, com a exclus\u00e3o do tr. Voc\u00ea pode ter na tela um contador com o total de itens da tabela, logo bastaria contar o n\u00famero de linhas desta tabela para obter a contagem, por exemplo:<\/p>\n<p><code>var count = $('tr').length;<br \/>\n<\/code><br \/>\nPode ser que sua tabela tenha linhas aninhas com outras tabelas. Neste caso contar linhas n\u00e3o vai gerar o resultado que esperamos pois as linhas aninhadas ser\u00e3o consideradas. Uma forma de contornar seria aplicando uma classe somente para as linhas que deseja contar, por exemplo:<\/p>\n<p><code>&lt;tr class=\"tr-count\"&gt;<br \/>\n<\/code><br \/>\n<code>var count = $('.tr-count').length;<br \/>\n<\/code><br \/>\nAgora a cada inclus\u00e3o ou exclus\u00e3o de linha voc\u00ea poderia chamar uma fun\u00e7\u00e3o para atualizar seu contador, alterando o valor do HTML, por exemplo:<\/p>\n<p><code>function updateCount()<br \/>\n{<\/code><br \/>\n<code>\u00a0 \u00a0 $('#myCount').html($('.tr-count').length)<br \/>\n}<br \/>\n<\/code><\/p>\n","protected":false},"excerpt":{"rendered":"<p>A contagem de elementos com jQuery \u00e9 bem simples. Voc\u00ea pode contar todos os elementos que utilizam uma determinada classe ou os elementos que utilizam uma determinada etiqueta HTML. Se&#8230; <\/p>\n","protected":false},"author":1,"featured_media":377,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"footnotes":""},"categories":[69],"tags":[29,9],"class_list":["post-169","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript-e-bivliotecas","tag-contagem","tag-jquery"],"_links":{"self":[{"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/posts\/169","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/comments?post=169"}],"version-history":[{"count":11,"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/posts\/169\/revisions"}],"predecessor-version":[{"id":382,"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/posts\/169\/revisions\/382"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/media\/377"}],"wp:attachment":[{"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/media?parent=169"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/categories?post=169"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fabiobrandao.net.br\/blog\/wp-json\/wp\/v2\/tags?post=169"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}