Javascript 我试图显示圆圈的属性值，但它不起作用

我试图显示圆圈的属性值，但它不起作用

我的剧本

var x = document.getElementById("circle").getAttribute("cx");
document.write(x);

我的HTML

<svg width="1000" height="500">
    <circle id="circle" cx="50" cy="50" r="50">
</svg>

---

您的代码在我的代码片段中按预期工作。其他原因导致了你的问题

请注意，值50远低于圆圈，因此您必须滚动一点

可能的情况是，javascript在dom完全加载之前运行。将代码添加到body onload事件处理程序

var x=document.getElementById（“圆圈”）.getAttribute（“cx”）；
文件。编写（x）
圆圈

元素应该是自动关闭的

var x=document.getElementById（“圆圈”）.getAttribute（“cx”）；
文件。编写（x）
如果我正确理解您的问题，您可以尝试从html Javascript访问svg元素。如果您的问题是这个问题，请参见下面的答案：

您想显示什么值如果在window load window.onload=function（）中使用脚本，它将起作用{var x=document.getElementById（“circle”）.getAttribute（“cx”）；document.write（x）；}@VindhyachalKumar我不确定它如何与svg一起工作。但是，由于代码只访问html属性，因此最好在窗口上使用body onload事件处理程序，对吗？您的代码可以工作，只需将
标记的维度减小：
到
到OP，您是否有充分的理由使用
文档。编写
？@zer00ne这不是问题。正如您在我的代码片段中所看到的，它可以与大svg一起工作。它只是将值放在文档的底部。如果您使用css将
位置
更改为绝对/相对/etc，则可以将其置于其上方。但这里不是这样。@zer00ne是的，我知道你的意思。它的功能与OP的代码完全相同，它显示了一个较小的svg。这对问题毫无帮助。如果OP出于任何原因想要一个大的svg，那么它是完全有效的，并且运行良好。@zer00ne这里的大多数答案都说他需要向下滚动。我看不出你的答案有什么附加价值。我认为这比这里的大多数答案更糟糕，因为它表明问题在于svg的大小。事实并非如此。