# How do I add data attributes to a script using the HTML builder
**URL:** https://meta.discourse.org/t/how-do-i-add-data-attributes-to-a-script-using-the-html-builder/124026
**Category:** Development
**Created:** [7월 26, 2019, 8:10오전 UTC](https://meta.discourse.org/t/how-do-i-add-data-attributes-to-a-script-using-the-html-builder/124026 "2019-07-26T08:10:55Z")
**Posts on this page:** 3
**Page:** 1
### Author:  [@pebble](https://meta.discourse.org/u/pebble)
#### Post date: [7월 26, 2019, 8:10오전 UTC](https://meta.discourse.org/t/how-do-i-add-data-attributes-to-a-script-using-the-html-builder/124026/1 "2019-07-26T08:10:55Z")
I’m new to ember. is the `h` function that is used in some pages to build HTML part of the ember project? I haven’t been able to find documentation on it.
Searching “ember h javascript” doesn’t do the trick
The specific problem I am trying to solve is add a data attribute to a script tag I am creating.
e.g.
```js
h("script", {src: "http://localhost:5000/pass.js", "data-space": "123"}),
```
This creates a script tag wit the correct src but the `data-space` attribute is missing.
---
### Author:  [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [7월 26, 2019, 9:32오전 UTC](https://meta.discourse.org/t/how-do-i-add-data-attributes-to-a-script-using-the-html-builder/124026/2 "2019-07-26T09:32:42Z")
Ah yeah. The only documentation we reference that I can find is [virtual-dom/virtual-hyperscript/README.md at master · Matt-Esch/virtual-dom · GitHub](https://github.com/Matt-Esch/virtual-dom/blob/master/virtual-hyperscript/README.md) and it’s sort of hidden in our codebase as a comment 🙂 Even with that I couldn’t find the answer you are looking for there. In any case, there is a topic here on Meta that does have the solution:
> [@Widget Helper stripping attributes?](https://meta.discourse.org/t/widget-helper-stripping-attributes/68014/2):
>
> [https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/widgets/header.js.es6#L93-L104](https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/widgets/header.js.es6#L93-L104) As per above code, I guess it should be like below decorateWidget('header-icons:before', helper =\> { return h('li.header-dropdown-toggle', [ h('a.icon.btn-flat', { 'id': 'my id', 'href': 'http://example.com', 'title': 'my title', 'attributes': { 'aria-label': 'my label', …
So based on the code you provided, it should work if you change it to the following:
```js
h("script", { src: "http://localhost:5000/pass.js", attributes: { "data-space": "123" } }),
```
---
### Author:  [@eviltrout](https://meta.discourse.org/u/eviltrout)
#### Post date: [7월 26, 2019, 8:51오후 UTC](https://meta.discourse.org/t/how-do-i-add-data-attributes-to-a-script-using-the-html-builder/124026/3 "2019-07-26T20:51:01Z")
There is also this post that explains how the virtual dom / widget part of Discourse works:
> [@A tour of how the Widget (Virtual DOM) code in Discourse works](https://meta.discourse.org/t/a-tour-of-how-the-widget-virtual-dom-code-in-discourse-works/40347):
>
> This is out of date. See [Widgets, the Widget API and their roadmap?](https://meta.discourse.org/t/widgets-the-widget-api-and-their-roadmap/292624) The latest builds of Discourse are much faster at rendering topics thanks to our [re-written post stream](https://eviltrout.com/2016/02/25/fixing-android-performance.html). I’ve written up [our new plugin API](https://meta.discourse.org/t/a-new-versioned-api-for-client-side-plugins/40051) but so far haven’t explained how the code all fits together. The purpose of this topic is to allow Discourse developers to understand how the new code works. What’s a Virtual DOM? A Virtual DOM is a data structure that enables browsers to re-render dynamic content very quickly. The techniq…