如何使用JavaScript超链接div类的文本？

Question

我正在开发HTML天气应用程序。它从Yahoo Weather API收集数据。它可以从API获取详细的Yahoo报告链接。 “.city”div类只包含一个文本，即JavaScript中使用此代码的城市名称：

$(".city").text(localStorage.typhoon_location || weather.city)

如何使用JavaScript为文本添加超链接？假设超链接信息计为weather.link。

Answer 1

您可以添加点击处理程序，如

//Add data
$(".city").data("weather-link", weather.link);

//Add click handle
$(".city").on('click', function(){
    //do something
    window.location.href = $(this).data("weather-link");
})

修改

使用

$('.city').html(
  '<a href="' + localStorage.typhoon_link + '">' + localStorage.typhoon_location + '</a>'
  || '<a href="' + weather.link + '">' + weather.city + '</a>')

Answer 2

我希望尽可能减少对DOM的操作：

$('.city').text(
  '<a href="' + localStorage.typhoon_link + '">' + localStorage.typhoon_location + '</a>'
  || '<a href="' + weather.link + '">' + weather.city + '</a>')

这样您可以控制是否要在标签页或新窗口中打开它，而不是替换window.location.href ...