how to change div tag contents

[mcpalmer]

I can't do it!!!?? I'm extracting values from url variables and adjusting page contents accordingly. How do i get the tag contents and change them? Here is the code to get it bit its not working:

document.getElementById("pictitle").value=delineate(text);

"value" is not working and i've looked on this site for help but no luck

[mcpalmer]

ok, i've figured it now, just use document.write inside div tags. I thought there was a way to access content of tags directly because of tag id but i think thats just for changing the tags attributes and not content. bleargh

[mwinter]

How do i get the tag contents and change them?

Well, it depends what the contents are, and how you plan to change them. There are two approaches, but which one you use will depend on purpose. It's too late for me to explain them both now, so either that will have to wait until tomorrow, or preferably you'll give us a little hint and save a little time.

Mike

[mcpalmer]

Well, i'm passing variables from one page to another, for a pic gallery, and don't want to use serverside scripting so i'm using a jscript hack i found. It basically breaks the url variable string sent from thumbs page up, based on = and & symbols, and sends to a page where the enalrged pic is displayed. It works on my computer ok but haven't tried it in mac ie yet! ha, thats a laugh.
Code is:

<script>
	var locate = window.location;
	document.pic.picname.value = locate;
	var text = document.pic.picname.value;
	//set main title
	document.write("<div class=\"title1\" style= \"margin-top: 16px; margin-left: 16px;\">"+delineate2(text)+"</div>");
	</script>

where i want to add content to a div tag i just write out the whole tag in jscript. There is a form in body called pic with element picname used to pick up url variable string. Do you know if there is there an easier way than this to do what i want to do?

[mwinter]

There is a form in body called pic with element picname used to pick up url variable string.

That shouldn't work at all. I suggested an alternative to jscheuer's delineate function called fromQuery, which directly obtains the value in a name=value pair.

Do you know if there is there an easier way than this to do what i want to do?

Not especially. It can be slightly shorter, though. First the fromQuery function (and some kludgy [for the moment] support code). Obviously it would be best to place this in some common location.

if(('function' != typeof this.decodeURIComponent)
 && ('function' == typeof this.unescape)) {
  this.decodeURIComponent = function(c) {
    return unescape(c);
  };
}

function fromQuery(name) {
  var re = new RegExp('(\\?|&)' + name + '=?([^&]*)'),
      m;

  if((m = re.exec(document.URL))) {return decodeURIComponent(m[2]);}
}

Then, for the markup:

<div class="title1" style="margin: 16px 0 0 16px;">
<script type="text/javascript">document.write(fromQuery('picname'));</script>
</div>

If you have some spacing issues, it's probably because of the whitespace (that is, the new lines) between the start and end tags of the two elements. Remove that and all should be well.

Mike

[jscheuer1]

document.getElementById("pictitle").value=delineate(text);

If the content of a division (the <div> tag) is what you want to influence, try:

document.getElementById('pictitle').innerHTML=delineate(text);

A note: I am in the process of updating my sending and receiving code for passing a variable from one page to another. It will appear somewhere in these forums when I get it to my satisfaction. The use of a form is no longer required unless form data on the receiving page is desired. The working form of my code as it is now:

On the sending page (in the simplest situations):

<a href="some.htm?var1=someinfo">Link Text or Image Tag</a>

On the receiving page (also for the simplest situations):

<script type="text/javascript">
var text = unescape(window.location.href);
function delineate(str) {
theleft = str.indexOf("=") + 1;
theright = str.indexOf("&");
return(str.substring(theleft, str.length));
}
var sentInfo=delineate(text)

//In this space you can do what you wish with the sent
//information now contained in the variable: sentInfo
</script>

By the simplest situations I mean ones where you control what is being sent and can be sure (by testing) that no special characters that would result in errors or garbage being received are sent. Spaces may be sent as %20.

[mcpalmer]

jscheuer, ok thanks, thats what i wanted to know. So instead of writing:

var locate = window.location;
	document.pic.picname.value = locate;
	var text = document.pic.picname.value;

I write:

var text = unescape(window.location.href);

and there is no need for the form anymore, correct?

mwinter, I'm not sure how the form bit works exactly because the name of the form and its element appears to be irrelevent, its just a way of accessing the url string. I got the original hack from http://www.htmlgoodies.com/beyond/javascript/article.php/3471111

[mwinter]

If the content of a division (the <div> tag) is what you want to influence, try:

document.getElementById('pictitle').innerHTML=delineate(text);

But as the content is being generated based on the URL, not some event after loading, both innerHTML and the W3C DOM aren't appropriate (which is why I steered away from them).

var text = unescape(window.location.href);

If you leave the decoding until the last operation, you can handle both simple and complex values.

function delineate(str) {
theleft = str.indexOf("=") + 1;
theright = str.indexOf("&");
return(str.substring(theleft, str.length));
}

Though I dislike this function due to its gross simplicity, you could easily incorporate your modification into the original by modifying the return statement to:

return str.substring(theleft, (-1 != theright) ? theright : str.length);

thereby coping with both one name/value pair, or more than one.

Spaces may be sent as %20.

Or just don't use spaces in published filenames. Use underscores (_) or hyphens (-) instead.

mwinter, I'm not sure how the form bit works exactly because the name of the form and its element appears to be irrelevent, its just a way of accessing the url string.

Indeed. The original author is just mind-bogglingly stupid.

I got the original hack from http://www.htmlgoodies.com/beyond/ja...le.php/3471111

Oh, my &deity;! To be completely serious, if there are other articles of that "quality" from a site that claims to be "The ultimate html resource", I strongly recommend you never visit there again. That piece is about the most ludicrous thing that I've read in a long time. Granted, it's ancient (or at least I hope it is), but to jump through hoops like that, rather than just use the href property (which is a string, and has existed since JS1.0[1]) is ridiculous. Even the delineate function is pathetic for its time.

No, the form isn't necessary. It never was.

Mike


[1] If both Netscape's and Microsoft's documentation is wrong and the href property wasn't available since the JS1.0 era, the form could still be avoided with '' + location, which would coerce the location object to a string.

[jscheuer1]

there is no need for the form anymore, correct?

That's right.