replaceElement?

[Matej]

Hi,

I have this greasemonkey function:

(function() {
var elementFound = Object();
var tempElem = Object();
var tempText = String("");
var contentString = String("");
var anchorTags = document.getElementsByTagName("a");
for (var i = 0; i < anchorTags.length ; i++)
{
elementFound = anchorTags;
contentString = elementFound.textContent.replace(/^\s*(.*)\s*$/,"$1");
//alert(contentString);
if (contentString == "<< Previous") {
elementFound.setAttribute("accesskey","P");
tempText = document.createTextNode("<< ");
elementFound.replaceChild(tempText,elementFound.firstChild);
tempElem = document.createElement("b");
tempText = document.createTextNode("P");
tempElem.appendChild(tempText);
elementFound.appendChild(tempElem);
tempText = document.createTextNode("revious");
elementFound.appendChild(tempText);
} else if (contentString == "Next >>") {
elementFound.setAttribute("accesskey","N");
tempElem = document.createElement("b");
tempText = document.createTextNode("N");
tempElem.appendChild(tempText);
elementFound.replaceChild(tempElem,elementFound.firstChild);
tempText = document.createTextNode("ext >>");
elementFound.appendChild(tempText);
} else if (contentString == "[Gallery Index]") {
elementFound.setAttribute("accesskey","I");
tempText = document.createTextNode("[Gallery ");
elementFound.replaceChild(tempText,elementFound.firstChild);
tempElem = document.createElement("b");
tempText = document.createTextNode("I");
tempElem.appendChild(tempText);
elementFound.appendChild(tempElem);
tempText = document.createTextNode("ndex]");
elementFound.appendChild(tempText);
};
}
})();

Now, this works, but it is ugly as hell. What I would like to do is to
use function fixElement, which would look something like this:

function fixElement(rootElement,beforeText,accKey,afterText) {
var tempElem = Object();
var tempText = String("");
rootElement.setAttribute("accesskey",accKey);
tempText = document.createTextNode(beforeText);
// I know, I should test on empty beforeText parameter, but
// for the sake of simplicity, let's keep it as it is.
rootElement.replaceChild(tempText,rootElement.firstChild);
tempElem = document.createElement("b");
tempText = document.createTextNode(accKey);
tempElem.appendChild(tempText);
rootElement.appendChild(tempElem);
tempText = document.createTextNode(afterText);
rootElement.appendChild(tempText);
return(rootElement);
}

Now, the problem is how to call this function. Can I do something like
this?

if (contentString == "<< Previous") {
tmpAnchorElement = fixElement(elementFound,"<< ","P","revious");
elementFound = tmpAnchorElement;
}

Somehow it seems not a good idea. However, I do not know how to get to
the parent element (so that I could use replaceChild). Any ideas?

Thanks,

Matej

 

[RobG]

Hi,

I have this greasemonkey function:

