在以下代码中：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
<script src="program.js"></script>
</head>
<body>
<svg width="820" height="820" xmlns="http://www.w3.org/2000/svg">
<path d= "m 216.9713,604.84056 c 6.58601,-23.29099 13.64437,-46.70354 22.96515,-69.06977 10.50383,-21.60083 19.824,-43.72719 29.43989,-65.7268 1.78556,-4.19648 21.0595,-45.65843 31.44815,-14.94488 0.73548,7.12763 -0.83671,14.35595 -1.51769,21.46949 -1.02533,14.20177 -1.07724,28.45349 -1.09845,42.68544 -0.29386,11.68885 0.56149,19.15603 10.94733,25.52069 7.93457,4.19919 34.90516,3.84861 -0.13003,2.9062 0.83758,-0.59173 1.85237,-0.99058 2.51275,-1.77518 5.62232,-6.67995 8.01849,-24.75261 9.97171,-33.44566 2.26385,-11.52311 3.9,-23.08101 8.79295,-33.82327 0.62371,-1.1366 1.20336,-2.29852 1.87113,-3.40981 5.40716,-8.99854 25.34864,-16.41568 23.7554,0.84319 -1.55826,11.43228 -3.73715,22.74865 -4.95105,34.23073 -0.62337,9.5397 -3.36838,18.47398 -6.53416,27.40006 -2.28311,6.73084 -2.79151,13.81275 -3.0956,20.85707 -0.2311,7.08825 -0.16134,14.18181 -0.12594,21.27247 0.37848,4.94938 -1.66052,11.30401 2.84604,14.52483 7.09445,1.70605 6.35368,1.39182 -15.69615,0.0267 -0.88905,-0.055 1.77397,-0.24065 2.62331,-0.50911 4.0352,-1.27546 7.45468,-3.90598 10.82549,-6.34204 7.35763,-5.22586 12.85855,-13.66661 21.59088,-16.75829 7.0637,0.18424 14.18024,-0.329 21.19112,0.55272 1.72903,0.21744 2.46718,12.06253 2.52732,13.7571 -0.13889,5.79021 0.37084,8.87414 6.14371,10.68408 6.71039,1.25652 19.07813,1.57204 -12.07637,0.44875 -0.92047,-0.0332 1.83988,-0.13445 2.74828,-0.28665 2.02516,-0.33929 3.68812,-0.91049 5.64976,-1.50215 7.70867,-2.64697 12.95043,-8.77668 17.98614,-14.87575 8.47338,-9.94211 12.16541,-8.40553 29.47038,-5.69079 3.08891,0.48458 9.17276,14.17761 10.32697,16.53946 4.81146,9.71804 6.3517,21.47547 14.57347,29.10403 0.81458,0.31648 1.58055,0.81298 2.44372,0.94944 0.82892,0.13105 3.34974,-0.11339 2.51217,-0.16594 -5.62961,-0.35321 -11.36782,0.33336 -16.90599,-0.73715 -1.18923,-0.22988 2.10189,-1.2149 3.07483,-1.93637 1.05248,-0.78046 6.65184,-5.74043 7.27384,-6.2867 6.81606,-6.32824 13.89802,-12.61491 22.92369,-15.38846 16.29359,-0.70077 23.84348,-3.9898 31.98468,8.33753 1.36368,3.06535 2.45829,6.23885 3.63944,9.38515 0,0 -19.74977,0.71276 -19.74977,0.71276 l 0,0 c -1.13238,-2.98691 -2.08225,-6.07175 -3.60164,-8.88382 -7.36863,-9.686 -19.99941,-6.60073 7.20802,-6.95215 -9.19656,1.75778 -16.31918,8.23429 -23.00782,14.4276 -1.08993,0.98612 -8.86449,8.75983 -10.17271,8.95362 -8.9908,1.33182 -19.3454,4.37118 -27.22943,-0.8886 -7.56028,-8.3685 -9.31963,-19.81882 -14.16889,-29.73636 -1.85016,-3.58284 -4.33165,-9.02696 -7.12234,-12.17682 -0.96876,-1.09345 -4.89521,-2.23586 -3.49326,-2.64655 5.21349,-1.52726 10.84068,-0.72913 16.26103,-1.09369 -1.12706,0.58562 -2.3905,0.96202 -3.38117,1.75687 -1.32494,1.06304 -2.31029,2.49093 -3.46544,3.73639 -5.02352,6.35925 -10.1851,12.83152 -17.83802,16.04628 -11.33486,3.67954 -23.96497,4.86558 -35.50489,1.16297 -5.2061,-2.73664 -6.52379,-7.18973 -6.19664,-12.92312 -0.11064,-2.79291 -0.11594,-5.68795 -0.79632,-8.42061 -0.16955,-0.68097 -0.34178,-1.38193 -0.69946,-1.9857 -0.23079,-0.38959 -1.46455,-0.87053 -1.01305,-0.90505 6.01056,-0.45963 12.05326,-0.26671 18.07989,-0.40006 -8.69532,0.74726 -15.0987,11.14227 -21.78078,15.88522 -10.11413,7.95376 -23.46964,15.059 -36.86543,6.61535 -3.98258,-4.77901 -2.68386,-10.26201 -2.81466,-16.10928 -0.005,-7.12171 -0.0172,-14.24464 0.16058,-21.36467 0.32615,-7.24056 0.81436,-14.51329 3.11184,-21.44874 3.20397,-8.77518 6.15887,-17.48849 6.76397,-26.92434 1.19014,-11.45564 3.51399,-22.72616 4.64603,-34.17947 0.52346,-9.10859 -0.73225,-2.44154 19.5911,-2.96777 0.27222,-0.007 -0.55597,-0.23834 -0.80635,-0.13124 -1.32241,0.56565 -2.57294,2.3828 -3.25055,3.4137 -0.68998,1.04971 -1.25985,2.17362 -1.88978,3.26043 -0.99419,2.06726 -2.7663,5.59962 -3.47911,7.73641 -2.77511,8.31892 -3.60329,17.17093 -5.70106,25.65112 -2.13529,9.62401 -4.37303,26.61416 -9.56746,34.66785 -0.68596,1.06355 -1.70893,1.86716 -2.56339,2.80073 -13.42736,0.44258 -26.73898,2.86383 -38.91069,-3.6593 -10.10595,-7.38198 -11.17175,-15.34055 -10.67017,-27.44803 0.14527,-14.2826 0.022,-28.57946 0.75605,-42.84735 0.55029,-6.73071 2.2017,-13.66253 1.25446,-20.36289 -5.41401,-4.37737 -1.80434,-1.24053 18.08575,-1.10738 0.58569,0.004 -1.15865,0.34407 -1.59728,0.73221 -1.94945,1.72504 -4.28588,5.7601 -5.34824,7.66716 -1.37143,2.46189 -2.58952,5.00614 -3.88428,7.50921 -9.88193,21.86783 -18.93238,44.10693 -29.44436,65.69029 -9.35774,21.93265 -17.22649,45.47623 -22.296,68.75965 0,0 -19.53655,-0.44316 -19.53655,-0.44316 z"/>
</svg>
</body>
</html>
我想使用JavaScript获取路径的总长度。我试过这样的事，但没有运气：
var path = document.querySelector('svg path');
path.getTotalLength();
这样做的JS语法是什么？或者我在html文档中做错了什么？
答案 0 :(得分：0)
您的代码有效！
var path = document.querySelector('svg path'),
length = path.getTotalLength();
console.log(length); // 1879.0966796875 (testet on Firefox Nightly 63.0a1)<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
<script src="program.js"></script>
</head>
<body>
<svg width="820" height="820" xmlns="http://www.w3.org/2000/svg">
<path d= "m 216.9713,604.84056 c 6.58601,-23.29099 13.64437,-46.70354 22.96515,-69.06977 10.50383,-21.60083 19.824,-43.72719 29.43989,-65.7268 1.78556,-4.19648 21.0595,-45.65843 31.44815,-14.94488 0.73548,7.12763 -0.83671,14.35595 -1.51769,21.46949 -1.02533,14.20177 -1.07724,28.45349 -1.09845,42.68544 -0.29386,11.68885 0.56149,19.15603 10.94733,25.52069 7.93457,4.19919 34.90516,3.84861 -0.13003,2.9062 0.83758,-0.59173 1.85237,-0.99058 2.51275,-1.77518 5.62232,-6.67995 8.01849,-24.75261 9.97171,-33.44566 2.26385,-11.52311 3.9,-23.08101 8.79295,-33.82327 0.62371,-1.1366 1.20336,-2.29852 1.87113,-3.40981 5.40716,-8.99854 25.34864,-16.41568 23.7554,0.84319 -1.55826,11.43228 -3.73715,22.74865 -4.95105,34.23073 -0.62337,9.5397 -3.36838,18.47398 -6.53416,27.40006 -2.28311,6.73084 -2.79151,13.81275 -3.0956,20.85707 -0.2311,7.08825 -0.16134,14.18181 -0.12594,21.27247 0.37848,4.94938 -1.66052,11.30401 2.84604,14.52483 7.09445,1.70605 6.35368,1.39182 -15.69615,0.0267 -0.88905,-0.055 1.77397,-0.24065 2.62331,-0.50911 4.0352,-1.27546 7.45468,-3.90598 10.82549,-6.34204 7.35763,-5.22586 12.85855,-13.66661 21.59088,-16.75829 7.0637,0.18424 14.18024,-0.329 21.19112,0.55272 1.72903,0.21744 2.46718,12.06253 2.52732,13.7571 -0.13889,5.79021 0.37084,8.87414 6.14371,10.68408 6.71039,1.25652 19.07813,1.57204 -12.07637,0.44875 -0.92047,-0.0332 1.83988,-0.13445 2.74828,-0.28665 2.02516,-0.33929 3.68812,-0.91049 5.64976,-1.50215 7.70867,-2.64697 12.95043,-8.77668 17.98614,-14.87575 8.47338,-9.94211 12.16541,-8.40553 29.47038,-5.69079 3.08891,0.48458 9.17276,14.17761 10.32697,16.53946 4.81146,9.71804 6.3517,21.47547 14.57347,29.10403 0.81458,0.31648 1.58055,0.81298 2.44372,0.94944 0.82892,0.13105 3.34974,-0.11339 2.51217,-0.16594 -5.62961,-0.35321 -11.36782,0.33336 -16.90599,-0.73715 -1.18923,-0.22988 2.10189,-1.2149 3.07483,-1.93637 1.05248,-0.78046 6.65184,-5.74043 7.27384,-6.2867 6.81606,-6.32824 13.89802,-12.61491 22.92369,-15.38846 16.29359,-0.70077 23.84348,-3.9898 31.98468,8.33753 1.36368,3.06535 2.45829,6.23885 3.63944,9.38515 0,0 -19.74977,0.71276 -19.74977,0.71276 l 0,0 c -1.13238,-2.98691 -2.08225,-6.07175 -3.60164,-8.88382 -7.36863,-9.686 -19.99941,-6.60073 7.20802,-6.95215 -9.19656,1.75778 -16.31918,8.23429 -23.00782,14.4276 -1.08993,0.98612 -8.86449,8.75983 -10.17271,8.95362 -8.9908,1.33182 -19.3454,4.37118 -27.22943,-0.8886 -7.56028,-8.3685 -9.31963,-19.81882 -14.16889,-29.73636 -1.85016,-3.58284 -4.33165,-9.02696 -7.12234,-12.17682 -0.96876,-1.09345 -4.89521,-2.23586 -3.49326,-2.64655 5.21349,-1.52726 10.84068,-0.72913 16.26103,-1.09369 -1.12706,0.58562 -2.3905,0.96202 -3.38117,1.75687 -1.32494,1.06304 -2.31029,2.49093 -3.46544,3.73639 -5.02352,6.35925 -10.1851,12.83152 -17.83802,16.04628 -11.33486,3.67954 -23.96497,4.86558 -35.50489,1.16297 -5.2061,-2.73664 -6.52379,-7.18973 -6.19664,-12.92312 -0.11064,-2.79291 -0.11594,-5.68795 -0.79632,-8.42061 -0.16955,-0.68097 -0.34178,-1.38193 -0.69946,-1.9857 -0.23079,-0.38959 -1.46455,-0.87053 -1.01305,-0.90505 6.01056,-0.45963 12.05326,-0.26671 18.07989,-0.40006 -8.69532,0.74726 -15.0987,11.14227 -21.78078,15.88522 -10.11413,7.95376 -23.46964,15.059 -36.86543,6.61535 -3.98258,-4.77901 -2.68386,-10.26201 -2.81466,-16.10928 -0.005,-7.12171 -0.0172,-14.24464 0.16058,-21.36467 0.32615,-7.24056 0.81436,-14.51329 3.11184,-21.44874 3.20397,-8.77518 6.15887,-17.48849 6.76397,-26.92434 1.19014,-11.45564 3.51399,-22.72616 4.64603,-34.17947 0.52346,-9.10859 -0.73225,-2.44154 19.5911,-2.96777 0.27222,-0.007 -0.55597,-0.23834 -0.80635,-0.13124 -1.32241,0.56565 -2.57294,2.3828 -3.25055,3.4137 -0.68998,1.04971 -1.25985,2.17362 -1.88978,3.26043 -0.99419,2.06726 -2.7663,5.59962 -3.47911,7.73641 -2.77511,8.31892 -3.60329,17.17093 -5.70106,25.65112 -2.13529,9.62401 -4.37303,26.61416 -9.56746,34.66785 -0.68596,1.06355 -1.70893,1.86716 -2.56339,2.80073 -13.42736,0.44258 -26.73898,2.86383 -38.91069,-3.6593 -10.10595,-7.38198 -11.17175,-15.34055 -10.67017,-27.44803 0.14527,-14.2826 0.022,-28.57946 0.75605,-42.84735 0.55029,-6.73071 2.2017,-13.66253 1.25446,-20.36289 -5.41401,-4.37737 -1.80434,-1.24053 18.08575,-1.10738 0.58569,0.004 -1.15865,0.34407 -1.59728,0.73221 -1.94945,1.72504 -4.28588,5.7601 -5.34824,7.66716 -1.37143,2.46189 -2.58952,5.00614 -3.88428,7.50921 -9.88193,21.86783 -18.93238,44.10693 -29.44436,65.69029 -9.35774,21.93265 -17.22649,45.47623 -22.296,68.75965 0,0 -19.53655,-0.44316 -19.53655,-0.44316 z"/>
</svg>
</body>
</html>