请参阅第二栏中的对象(Refer to object in second column)

请参阅第二栏中的对象(Refer to object in second column)

我正在尝试引用第二列中的对象（对象link_icon ）并基于.json数据，我正在分配新的url。

我的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>

---

$(function(){ var url = 'img_and_data/' + randomNumbers[bgImgIndex] +'.json'; var title = $("#title");// the id of the heading var author = $("#author a");// id of author var link_icon = $(".link_icon a"); // <------- problem probably is here $.getJSON(url, function (data) { title.text(toTitleCase(data.title)); author.text(data.copyright); author.attr("href", data.url); link_icon.attr("href", data.permalink); }); }

这是我的完整代码： https ： //jsfiddle.net/cvv0sen8/8/

我应该如何引用link_icon来修改href ？

你可以帮帮我吗？

---

JSON：

{ "title": "example title", "copyright": "example author", "permalink": "https://www.bing.com/", "url": "http://www.yahoo.com" }

I am trying to refer to object in second column (object link_icon) and based on .json data, I am assigning new url.

Structure of my 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>

---

$(function(){ var url = 'img_and_data/' + randomNumbers[bgImgIndex] +'.json'; var title = $("#title");// the id of the heading var author = $("#author a");// id of author var link_icon = $(".link_icon a"); // <------- problem probably is here $.getJSON(url, function (data) { title.text(toTitleCase(data.title)); author.text(data.copyright); author.attr("href", data.url); link_icon.attr("href", data.permalink); }); }

Here is my full code: https://jsfiddle.net/cvv0sen8/8/

How should I refer to link_icon to modify href?

Could you help me?

---

JSON:

{ "title": "example title", "copyright": "example author", "permalink": "https://www.bing.com/", "url": "http://www.yahoo.com" }

最满意答案

var link_icon = $（“。link_icon a”）;

您的选择器在这里的意思是“每个标签都有一个带link_icon作为父级的标签”。 问题是你的html文件在link_icon中没有包含任何标签：你的选择器将不会返回任何内容。

你可以像这样改变你的html：

<div><a class="link_a" href="#"><i class="link_icon"></i></a></div>

而你的js：

var link_a = $(".link_a"); // ... link_a.attr("href", data.permalink);

var link_icon = $(".link_icon a");

Your selector here means "every a tag which has a tag with class link_icon as a parent". Problem is your html document doesn't contain any a tag in link_icon: your selector will return nothing.

You may change your html like this:

<div><a class="link_a" href="#"><i class="link_icon"></i></a></div>

And your js:

var link_a = $(".link_a"); // ... link_a.attr("href", data.permalink);