Remove slash fromJSON array

Question

So there are questions like this, but this is slightly different. My JSON array holds an image url:

https://d13yacurqjgara.cloudfront.net/users/329207/screenshots/2798176/bemocs_rei_dribbble.jpg.

When I parse the JSON with jquery, the img src returns with a slash (/) at the end:

https://d13yacurqjgara.cloudfront.net/users/329207/screenshots/2798176/bemocs_rei_dribbble.jpg/

So I get an error and the image cannot be loaded. How can I remove that one slash?

Here is my code for my json parser:

$(document).ready(function() {
    $.getJSON('scripts/json/articles.json', function(data) {
        $.each(data, function(i) {
            parent = $("<div class='card'/>");
            a = $("<a href=" + data['articles']['0'].Link + " target='_target'/>")
            li = $("<li class='bottom-description'/>");

            parent.append(a);

            a.append("<img src=" + data['articles']['0'].Image + "/>");
            a.append(li);

            li.append("<p class='title'>" + data['articles']['0'].Title + "</p>");
            li.append("<h3 class='desc'>" + data['articles']['0'].Description + "</h3>");
            $('.card-section').append(parent);
        })
    });
})

The slash comes from "/>"

tkausl
– tkausl

2016-06-24 23:50:13 +00:00
Commented Jun 24, 2016 at 23:50 — tkausl
– tkausl, Commented Jun 24, 2016 at 23:50
@tkausl, wow that is remarkbly dumb on my part! Thanks!

Tino Caer
– Tino Caer

2016-06-24 23:55:22 +00:00
Commented Jun 24, 2016 at 23:55 — Tino Caer
– Tino Caer, Commented Jun 24, 2016 at 23:55

Ian T · Accepted Answer · 2016-06-24 23:58:48Z

1

I believe you need to put the image source in quotes. The "/" is coming from the "/>".

The solution is to replace line 10 with ...

a.append("<img src='" + data['articles']['0'].Image + "' />");

Notice the single quote added next to "src=" and "/>".

answered Jun 24, 2016 at 23:58

Ian T

465 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

lexx9999 · Accepted Answer · 2016-06-25 00:03:47Z

1

   a.append("<img src=" + data['articles']['0'].Image + "/>");

Outputs <img src=url/>. Thus you get url/ as src. Minimum change is to add a space before / but better practice is to also add quotes.

   a.append("<img src='" + data['articles']['0'].Image + "' />");

Same here:

a = $("<a href='" + data['articles']['0'].Link + "' target='_target'/>")

Once you have spaces in values, quotes are necessary.

answered Jun 25, 2016 at 0:03

lexx9999

7463 silver badges9 bronze badges

Collectives™ on Stack Overflow

Remove slash fromJSON array

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related