Question

I have a question about how to read the string betweena tag, for example.

Devices connecting to HOME <a onclick="kmt_Toggle('BOX01', this)" class="cs_answer_link" value="[Show me how to download and install my map..]">[Show me how to download and install my map..]</a><br />
<br />
<div class="cs_answer_secondAccordion" id="BOX01" style="display: none;">
Steps for downloading and installing a map...
</div>

My code a simple, when users click on the a tag, the div class will show, and change Show me how to download and install map string in a tag to Close. When users click again, the current “close” will become “original long text”. My main issue is that How i can read the string between a tag, thanks. I can not use JQuery

  function kmt_Toggle(obj, aTag) {
  var el = document.getElementById(obj);
  if ( el.style.display != 'none' ) {
      el.style.display = 'none';
      //var tagString=document.ge(aTag).valueOf();

     // aTag.innerHTML='[more..]';
    aTag.innerHTML= tagString;
  }
  else {
      el.style.display = '';
      aTag.innerHTML='[close..]';
  }
     }

---

Hello Guys, thanks.

I think i have not made my question crystal clear. I want to build a toggle function in this Javascript, if people clicks on a tag, for instance,

<a onclick="kmt_Toggle('BOX01', this)" class="cs_answer_link" value="[Show me how to download and install my map..]">[Show me how to download and install my map..]</a>

It will show my div if my div has style = none; and change Show me how to download and install map into “close”

Steps for downloading and installing a map…

If people click on the link again, it will go back to the “show me how to download and installl map” and hide my div.

I tried to build something by following idealmachine solution. It does not work.

Cheers,
Qing

Answer 1

First of all, the value attribute of an a element is not officially standardized by the W3C. You don’t need it.

That said, some lines of code that might work are:

// innerHTML way
aTag.originalInnerHTML = atag.innerHTML; // to save the innerHTML
aTag.innerHTML = '[close..]';            // to add new link text
aTag.innerHTML = aTag.originalInnerHTML; // to restore the innerHTML


// W3C DOM way
// Save
var cur = aTag.firstChild;
aTag.oldChildNodes = [];
while(cur) {
    aTag.oldChildNodes.push(cur);
    cur = cur.nextSibling;
}

// Add new link text
while(aTag.lastChild) aTag.removeChild(atag.lastChild);
aTag.appendChild(document.createTextNode('[close..]'));

// Restore
while(aTag.lastChild) aTag.removeChild(atag.lastChild);
for(var i = 0; i < aTag.oldChildNodes.length; ++i) {
    aTag.appendChild(aTag.oldChildNodes[i]);
}

Or you could do either of these instead, similar to how you are switching the accordion sections on and off:

• Insert both link texts into the HTML, then use CSS display: none; to switch off the one you do not want.
• Switch between entire a elements using CSS display: none;.