Javascript 如何循环SVG中的路径元素？
我在尝试测量Javascript 如何循环SVG中的路径元素？,javascript,html,jquery,svg,Javascript,Html,Jquery,Svg,我在尝试测量标记的每个的长度时，得到了类型错误：logo[I]。getTotalLength不是一个函数 我使用jquery得到了这个错误： jQuery('#logo').each(function(i) { console.log( i + ' ====' + jQuery(this).get(0).getTotalLength()); }); 所以我用javascript重写了相同的代码，但仍然得到相同的错误 javascript代码： const logo= do
类型错误：logo[I]。getTotalLength不是一个函数
我使用jquery得到了这个错误：
jQuery('#logo').each(function(i) {
console.log( i + ' ====' + jQuery(this).get(0).getTotalLength());
});
所以我用javascript重写了相同的代码，但仍然得到相同的错误
javascript代码：
const logo= document.querySelectorAll("#logo");
for (let i=0; i < logo.length; i++)
{
console.log(i," ==== ",logo[i].getTotalLength());
}
const logo=document.queryselectoral（“logo”）；
for（设i=0；i
注意：在这个html代码中只有1个
，我删除了其他的，因为它们非常大
html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body style="background-color: black;">
<svg id="logo" width="80" height="90" viewBox="0 0 80 90" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M32.56 3.24001C41.36 3.24001 49.08 4.96001 55.72 8.40001C62.44 11.84 67.6 16.76 71.2 23.16C74.88 29.48 76.72 36.84 76.72 45.24C76.72 53.64 74.88 61 71.2 67.32C67.6 73.56 62.44 78.4 55.72 81.84C49.08 85.28 41.36 87 32.56 87H3.28V3.24001H32.56ZM31.96 72.72C40.76 72.72 47.56 70.32 52.36 65.52C57.16 60.72 59.56 53.96 59.56 45.24C59.56 36.52 57.16 29.72 52.36 24.84C47.56 19.88 40.76 17.4 31.96 17.4H20.08V72.72H31.96Z" stroke="white" stroke-width="6"/>
</svg>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="app.js"></script>
</body>
</html>
文件
当我从
标签中删除id=“logo”
并将其添加到
中时，它工作得非常好
所以循环不能正常工作 如果要循环遍历具有特定标记名的所有元素，那么有一个函数将获取所有元素：getElementsByTagName
您得到的是父
元素，其中只有一个。您可以遍历它的子元素并找到路径元素，但既然有更简单的方法，为什么还要费事呢
const logo=document.getElementsByTagName（“路径”）；
for（设i=0；i
文件
如果要循环遍历具有特定标记名的所有元素，则有一个函数将获取所有元素：getElementsByTagName
您得到的是父
元素，其中只有一个。您可以遍历它的子元素并找到路径元素，但既然有更简单的方法，为什么还要费事呢
const logo=document.getElementsByTagName（“路径”）；
for（设i=0；i
文件