JS: innerHTML and href with parameters

Question

I have two questions:

how do I pass the parameter in this href? id is a previously declared variable with value. I tried as written below but the id is not read
Also, how can I read this id that I pass in the new html page (detailsbook)?

document.getElementById("book").innerHTML = "<a href='detailsbook.html?id=+id'>"+ myArray.Item.title + "</a>";

Thank you all.

You need to break the string with `"` quotes just like you did for `title` — charlietfl, Jan 05 '22 at 22:19
You might benefit some legibility by using template literals as well — Kinglish, Jan 05 '22 at 22:21
See https://stackoverflow.com/questions/979975/get-the-values-from-the-get-parameters-javascript/979995#979995 for question 2. — Barmar, Jan 05 '22 at 22:22
myArr.Item.Title is the title I have to click on, but I have to pass the id, they are two different things. — a_l_e_x, Jan 05 '22 at 22:22
`+ id` should not be inside the quotes, it should be outside the quotes. — Barmar, Jan 05 '22 at 22:23

score 2 · Accepted Answer · answered Jan 05 '22 at 22:24

2

The easiest way to substitute variables into a string is with template literals rather than concatenation.

document.getElementById("book").innerHTML = `<a href='detailsbook.html?id=${id}>${myArray.Item.title}</a>`;

answered Jan 05 '22 at 22:24

Barmar

10 seconds faster – szaman Jan 05 '22 at 22:25
perfect thanks. You immediately understood what my problem is. Last question: how can I read the past id in this new html page (so in etailsbook.html)? – a_l_e_x Jan 05 '22 at 22:30
See the link I gave above in the comment – Barmar Jan 05 '22 at 22:31

score 2 · Answer 2 · answered Jan 05 '22 at 22:24

2

The cleanest approach is to use template literals:

document.getElementById("book").innerHTML = 
  `<a href="detailsbook.html?id=${id}">${myArray.Item.title}</a>`;

answered Jan 05 '22 at 22:24

szaman

2 Answers2