时间戳

首页 > 解决方案 > 使用 JavaScript 向 url 添加参数

javascript - 使用 JavaScript 向 url 添加参数

问题描述

我想将 url 参数添加到我的img src，可以使用getElementById但不能使用getElementsByClassName. 我更喜欢使用getElementsByClassName它，因为它对我的目的更有意义。这是我正在使用的代码：

<img id="parameter" src="http://url-to-image.com/image.jpg" style="width: 100%">

<script>
var image = document.getElementById("parameter");
var imageSrc = image.getAttribute("src");
image.setAttribute("src", imageSrc + "?w=" + viewportWidth + "&h=" + viewportHeight + "&dpr=" + dpr + "&fit=crop");
</script>

上面的代码效果很好，但是使用

<img class="parameter" src="http://url-to-image.com/image.jpg" style="width: 100%">

<script>
var image = document.getElementsByClassName("parameter");
var imageSrc = image.getAttribute("src");
image.setAttribute("src", imageSrc + "?w=" + viewportWidth + "&h=" + viewportHeight + "&dpr=" + dpr + "&fit=crop");
</script>

不会向img src. url 参数应添加到具有“参数”类的所有图像中。如果有人可以帮助我，我会很高兴。

标签： javascriptgetelementbyidurl-parametersgetelementsbyclassname

解决方案

正如其他人所说，getElementsByClassName总是返回列表。我认为您可以改为查看querySelector方法。

var image = document.querySelector(".parameter");

那么您无需查看列表中的第一项。

从性能 的角度来看，getElementByClass 会更快。性能测试

推荐阅读