Develop Reference

How to properly assign style.backgroundClip = "text"?

I am having trouble with one line of code. I have been searching the web for hours now and had to resort to stack overflow. When I run this code, it does nothing. Here is the code:
e.style.backgroundClip = "text";
When I researched this, I found that the "text" is not officially existing, however if I use this in the css with background-clip it works. If you have any idea why this is not working, please help. I am using a device running iOS 8 if that helps.
I AM USING A PROGRAM CALLED "EXPRESSO HTML"

Setting text as the value for background-clip property is not a recognised value in the specification:
https://developer.mozilla.org/en-US/docs/Web/CSS/background-clip#Values
You could force the element to take the inline styling like so:
el.setAttribute("style", "-webkit-background-clip:text");
Notice it also takes the -webkit- vendor prefix. I think only Chrome supports it, I may be wrong.
Fiddle: http://jsfiddle.net/crwk2mac/
Since this variation of background-clip is not well supported, it would not be advisable to use it without decent and well tested fallbacks. This would be best done in CSS and could give you a real headache trying to implement entirely in javascript.

selector 'nth-last-child(n)' not working in chrome

alert($('#Content_tab form .form-group:nth-last-child(2)').html());
this and more selection on nth-last-child(n) not working in chrome !!
How ever they are working fine in all other browsers, like in IE8, Mozilla.
Please review my Site and source code
you can find the code near line no. 502

Use this
$('#Content_tab form .form-group').eq(-2).html()
As a javascript developer, I don't like that selector at all. It is agains my rules to use that kind of selector. It will be very non performant. You can give some class to that element while building your markup or this is even better.
$("#Content_tab").find(".form-group").eq(-2).html()

AppendChild issue with Internet Explorer Javascript

The following piece of code, works correctly in Firefox and Chrome, but it gives me a headache in IE.
var anotherDiv= document.getElementById("anotherDiv");
var destination = document.getElementById("mySourceDiv");
destination.appendChild(anotherDiv);
I'm trying to get a Div element and place it inside another div.
I get an error message (in the debug console in IE) similar to "interface not supported", and points me to the appendChild line.
What I've seen is that the type of the destination variable is an object rather then a DOM element.
What can I do to append the anotherDiv to mySourceDiv?
I'm trying this in IE 8.

You probably will need something like an importNode, there are various cross browser solutions around. The issue is that each node has a corresponding document object on it, in IE and so called security doesn't play nice moving things from one document to another.
So, essentially it's doing a deep clone, but the difference between using cloneNode is that cloneNode also sets the document which you don't want.
This might get you going in the right direction:
IE support for DOM importNode

I'd recommend using a library designed to sort through the browser incompatibilities for you. I've personally found jQuery to be quite good. jQuery has an append function.

Mozilla Firefox margin spaces

When I try to use a statement like document.write() with object tag parameters in Javascript part of a webpage, Mozilla Firefox seems to put extra marginal spaces on the edges of the page while other browsers behave normally. What is the reason of this difference? How can I get rid of these marginal spaces?
Note: (I'm trying to load an applet in a web application.)

I think the real answer here is "don't use document.write" :-) See this related SO post for why:
Why is document.write considered a "bad practice"?
So what should you do if not document.write? Well, ideally JQuery (it's all but a requirement for writing JS nowadays IMHO). With jQUery your problem is as simple as:
$(document.body).append(
"<object><embed type = 'application/x-java-applet;version=1.5' \ CODE = ...");
If you don't want to use jQuery (not-so-subliminal message: use jQuery!) you can also use either innerHTML (as Kiva suggested), or document.createElement + document.body.appendChild to add the element to the page.
I suspect if you use any of these techniques, instead of document.write, you'll see similar behavior to just having the element there in the HTML in the first place.

What is your code ?
Maybe Firefox add a default margin for applet application, try to look at this with firebug.

Maybe the problem in the CSS. May be about to fix this situation:
html, body{margin: 0; padding: 0;}

Is nodeIndex a valid DOM element property in IE?

I came across some javascript at work today that used jQuery to fetch two elements. It then used elem.nodeIndex to determine the position in the elements parent for each element. Nothing is setting this property anywhere and I do now see a reference to it in the msdn, mdc, or anywhere else.
I stepped through this javascript in FireFox with FireBug and tested the code in chrome and opera. I am sure nothing was trying to set this property. However, I can't find any information on this nodeIndex property anywhere.
Does nodeIndex exist as a DOM property in IE, or did I miss something while debugging my code?
UPDATE: I asked the same question on the jQuery list and they confirmed the property is for internal use only.:

It looks like it's jQuery that's adding nodeIndex to nodes in some cases.

Well, the easy answer is: If it isn't documentated anywhere like MDC, MSDN or W3, then it isn't a 'real' DOM property.
The idea of using nodeIndex, is also wrong, why would you want to do that?