Retrieve values from string using javascript. ( String is piece of HTML )

Question

I am a C# developer. My clientside javascript skills are very low.

In javascript I have a string value. That contains the following:

<div id="foo" data-redirectURL="bar">
    <div>Lorem Ipsum</div>
</div>

How do I retrieve the value of data-redirectURL in this case: "bar" ?

Everyone who's answer this question, please notice that he said the HTML is in a string, not in the DOM. — Barmar
– Barmar, Commented Feb 20, 2017 at 16:47

ibrahim mahrir · Accepted Answer · 2017-02-20 16:50:05Z

2

Use attr like this:

var str = '<div id="foo" data-redirectURL="bar"><div>Lorem Ipsum</div></div>';

var value = $(str).attr("data-redirectURL");

console.log(value);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

answered Feb 20, 2017 at 16:50

ibrahim mahrir

31.8k5 gold badges50 silver badges78 bronze badges

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

2 Comments

Tony_KiloPapaMikeGolf Over a year ago

I tested this code and it worked. So I accept this as the answer!

Tony_KiloPapaMikeGolf Over a year ago

You took the effort to read my question. And provided the most simple and readable answer. Thank you!

Zakaria Acharki · Accepted Answer · 2017-02-20 16:55:10Z

1

You could adjust your data attribute and use data() :

$('#foo').data('redirect-url');

HTML :

<div id="foo" data-redirect-url="bar">
    <div>Lorem Ipsum</div>
</div>

Hope this helps.

DOM snippet :

console.log( $('#foo').data('redirect-url') );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="foo" data-redirect-url="bar">
  <div>Lorem Ipsum</div>
</div>

String snippet :

var my_string = '<div id="foo" data-redirect-url="bar"><div>Lorem Ipsum</div></div>';

console.log( $(my_string).data('redirect-url') );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

edited Feb 20, 2017 at 16:55

answered Feb 20, 2017 at 16:48

Zakaria Acharki

67.5k15 gold badges79 silver badges106 bronze badges

1 Comment

ibrahim mahrir Over a year ago

I have a string value, he said!

Carsten Løvbo Andersen · Accepted Answer · 2017-02-20 16:46:55Z

0

There is multiple ways of getting a data attribute value on

jquery: $('#foo').attr("data-redirectURL")

javascript: document.getElementById('foo').getAttribute('data-redirectURL');

console.log($('#foo').attr("data-redirectURL"))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="foo" data-redirectURL="bar">
    <div>Lorem Ipsum</div>
</div>

edited Feb 20, 2017 at 16:46

answered Feb 20, 2017 at 16:43

Carsten Løvbo Andersen

27.1k10 gold badges53 silver badges80 bronze badges

4 Comments

Steeve Pitis Over a year ago

with jquery you can just use $('#foo').data("redirectURL")

Barmar Over a year ago

This searches the DOM, not a string.

Tony_KiloPapaMikeGolf Over a year ago

@SteevePitis : please consider the fact that the HTML is a string ! It is not part of the DOM!

ibrahim mahrir Over a year ago

I have a string value, he said!

Collectives™ on Stack Overflow

Retrieve values from string using javascript. ( String is piece of HTML )

3 Answers 3

2 Comments

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related