这里面的role起什么作用，不加效果也一样显示

<div class="container">

    <div class="dropdown">

        <button class="dropdown-toggle btn btn-default " type="button" id="dropdownMenu1" data-toggle="dropdown">

            选择你喜欢的水果

            <span class="caret"></span>

        </button>

        <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">

            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">苹果</a></li>

            <li role="presentation"><a  role="menuitem" tabindex="-1" href="#">香蕉</a></li>

            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">梨</a></li>

            <li role="presentation"><a role="menuitem"  tabindex="-1" href="#">桃</a></li>

        </ul>

    </div>

</div>