如何点击指定选择器的带onclick链接，提取目标div内容并追加至新div

问题场景 #

选择器.bdView > .row > div a[onclick]匹配到的多个链接，点击时会通过onclick事件触发函数，将内容加载到#amendinfo0和#amendinfo1两个div中。需要实现：点击每个链接后，提取这两个div的加载内容，将所有内容追加到一个新创建的div内。

示例链接代码：

<a href="javascript:void(0);" onclick="amendinfoBtn('art1', 'art')">Article 1</a>

原代码的问题 #

你提供的代码存在两个关键问题：

1. 正则匹配失效：原代码试图从onclick属性中匹配'#amendinfo\d+'，但实际onclick里的函数是amendinfoBtn('art1', 'art')，完全没有包含目标div的选择器字符串，导致match返回null，后续代码报错。
2. 未处理内容加载时机：直接遍历链接就提取div内容，此时链接还未被点击，#amendinfo0和#amendinfo1里的目标内容还未加载，无法获取有效数据。

修正后的实现代码 #

// 创建用于存放合并内容的新div
const combinedContentDiv = $('<div>').attr('id', 'combined-amend-info');

// 获取所有目标链接
const links = $('.bdView > .row > div a[onclick]');

// 遍历每个链接，触发点击并提取内容
links.each(function() {
  // 触发链接的点击事件，触发内容加载
  $(this).click();
  
  // 提取两个目标div的内容
  const info0Content = $('#amendinfo0').html() || '';
  const info1Content = $('#amendinfo1').html() || '';
  
  // 将内容追加到合并div中（添加分隔区块方便区分不同链接的内容）
  combinedContentDiv.append(
    $('<div>').addClass('link-content-block').append(info0Content, info1Content)
  );
});

// 将合并后的div添加到页面body中
$('body').append(combinedContentDiv);

补充说明 #

• 如果amendinfoBtn是异步加载内容（比如通过AJAX请求），直接点击后立即提取内容可能获取不到，这时需要修改为等待异步完成后再提取。可以通过监听目标div的内容变化事件，或者修改amendinfoBtn函数添加回调来处理。
• 代码中添加了.link-content-block类和#combined-amend-infoID，方便后续对合并内容进行样式控制。
• 处理了内容为空的情况，避免追加undefined到容器中。

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