a标签中某个元素有点击事件，怎么在保留a标签的href的同时，点击内部按钮不进行a标签的跳转？

a标签是一个信息卡片，卡片中有一个按钮是导航按钮，会使用window.open方法 跳转到新页面进行导航，但是如果只是普通的写，在跳转到导航页面之后，a标签还是会跳转。
使用return false 并没有什么用。

因为考虑到页面的seo，不能取消a标签中的href属性，所以我使用的是先将a标签的href属性设置为#，然后在过1秒钟，还原a标签的href属性

   <a target="_blank" href="/wangdian/dian" class="wangdian_card" >  
         <div class="label">网点地址：</div>
               <div class="info add"  name="{$val['com_name']}" wd="{$val['com_wd']}" jd="{$val['com_jd']}" onclick="daohang(event)">
                  <span class="daohang" >导航</span>
               </div>
           </div>
 </a>

 function daohang(event){ 
        let wd = event.currentTarget.getAttribute("wd")
        let jd = event.currentTarget.getAttribute("jd");
        let name = event.currentTarget.getAttribute("name");  
        let str = wd+","+jd;
        let aDom = event.currentTarget.parentElement.parentElement;
        console.log(aDom)
        let href = aDom.getAttribute("href")
        aDom.setAttribute("href","#") //先给他外面的a标签的href设置为#
        window.open("http://api.map.baidu.com/marker?location="+str+"&title="+name+"&content=&output=html");
        
        // return false
        // 延时将href还原
        setTimeout(() => {
            aDom.setAttribute("href",href)
        }, 1000);

    }