(function() {
var elementFound = Object();
var tempElem = Object();
var tempText = String("");
var contentString = String("");

There is not much point declaring variables and initialising them with
dummy content. They don't have a type, so just declare them or
initialise them with real data:

var elementFound;
var tempElem;
var tempText;
var contentString;


If you really insist on initialising them, then:

var elementFound = {};
var tempElem = {};
var tempText = '';
var contentString = '';

does the same job as the original with less typing (but it is still
futile other than from a 'self documenting code' perspective). No
biggie, just a matter of preference really.

var anchorTags = document.getElementsByTagName("a");

Here is a standard initialiser.

for (var i = 0; i < anchorTags.length ; i++)
{
elementFound = anchorTags;

See? elementFound was initialised as an Object object, but now it's an
Array object.


[...]

Now, this works, but it is ugly as hell. What I would like to do is to
use function fixElement, which would look something like this:

function fixElement(rootElement,beforeText,accKey,afterText) {
var tempElem = Object();
var tempText = String("");
rootElement.setAttribute("accesskey",accKey);
tempText = document.createTextNode(beforeText);
// I know, I should test on empty beforeText parameter, but
// for the sake of simplicity, let's keep it as it is.
rootElement.replaceChild(tempText,rootElement.firstChild);
tempElem = document.createElement("b");
tempText = document.createTextNode(accKey);
tempElem.appendChild(tempText);
rootElement.appendChild(tempElem);
tempText = document.createTextNode(afterText);
rootElement.appendChild(tempText);
return(rootElement);
}

Now, the problem is how to call this function. Can I do something like
this?

if (contentString == "<< Previous") {
tmpAnchorElement = fixElement(elementFound,"<< ","P","revious");
elementFound = tmpAnchorElement;
}

Somehow it seems not a good idea.

This seems like a reasonable place to use innerHTML. Guessing that your
HTML is something like:

<a ...><< Previous</a>


Why not just:

function fixElement(rootElement,beforeText,accKey,afterText)
{
rootElement.innerHTML = beforeText + '<b>' + accKey
+ '</b>' + afterText;
}

And you're done. It's only going to be run in Greasemonkey-compatible
browsers and isn't for the general web so go for it.

However, I do not know how to get to
the parent element (so that I could use replaceChild). Any ideas?

If nodeRef is a reference to a node, then nodeRef.parentNode is it's parent.

 

[ceplma]

for (var i = 0; i < anchorTags.length ; i++)
{
elementFound = anchorTags;

See? elementFound was initialised as an Object object, but now it's an
Array object.

Actually ... is this true? Isn't the element of Array of the type Object?

Matej

--
Matej Cepl, http://www.ceplovi.cz/matej/blog/
GPG Finger: 89EF 4BC6 288A BF43 1BAB 25C3 E09F EF25 D964 84AC

I am a Roman Catholic, so that I do not expect `history' to be
anything but a `long defeat' -- though it contains (and in
a legend may contain more clearly and movingly) some samples or
glimpses of final victory.
-- J.R.R. Tolkien

 

[RobG]

for (var i = 0; i < anchorTags.length ; i++)
{
elementFound = anchorTags;

See? elementFound was initialised as an Object object, but now it's an
Array object.

Actually ... is this true? Isn't the element of Array of the type Object?

Yes. Try:

var a = new Object();
var b = new Array();
alert(a.constructor + '\n' + b.constructor);


In JavaScript nearly everything is an object - the ECMAScript spec lists
a number native objects, including Object objects (section 15.2) and
Array objects (section 15.4). An array is a specific type of object
with a special 'length' property and a number of built-in methods (join,
split, concat, etc.).

I guess my point was that the variable itself is not considered to have
a type; trying to give it a type by assigning a dummy value (e.g. an
empty object) as the value does not do anything useful most of the time.

It is useful when initialising variables sometimes, e.g. if you want to
use the compound '+=' operator then:

var a = 0;
a += 7;

seems reasonable (ignoring the trivialness of the example).

 

[Matej]

If nodeRef is a reference to a node, then nodeRef.parentNode is it's parent.

Well, I know that, but nodeRef.parentNode.replaceChild(...) would not
necessarily replace nodeRef, because there may be other children of
parentNode, would it?

Matej

 

[Thomas 'PointedEars' Lahn]

Well, I know that, but nodeRef.parentNode.replaceChild(...) would not
necessarily replace nodeRef, because there may be other children of
parentNode, would it?

No, it would not. However,

nodeRef.parentNode.replaceChild(..., nodeRef);

always replaces the Node object referred to by `nodeRef' with the Node
object referred to by `...'.


PointedEars

 

[ceplma]

I guess my point was that the variable itself is not considered to have
a type; trying to give it a type by assigning a dummy value (e.g. an
empty object) as the value does not do anything useful most of the time.

It is useful when initialising variables sometimes, e.g. if you want to
use the compound '+=' operator then:

var a = 0;
a += 7;

seems reasonable (ignoring the trivialness of the example).

OK, that makes sense. Thanks!

Matej

 

[ceplma]

No, it would not. However,

nodeRef.parentNode.replaceChild(..., nodeRef);

always replaces the Node object referred to by `nodeRef' with the Node
object referred to by `...'.

Yeah, thanks! At least it shows clearly what newbie I am

Matej