jQuery设置锚点href后给子元素赋相同ID出现[object Object]错误如何解决

• 赋值逻辑错误：jQuery 的attr()方法执行设置属性操作时，返回值是当前调用方法的 jQuery 元素对象，而非你设置的属性值。你直接将这个对象赋值给anchorid变量，后续给id属性赋值时，对象会被强制转为字符串[object Object]，就是你看到的异常结果。
• 选择器范围错误：each循环内部使用了全局选择器$(".horizontal-tab-button a strong")，如果页面存在多个标签项，会导致所有<strong>的id被重复覆盖，无法实现每个锚点和对应元素匹配的需求。

$(".horizontal-tab-button a").each(function() {
    // 第一步：先提取strong文本并格式化得到锚点字符串
    const anchorStr = $(this).children('strong').text().replace(/ /g,"_").toLowerCase();
    // 第二步：给当前a标签设置href属性
    $(this).attr('href', '#' + anchorStr);
    // 第三步：仅给当前a标签下的strong设置对应id
    $(this).children('strong').attr('id', anchorStr);
});

运行以上代码即可得到你预期的<strong id="application">效果。

内容的提问来源于stack exchange，提问作者user3108268