如何使用javascript按类名更改html元素的值

Question

这是我用来改变html元素值的代码***

<a class="classname" href="Vtech.com"> This text to be chnage</a>

---

<script type="text/javascript">
document.getElementsByClassName("classname")[0].innerHTML = "aaaaaaqwerty";
</script>

如何在页面加载实例上更改此文本

Answer 1

似乎你需要添加DOMContentLoaded或将你的脚本放在</body>之前

原生JavaScript解决方案

document.addEventListener("DOMContentLoaded", function(event) {
  document.getElementsByClassName("classname")[0].innerHTML = "qwerty";
});

---

在</body>之前添加脚本

---

使用jQuery的版本

$(funtion(){
   $(".classname:first").text("qwerty");
});

Answer 2

您可以使用css选择器，但它可能不安全，因为此方法返回首次出现：

document.querySelector(".classname");

顺便说一句，几乎所有开发人员都使用一些js框架：jQuery，prototype，extJs等

Answer 3

使用jquery（我指的是jquery，因为你已经在你的问题中标记了它），你可以像下面这样实现：

$(funtion(){
    $("a .classname")[0].text("aaaaaaqwerty");
});

Answer 4

$(document).ready(funtion(){
    $(".classname").text("aaaaaaqwerty");
});

Answer 5

你可以用它

document.addEventListener("DOMContentLoaded", function(event) {
  document.getElementsByClassName("classname")[0].innerHTML = "some texts";
});

使用jQuery

$(document).ready(function(){
   $(".classname").eq(0).val("aaaaaaqwerty");
});