[英]How to change the innerhtml of <td> inside a <tr> using a loop in javascript?
[英]how to change innerHTML using classname inside loop
在这里我的代码我只想通过获取 for 循环内部的类名来更改 btn 的 innerHTML
{% for pbyid in productbyid %}
<div class="card card_body m-2 p-0 container" id='{{pbyid.id}}'>
<div>
<div>
<a href="/viewpage/{{pbyid.id}}"><div class='imagestyle' ><img class="card-img-top " src="{{pbyid.image}}"width="500" height="200" alt="Card image cap "></div></a>
<span class="top-left">{{pbyid.discountpercentage}}% off</span>
</div>
<div class="card-body">
<h5 class="card-title cardtitle">{{pbyid.title}}</h5>
<div><p class="carddesccrip">{{pbyid.desc}} </p></div>
<div class='pricce_card'>
<span class='price'> <b>M.R.P</b> <strike class='carddesc'>RS {{pbyid.discountPrice}}</strike></span>
<span class='final_price'><b>RS. {{pbyid.finalprice}}</b></span>
</div>
</div>
<div class="card-body">
{% comment %} /viewpage/{{pbyid.id}} {% endcomment %}
<p href="" id='' class="btn btn-lg btn-block addbtn caddtocart" onclick="myFunction({{pbyid.id}})" > Add to cart
<i class="fa fa-plus float-right align-center p-2 plusbtn" aria-hidden="true"></i></p>
</div>
</div>
</div>
{% endfor %}
js
我如何从 class 更改 btn 的 html,当我尝试时它不能与类名一起使用,但它与 id 一起使用,但对于 id 是特定的,所以我们必须使用类名,但我不知道如何解决任何人都可以有想法解决它
function myFunction(id) {
var x = document.getElementsByClassName("caddtocart");
x.innerHTML = "added";
console.log(id);
}
<-- another method -->
var x = document.getElementsByClassName("caddtocart");
x.forEach(myFunction(id))
{
document.getElementsByClassName("caddtocart").innerHTML = "Paragraph changed!";
console.log(id);
}
</script>
试试下面的代码:
function myFunction(id) {
var els = document.getElementsByClassName("caddtocart");
Array.prototype.forEach.call(els, function(el) {
elm.innerHTML = "Paragraph changed!";
console.log(el.id);
});
}
或首先检查id
:
function myFunction(id) {
if(id) {
var elm = document.getElementById(id);
elm.innerHTML = "Paragraph changed!";
} else {
var els = document.getElementsByClassName("caddtocart");
Array.prototype.forEach.call(els, function(el) {
elm.innerHTML = "Paragraph changed!";
console.log(el.id);
});
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.