HTML - How to store information in a HTML tag as attribute value?

Question

I do have an internal website, which has the function of an video & audio library. My visitors are able to download 2 kind of files from this website.

Video
Audio Only.

The source of these videos are coming from different external locations. The file extensions are different, like .webm, .M4A, .tgpp etc.

I know that most of them are still working, if I change the extension of the files to .MP4. So to make this website more easier for my visitors, regarding the different formats, I decided to offer only .MP4 format.

Means, the client downloads a .MP4 file, even the orginal files has the exstensions of .WEBM or .M4A.

It is not an issue to do that. But what I want to do is, to still keep these informations for troubleshootings in the future, I would like to store the real / orginal filetype in the HTML element.

Question:

Which attribute name can I use for my purpose? Is there anything existing for doing this?

For better understanding, I show it with the an attribute name StoreInformation:

<table id="id_TopTable">
  <tr>
    <td>
      <a href="get-download.php?Source=Example.MP4" StoreInformation='Source_West, M4A, AudioEncoding Aac'><B>Click this</B></a>

    </td>
  </tr>

Short explanation:

User downloads an example.mp4 file.
The attribute StoreInformation stores these informations, which has meaning of: The file comes orginally form the Source in West, its a M4A with Audio AAc encoding.

developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/…* — jmoerdyk
– jmoerdyk, Commented Jan 7, 2019 at 23:03
@JamesAMohler How do you mean, could you make an example please? — Baku Bakar
– Baku Bakar, Commented Jan 7, 2019 at 23:04
<a href="get-download.php?Source=Example.MP4&StoreInformation=Source_West,... — James A Mohler
– James A Mohler, Commented Jan 7, 2019 at 23:06
@JamesAMohler Please not. This is horrible to read :-) but thanks for the suggestion. — Baku Bakar
– Baku Bakar, Commented Jan 7, 2019 at 23:07

Eliabe França · Accepted Answer · 2019-01-07 23:07:00Z

2

I believe the best approach is to use data attributes, it would be:

<a href="get-download.php?Source=Example.MP4" data-information='Source_West, M4A, AudioEncoding Aac'><B>Title 1</B></a>

This way you can retrieve the information by using the property dataset of the element in js:

let information = element.dataset.information

for more: https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

answered Jan 7, 2019 at 23:07

Eliabe França

898 bronze badges

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

Comments

Guilherme Rossato · Accepted Answer · 2019-01-07 23:17:36Z

1

Perfectly valid to add as a new attribute, but I would rather have a more descriptive name and better separation so that you can easily read this information and turn it into something useful:

<a href="something" data-format="webv" data-encoding="Aac">Content</a>

the data-* are documented standard for custom data attributes.

You could even use the setAttribute function to create this attribute into the html with javascript dynamically, like the following snippet:

document.querySelector("a").setAttribute("data-format", "webv");

And retrieving:

console.log(document.querySelector("a").getAttribute("data-format"));

answered Jan 7, 2019 at 23:17

Guilherme Rossato

7115 silver badges13 bronze badges

Collectives™ on Stack Overflow

HTML - How to store information in a HTML tag as attribute value?

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