a标签内嵌套span标签引发的问题，

Question

<a href="http://www.baidu.com/"><span>百度一下</span></a>

问题描述：
a标签内嵌套span标签，为什么span标签就具有了a标签的特性？？

我明明在span的事件上阻止了click事件冒泡（防止span的click事件冒泡到a标签上，而引发页面跳转；而且也在a标签的对象上添加了阻止事件的默认行为，防止a标签进行页面跳转）但是当点击span标签后，还是进行了跳转，且a标签对象的事件处理函数并没有执行。就是说这次跳转跟a标签没有一点关系，完全是因为span标签的click事件进行的跳转？？？
难道a标签嵌套span标签会导致span标签具有a标签的效果吗？

请大家看代码吧

    <a href="http://www.baidu.com/"><span>span一下</span></a>
    <script>
        $('span').on('click', function(event){
            console.log("span.click");
            event.stopPropagation();//阻止了冒泡
            //event.preventDefault();//阻止事件默认行为，成功
            // return false;
        })
        $('a').on('click', function(event){
            console.log("a.click");
            event.preventDefault();
        })
    </script>

如果不在span标签的事件处理函数中添加event.preventDefault()，就会进行页面跳转（当然return false也可以阻止冒泡和事件默认行为）

问题在于：

为什么span标签就成了a标签的效果呢？

Answer 1

你的a标签的href有路径啊，这个是标签自带的跳转，不是绑定在点击事件上的

Answer 2

原来a标签内不管有什么标签，比如说把a标签改成block、inline-block使得a标签内可以添加一些其他的标签，不管点击a标签内的哪一个，如果a标签href属性有连接，都会跳转。
可以参考下面问题中关于a标签的回答

a标签的href引发的点击事件问题