document.getElementsByTagName() 方法返回所有具有指定标签名的元素。

getElementsByTagName() 方法的语法如下:


这里,name 是必需的参数,表示要获取的标签名称。

document.getElementsByTagName() 方法示例

在这个示例中,我们将计算文档中使用的段落总数。为了实现这一目的,我们调用了 document.getElementsByTagName("p") 方法来获取所有段落元素。

<script type="text/javascript">
function countpara() {
  var totalpara = document.getElementsByTagName("p");
  alert("Total p tags are: " + totalpara.length);
<p>This is a paragraph</p>
<p>Here we are going to count total number of paragraphs by getElementByTagName() method.</p>
<p>Let's see the simple example</p>
<button onclick="countpara()">Count Paragraph</button>

在这个示例中,我们有三个段落标签。通过点击按钮,我们将使用 getElementsByTagName() 方法获取所有 p 标签,并计算它们的总数。然后,弹出对话框显示段落总数。

另一个 document.getElementsByTagName() 方法示例

在这个示例中,我们将计算文档中使用的 h2h3 标签的总数。

<script type="text/javascript">
function counth2() {
  var totalh2 = document.getElementsByTagName("h2");
  alert("Total h2 tags are: " + totalh2.length);

function counth3() {
  var totalh3 = document.getElementsByTagName("h3");
  alert("Total h3 tags are: " + totalh3.length);
<h2>This is h2 tag</h2>
<h2>This is h2 tag</h2>
<h3>This is h3 tag</h3>
<h3>This is h3 tag</h3>
<h3>This is h3 tag</h3>
<button onclick="counth2()">Count h2</button>
<button onclick="counth3()">Count h3</button>

在这个示例中,我们有两个 h2 标签和三个 h3 标签。通过点击按钮,我们将使用 getElementsByTagName() 方法获取所有 h2h3 标签,并计算它们的总数。然后,弹出对话框分别显示 h2h3 标签的总数。

注意:在此示例中,输出可能与此页面上显示的示例输出不同,因为它将计算本文档中使用的 p 标签、h2 标签和 h3 标签的总数。

标签: js, JavaScript, JavaScript语言, JavaScript开发, JavaScript语法, JavaScript脚本, JavaScript教程, JavaScript入门, JavaScript入门教程, JavaScript进阶, JavaScript宝典, JavaScript学习, JavaScript指南, JavaScript大全