Home > other >  adding elements to the button when the div.el-pagination
adding elements to the button when the div.el-pagination

Time:06-23

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'))
  • Related