bootstrap中dropdown为什么不能用data-targer来触发？

Question

<td class="dropdown">
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-target=".dropdown-menu" >
        操作
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li><a href="">编辑</a></li>
        <li><a href="">删除</a></li>
    </ul>
</td>

如果这段代码去掉data-target就可以执行下拉，为什么？
那这个下拉菜单不加data-target就能执行，那他是怎么触发的？

Answer 1

dropdown会先根据data-target来寻找下拉菜单，如果没有data-target这个属性，会检测href中的规则，最后会直接查找上级DOM对象中的dropdown-menu为菜单项。

dropdown.js中的相关代码如下

function getParent($this) {
    var selector = $this.attr('data-target')

    if (!selector) {
      selector = $this.attr('href')
      selector = selector && /#[A-Za-z]/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
    }

    var $parent = selector && $(selector)

    return $parent && $parent.length ? $parent : $this.parent()
  }