When attempting to format text label (for dynamic text content) for different layouts (i.e. Desktop, Mobile, Tablet), I’ve seen that elements ID has to be unique even for Layout elements. Therefore I’ve ended up doing this:
var q = hypeDocument.getElementById('questionText'); q.innerHTML = myData[index].question; var q_iphone = hypeDocument.getElementById('questionText_iphone'); q_iphone.innerHTML = myData[index].question; var q_ipad = hypeDocument.getElementById('questionText_ipad'); q_ipad.innerHTML = myData[index].question;
and something like this:
ansA.scrollTop=0; ansB.scrollTop=0; ansC.scrollTop=0; ansD.scrollTop=0; ansA_iphone.scrollTop=0; ansB_iphone.scrollTop=0; ansC_iphone.scrollTop=0; ansD_iphone.scrollTop=0; ansA_ipad.scrollTop=0; ansB_ipad.scrollTop=0; ansC_ipad.scrollTop=0; ansD_ipad.scrollTop=0;
when indeed ansA, ansA_iphone and ansA_ipad are literally the same text label (as the other ones replicated with _iphone or _ipad) to be updated and because of the uniqueness of each text_label in each layout seems to be no other option.
By having many elements & layouts this will grow exponential. Therefore: is there any other way to refer to same element ID or synonymous across different layouts to avoid this code repetition?