CODEWITHSUNDEEP
javascriptjqueryhtmljson
marknorkin
marknorkin

Reputation: 4064

Get attribute from HTML element that is a json value using JS

I have the following json returned from service:

{
"html": "<iframe width=\"480\" height=\"270\" src=\"https://www.youtube.com/embed/FQpUOimNvXA?feature=oembed\" frameborder=\"0\" allowfullscreen></iframe>"
}

How can I get src attribute value i.e. https://www.youtube.com/embed/FQpUOimNvXA?feature=oembed using javascript ?

Upvotes: 4

Views: 924

Answers (2)

KAD
KAD

Reputation: 11102

Create a jQuery object from the iframe and obtain the src attribute:

var jsonString = {"html": "<iframe width=\"480\" height=\"270\" src=\"https://www.youtube.com/embed/FQpUOimNvXA?feature=oembed\" frameborder=\"0\" allowfullscreen></iframe>"}
var src = $(jsonString.html).attr("src");
$("#source").html(src);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="source"></div>

Upvotes: 5

guradio
guradio

Reputation: 15555

FIDDLE

var data = {
"html": "<iframe width=\"480\" height=\"270\" src=\"https://www.youtube.com/embed/FQpUOimNvXA?feature=oembed\" frameborder=\"0\" allowfullscreen></iframe>"
}

console.log(data.html);

var str = data.html;
var word = str.split(" ");
var word1 = word[3].split('"');
console.log(word1[1]);

I made split a couple of times i ended up with https://www.youtube.com/embed/FQpUOimNvXA?feature=oembed

Upvotes: 1

Related Questions