onMouseOver event

[optikalefx]

is there a way to be able to hover over html tags and it alert the tag?  The tricky part is that i cant modify the document, it has to be from an external js file...

 

hmm

[optikalefx]

ok i found this

 

javascript: document.body.contentEditable = 'true'; document.designMode = 'on'; void 0

 

i want to make something similar to that, where it knows what tag your on, and can move it or change the text of it.  Any ideas on where to start?  Or at least just be able to envoke that command from an external js file and then be able to save the changed HTML code?

[mainewoods]

an external js file can do things like:

var mylinks = document.getElementsByTagName('a'); //get all links in page and put in array
for (var onelink in mylinks) { // loop through all links
    // onelink contains a reference to the current link object
    onelink.onmouseover = functionname; //sets a fuction to be used when mousing over this link
    onelink.onmouseout = functionname2; // mouseout function
    onelink.style.color = 'red'; //changes all links to red
}
function functionname() { //mouse over function
    this.style = 'green';
}
function functionname2() { // mouseout function
    this.style = 'blue';
}

If you wanted to access an individual link, it would have to already have an id:

<a href="???" id="myid">link</a>

then you could get a reference to it like this:

var onelink = document.getElementById('myid');

and do things like the above with it.

if you want to get a reference to other types of items, just use the tag name in this statement:

var mydivs = document.getElementsByTagName('div'); //get all divs in page and put in array.

you could then do similiar things with that that I did with the links above

 

to get all the elements in the page, use the '*' selector:

var allelements = document.getElementsByTagName('*'); //get all elements in page and put in array.