Question

I am working with a Silverlight application, that when loaded into the browser, it sets an html <param> tag (which is within the silverlight <object> tag) with a value. Later on during the execution of the SL application, I need to change the value attribute of the <param> tag. I’m trying to accomplish this by simply calling a client side javascript function that gets the param tag by it’s id, and then call objById.setAttribute(value,”my new value”). Here’s where it gets strange. Setting the attribute this way seems to work, according to an alert message displaying the value of the attribute AFTER setting it to the new value. However, when I view source on the browser after dismissing the alert dialog, I’m still seeing the old value in the source of the webpage. Any idea why the source view wouldn’t show the new value? The param tag does have a runat="server" attribute on it because it’s initially set by the Silverlight application when it loads. Does the runat=server attribute cause problems here?

HTML:

<div id="silverlightControlHost">
  <object id="silverlightObject" data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
    <param .../>
    <param .../>
    <param .../>
    <param name="initParams" id="Ip" runat="server" />
    ...

Javascript:

function refreshInitParams(newParams) {
  var slObjIp = document.getElementById("Ip");

  //Display Initial Value
  alert(slObjIp.getAttribute("value").toString());
  //Set New Value
  slObjIp.setAttribute("value", "New Value");
  //Display new value
  alert(slObjIp.getAttribute("value").toString());
}

Answer 1

When HTML is parsed, the browser builds a Document Object Model (DOM) out of the raw text. This is somewhat analogous to compiling a computer program, as it organizes the information in a way where the browser can quickly find information it needs and make the overall browser experience smooth. For example, if you call document.getElementById(), the browser isn’t going to re-parse all that HTML again, it’s simply going to look in an index of IDs (probably a hash table) for the element in question.

For this reason, when you update a DOM element, using setAttribute in your case, the browser only updates the DOM. It has no reason to re-generate the HTML the DOM was built from; this would be pointless and create an unnecessary expense. For this reason, you won’t see any DOM changes reflected if you look at the browser source. You’ll only see the source as it originally came from the server.

Hope this helps!