如何基于JSON数据为第二列的link_icon元素分配新URL？

嘿，我明白你要做的事了——找到那个包含.link_icon的<a>标签，然后从指定的JSON文件里拿新URL替换掉它原来的href对吧？我来帮你把代码补全并说明清楚。

实现思路 #

1. 先用jQuery精准定位到目标<a>标签：因为.link_icon是<a>的子元素，所以用$('a:has(.link_icon)')就能直接选中它
2. 发起AJAX请求加载你的JSON文件
3. 从返回的JSON数据里提取你需要的URL字段（这里假设JSON里有个targetUrl，你可以根据自己的JSON结构改）
4. 把新URL赋值给目标<a>的href属性

完整代码示例 #

你的现有HTML结构 #

<div class="details"> 
  <h1 id="title">title</h1> 
  <h3 id="author"> 
    <a href="https://www.google.pl/">author</a> 
  </h3> 
</div> 
<a href="https://www.google.pl/"> 
  <div><i class="link_icon"></i></div> 
</a>

补全后的JavaScript代码 #

$(function(){
  // 这里假设randomNumbers和bgImgIndex已经在其他地方定义好了哦
  var jsonUrl = 'img_and_data/' + randomNumbers[bgImgIndex] +'.json';
  
  // 加载JSON文件
  $.getJSON(jsonUrl)
    .done(function(jsonData) {
      // 找到带link_icon的a标签
      var targetLink = $('a:has(.link_icon)');
      
      // 从JSON里取新URL，记得换成你实际的字段名！
      var newTargetUrl = jsonData.targetUrl;
      
      if (newTargetUrl) {
        // 更新链接地址
        targetLink.attr('href', newTargetUrl);
        console.log('链接已成功更新为:', newTargetUrl);
      } else {
        console.warn('JSON文件里没找到有效的URL字段哦');
      }
    })
    .fail(function(errorObj, status, errorMsg) {
      console.error('加载JSON文件失败了:', status, errorMsg);
    });
});

一些额外提示 #

• 你的JSON文件结构得是合法的，比如可以是这样：

  {
    "targetUrl": "https://your-desired-url-here.com",
    "authorUrl": "https://author-profile-url.com"
  }
  

• 如果页面里有多个带.link_icon的<a>，可以用each()遍历处理每一个：

  $('a:has(.link_icon)').each(function() {
    $(this).attr('href', newTargetUrl);
  });
  

• 要是你还想同时更新作者的链接（就是#author里的那个<a>），可以在done回调里加一行：

  $('#author a').attr('href', jsonData.authorUrl);
  

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