We Keep Coding

Can I use JS .offsetHeight result in equation to style child element?

Thanks for reading this.
I'm trying to obtain the .offsetHeight of a parent element, so that I can use it to automatically adjust the margin of a child element to align things properly.
Is it possible to apply a result from .offsetHeight into an equation?
Thank you!

Yes, use .parentElement.offsetHeight
E.G:
document.getElementById('post-form').parentElement.offsetHeight;

HTML-Element bring to front with "z-index" or "append"?

HTML document has some HTML-Elements such as div, p, img, ...
Most of them are dynamically created ( if helpful css: "position:absolute;").
Every time after OnClick the element has to come to the front of other elements.
I mean:
element.parentNode.appendChild(element);
or
element.parent().append(element);
or
// E.g. with css as follows:
$('#ObjId').css('z-index', HighestIndx+1 );
I prefer the use of appendChild, due to the css style z-index won't be inserted into the element.
But I don't know whether the choice of appendChild vs z-index would be better.
My question: What is better to use z-index or append/appendChild ?
Thanks.

I would use z-index because I assume its faster and reliable in old browsers but anyway that's me.
Here is a useful article:
Why would appendChild disregard zIndex?
The article implies some points but isn't entirely focused to your question.

I don't think that appendChild() has anything to do with the z-index. It just add a new child to the calling parent to bottom as a last child. If you want to show your div in front of the other div then it is recommended that you should go with the z-index property.

Setting section width and height in Javascript

Why don't <section> elements accept width and height attributes just as <canvas> elements do?
(JSFiddle)

This is because section is a direct subelement of HTMLElement whereas Canvas is a HTMLCanvasElement which also extends HTMLElement but adds those 2 properties.
A section element is meant to be styled used CSS (similar to divs) whereas canvas is supposed to more of a HTML + Javascript interaction

I'd never recommend using javascript to style the look and feel of a HTML element, that's why CSS got invented for, right?
If you're really pushed for any reason to use it, then take a look at the js alternative below.
Try declaring the properties as you'd do with a normal HTML element (cross browser way to do it):
section.style.width = '250px';
section.style.height = '250px';
Have a look at this working fiddle.

(programmatic) Position of divs, what property should one use?

I would like to get/set the position of divs. I don't know what's the best technique one should use:
The CSS style?
var x = aDiv.style.left;
var y = aDiv.style.top;
or use the HTML div element's clientTop/clientLeft?
or... ?
Thanks for your time!
J.

clientTop and clientLeft are read-only, so you can't set the div position with them. There are multiple ways to do it with CSS, I suggest you study the basics of CSS positioning.

How can you measure the space that a text will take in Javascript?

In Javascript, I have a certain string, and I would like to somehow measure how much space (in pixels) it will take within a certain element.
Basically what I have is an element that will float above everything else (like a tooltip), and I need to set its width manually through Javascript, so it will adjust to the text inside.
I can't have it "auto-grow" naturally like an inline element would grow horizontally to contain its children.
In Windows there are APIs that do this. Is there a way to do the same thing in Javascript?
If there is no decent way, what approach do you believe is feasible?
(Like, trying out different widths and checking the height to make sure it didn't go over a certain threshold).
The less "pixel values" I can hardcode in my JS the better, obviously.

try this
http://blog.mastykarz.nl/measuring-the-length-of-a-string-in-pixels-using-javascript/

Given this HTML <span>text here</span> you have to read the offsetWidth attribute of the span, which is only assigned when the element itself is added to the DOM without a style that makes it invisible. Technically what this means is that the browser has to be able to visually load the element in the DOM to be able to construct and assign the offsetWidth attribute.
Something like this would work:
var span = document.createElement("span");
span.appendChild(document.createTextNode("text here"));
span.style = ""; // to make sure the elment doesn't have "display: none" or such
document.body.appendChild(span); // adding it to the DOM
var textWidth = span.offsetWidth;
// be sure to hide or remove the span if you don't need it anymore

This is easy using a JavaScript framework. I'm using Prototype in this example.
<span id='text' style='border:1px solid #000000;font-size:14px'>hello this is sample text</span>
<script type="text/javascript">
alert($('text').getWidth())
</script>