I am using the code the JavaScript code which is what i am trying to add the aria-label
but somewhat it is missing somewhere
document.querySelectorAll('.el-pagination').forEach(button => button.setAttribute('aria-label',(button.getElementsByClassName('el-icon-arrow-left').length == 1) ? 'Previous' : 'Next'));
This is my code for the html
<div aria-label="Previous">
<span >
<div >
<!---->
<div >
<!---->
<input type="text" readonly="readonly" autocomplete="off" placeholder="Select" >
<!---->
<span >
<span >
<i ></i>
<!---->
<!---->
<!---->
<!---->
<!---->
</span>
<!---->
</span>
<!---->
<!---->
</div>
<div style="display: none; min-width: 175px;">
<div style="">
<div style="margin-bottom: -17px; margin-right: -17px;">
<ul >
<!---->
<li >
<span>50 items per page</span>
</li>
<li >
<span>100 items per page</span>
</li>
<li >
<span>150 items per page</span>
</li>
<li >
<span>300 items per page</span>
</li>
</ul>
</div>
<div >
<div style="transform: translateX(0%);"></div>
</div>
<div >
<div style="transform: translateY(0%);"></div>
</div>
</div>
<!---->
</div>
</div>
</span>
<button type="button" disabled="disabled" >
<i ></i>
</button>
<ul >
<li >1</li>
<!---->
<li >2</li>
<li >3</li>
<li >4</li>
<!---->
<li >5</li>
</ul>
<button type="button" >
<i ></i>
</button>
</div>
so something in my JavaScript
is going wrong which i can't figure what is
CodePudding user response:
You can add aria-label to the elements in html without using any js here
But if you want you can also do it using js like this:
document.querySelectorAll('.btn-prev').forEach(button => button.setAttribute('aria-label', 'Previous'))
document.querySelectorAll('.btn-next').forEach(button => button.setAttribute('aria-label', 'Next'))