Подсчет количества гиперссылок в таблице

Здравствуйте, у меня есть динамическая веб-таблица, и я хочу подсчитать гиперссылки в таблице с помощью Javascript.

Вот HTML:

      <tbody>
       <tr>
        <td style = "..."
         <a id  = " " href = "test1">123456</a>
        </td>
        <td style = "..."
         <a id  = " " href = "test2">123477</a>
        </td>
        <<td style = "..."
         <a id  = " " href = "test3">1234557</a>
        </td>

Я хочу получить количество href из этого HTML

Это то, что я пробовал до сих пор:

    Function Rowcount(){
        var totalRowCount=0;
//identifying the table
        var table=document.getElementById("tableID");
//identifying the row
        var rows=table.getElementsByTagName("tr");
        var tdata=null;
        for( var i=0; i<rows.length; i++){

           tdata=rows[i].getElementsByTagName("td")

        }
    }

Я не понимаю, как я должен ссылаться на "href"

название тега a. href является атрибутом.

— 06.06.2019 18:59

getElementsByTagName("a").length

— 06.06.2019 18:59

javascript

06.06.2019 18:57

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

133

Перейти к ответу Данный вопрос помечен как решенный

Ответы 4

Ответ принят как подходящий

Вы хотите подсчитать все теги A внутри таблицы?

Сделайте что-нибудь вроде

const table = document.getElementById("tableID");
const total = table.querySelectorAll('a').length;

getElementsByTagName делает работу, вам не нужно querySelectorAll

— 06.06.2019 19:10

@Geoffroy Я бы посоветовал использовать getElementsByTagName только в том случае, если вам действительно, я имею в виду, В самом деле, нужен живой HTMLCollection, а не NodeList.

— 06.06.2019 19:12

06.06.2019 19:00

Используйте querySelectorAll и получите длину коллекции:

let linkCount = document.querySelectorAll('#tableID tr > td > a').length

console.info(linkCount)

<table id = "tableID">
  <tbody>
    <tr>
      <td style = "..."> <a id = " " href = "test1">123456</a>
      </td>
      <td style = "..."> <a id = " " href = "test2">123477</a>
      </td>
      <td style = "..."> <a id = " " href = "test3">1234557</a>
      </td>
  </tbody>
</table>

document.querySelectorAll('#tableID a').length, вероятно, будет достаточно, если в OP нет вложенных таблиц. tableID.querySelectorAll('a').length тоже сработает.

— 06.06.2019 19:10

06.06.2019 19:00

Пытаться

mytable.querySelectorAll('a').length

let linksNum = mytable.querySelectorAll('a').length;

console.info( linksNum );

<table id = "mytable">
<tbody>
    <tr>
    <td style = "...">
    <a id  = " " href = "test1">123456</a>
    </td>
    <td style = "...">
    <a id  = " " href = "test2">123477</a>
    </td>
    <td style = "...">
    <a id  = " " href = "test3">1234557</a>
    </td>
 </tbody>
 </table>

06.06.2019 19:01

Вы можете попробовать это, см. ссылка. Это выберет все элементы HTMLAnchorElement внутри таблицы, вы можете изменить родителя в соответствии с вашим состоянием.

var container = document.querySelector("table"); // parent
// if you have many tables you can do something like,to select particular table

//var container = document.getElementById("tableid"); // parent
var matches = container.querySelectorAll("a");
console.info(matches.length)

<table>
  <tbody>
    <tr>
      <td style = "...">
        <a id = " " href = "test1">123456</a>
      </td>
      <td style = "...">
        <a id = " " href = "test2">123477</a>
      </td>
      <td style = "...">
        <a id = " " href = "test3">1234557</a>
      </td>
    </tr>
  </tbody>
</table>

Нет "href элементы". Только элементы, которые имеют hrefатрибут, такие как HTMLAnchorElement и HTMLLinkElement.

— 06.06.2019 19:14

06.06.2019 19:02