Re: Creating a new element and inserting before an existing causes line breaks

On Mar 24, 12:59 pm, Jeremy L <[email protected]> wrote:
> Hi there...
>
> I use evaluate() to parse through all <a> objects on a page, with the
> goal to insert an icon before the link.
> I then iterate through all the elements, and get each element using
> snapshotItem(elemnum)
>
> I then do the following:
>
> var cisco_newcode = document.createElement("span"); // Make new code
> snippit
> cisco_element.parentNode.insertBefore(cisco_newcode,
> cisco_element); // Switch them
> var cisco_icon = document.createElement("div");
> newstyle="padding-top: 0px; padding-bottom: 13px; padding-left: 8px;
> padding-right: 7px; background: url('available.gif') center no-
> repeat";
> cisco_icon.setAttribute("style",newstyle);
> var cisco_href = document.createElement("a");
> cisco_href.setAttribute("href", "#");
> cisco_href.addEventListener("click", MoreInfoOnLink, true);
> cisco_href.appendChild(cisco_icon);
> cisco_newcode.appendChild(cisco_href);
>
> This inserts the div element with the image, but breaks the line
> before and after my element - which is not the desired effect
> What am I doing wrong here? It seems that just doing the insertBefore
> breaks the line
>
> J

I am actually doing similar thing (see the post above) but I opt to do
it using absolute positioned (position relative to BODY) anonymous
DIV. For the thing you are doing, you can try following construct:

<a href="go" style="position: relative;">this is a span action<span
style="position: absolute; width: 5px; height: 5px; border: thin solid
black;top:0px; left: 0px"><img src="test.gif" border="0"></span></a>

I tried to generalize it to all tags but encounter problems, which was
why I went to anonymous DIV route. However, it created another problem
for me. Let me know if you happen to know a way to track element's
position. Thanks.

Feng