How Do I Update One Value Within An Object Using Setattribute?

I have an element that contains an attribute called 'sound'. The value of this sound attribute is an object. One of the properties in this object is 'volume'. In other words:

Solution 1:

You can make use of the 3-argument version of setAttribute which is in the docs here: https://aframe.io/docs/core/entity.html#Updating-Multi-Property-Component-Data

Specifically you can do something like:

element.setAttribute("sound", "volume", "4");

Solution 2:

You could get object corresponding to the attribute, and replace only the properties you need.

Something like this:

vardata = element.getAttribute('sound');
data.volume = '4';
element.setAttribute('sound', data);

Edit

If you set the data in the html like a real JS object, you could do:

var newData = JSON.parse(element.getAttribute('sound'));
newData.volume = 4;
element.setAttribute('sound', JSON.stringify(newData));

Here is a fiddle

Share