Adding onclick for all elements in webpage

[kk11]

Hi all,
I've been trying to add onclick event to all elements in the webpage. But somehow it doesn't work. Any help would be greatly appreciated.

Here's my code:

function getIt()
{alert("Hello");}
 
var list = document.getElementsByTagName('*');
len = list.length;
 
for(i = 0;i < len;i++)
{
obj=list[i].tagName;
obj.onclick=getIt;
}

[acoder]

Hi, welcome to Bytes!

The problem with your code is that you're setting onclick to the tag name instead of the actual object. So set list[i] instead of list[i].tagName.

[kk11]

Thanks very much..got it fixed

I also had another question...if I've a lot of content inside a div..
like "When are you coming home?"

and I need to get only "When are you" when I move my mouse over the first part of the div and when I move it over to the next part of the div, I want to get the rest of the text, ie, "coming home?"

I get the whole stuff using innerHTML property but I don't know how to get only the part of text above which my mouse pointer is on.

[acoder]

Either split the div into two divs, or get the mouse position (see mouse position) and display the required text depending on which part of the div the mouse is.

[kk11]

I don't know how to do any of those

[acoder]

Which one would you like to do? The first one is easy, but manual and a fix. The second is more advanced, but you won't need to change it if the content changes.

[kk11]

I want to create a magnifyier that magnifies text in any webpage on mouse click, so I would prefer the 2nd one as it works with any content

[acoder]

How much would it need to magnify and how would you decide how much? The mouse position will tell you which part of the div the mouse is in, but not exactly what text is underneath it because that depends on how the browser renders the text at what height, width, spacing, etc.