Using Javascript DOM to Get Elements But Exclude Children

October 30th, 2009 Adam 2 comments

This is a pretty basic concept, but it wasn’t immediately obvious to me at first.

I had nested DIV layers, and wanted to only get the outer level of DIVs.

For example:

<DIV id="content">
  <DIV id="parentDIV-1">
    <DIV class="childDiv"></DIV>
    <DIV class="childDiv"></DIV>
    <DIV class="childDiv"></DIV>
  </DIV>
  <DIV id="parentDIV-2">
    <DIV class="childDiv"></DIV>
    <DIV class="childDiv"></DIV>
    <DIV class="childDiv"></DIV>
  </DIV>
</DIV>

I wanted to get all of the parent DIVs from content. Of course, I kept trying to use getElementsByTagName but that would return ALL the DIVs, including the children.

I figured using childNodes would return the same results, but to my surprise, it worked! It returned only the parent DIVs! Again, this is probably very obvious to alot of people, but it wasn’t to me. Hopefully someone else who is having the same problem will stumble upon this solution.

 

In summary:
  document.getElementById("content").getElementsByTagName("div")
    returns 8 DIVs – both parents and all their children

  document.getElementById("content").childNodes
    returns 2 DIVs – only the parents

Drawing A Sine Wave In Actionscript

August 7th, 2009 Adam 9 comments

Just a simple way to draw a sine wave with a specific amplitude and frequency. Use the sliders to adjust the values.
(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)

Here’s the main function:

function drawWave(amp:int, freq:int):void{
	newSine.graphics.clear();
	newSine.graphics.lineStyle(2, 0xff0000, 0.4);
	newSine.graphics.moveTo(0, yaxis);
	for(var i:int=0; i&lt;=stage.stageWidth; i++){
		var ang:Number = 2 * Math.PI * freq * i/stage.stageWidth;
		newSine.graphics.lineTo(i, yaxis - amp*Math.sin(ang));
	}
}

(EDIT 8/14/09: In the SWF above, the sine wave is upside down. That’s because I had a typo when I wrote it. On line 7 of the code, I had typed “…yaxis + amp…” but it should be minus. The code above is correct, but the SWF hasn’t been updated)

Gray CRX Theme for Google Chrome Dev

August 4th, 2009 Adam 1 comment

I just switched to the latest dev build of Google Chrome, and it supports multiple themes, in an easy-to-install .crx format. So I thought I’d go ahead and make my gray theme (since I can’t stand the default bright blue). Another benefit is finally being able to skin the bookmark bar.

If you want to switch to dev build from stable OR beta, just grab the chrome changer file and switch to dev, then close and restart Chrome. Then click the wrench then click About Google Chrome. Then get the latest version. You can now install crx themes.

Here’s the theme file:
Simply Gray

Categories: misc Tags: , , , , , , , ,