There is a link:

<a title="Заголовок" href="javascript:someFunc()">ссылка</a>

Accordingly, the function is called. Question: Is it possible in this function to obtain data about the object that called the function? In particular, get the title , or link text?

There will be many links, I would like to do without duplicating information from the link in the function parameters. Also, I know that you can assign id to links, pass it by parameter, and already use getElementById() in the function, but again, the end user is not too smart, I would like him to just create links, and then everything was done in the script.

    2 answers 2

    Method 1. Transfer this

     function foo(el){ console.log(el.title, el.innerHTML); } 
     <a title="Заголовок" href="javascript:" onclick="foo(this)">ссылка</a>

    Method 2. Handling events.

    In this case, you only need to clarify which objects need processing.

    For example, processing all tags a :

     document.addEventListener('click', function(e) { var el = e.target; if (el.tagName !== 'A') return; console.log(el.title, el.innerHTML); }); 
     <a title="Заголовок" href="javascript:">ссылка</a>

    Method 2+. Event handling

    If the template cannot be edited, you can also check the href attribute to operate with the necessary links.

     document.addEventListener('click', function(e) { var el = e.target; if (el.tagName !== 'A') return; if (el.href !== 'javascript:someFunc()') return; console.log(el.title, el.innerHTML); e.preventDefault(); // отменяем действие по href }); 
     <a title="Заголовок" href="javascript:someFunc()">ссылка</a>

    Method 3. document.activeElement

     function foo() { var el = document.activeElement; console.log(el.title, el.innerHTML); } 
     <a title="Заголовок" href="javascript:foo()">ссылка</a>

    • Passing this to this parameter is a discovery for me, really, one that could be guessed by myself. I don’t really want to use the listener, irrational, plus, again, it will be necessary to prescribe separate classes for links, the final admin of the site is not the most attentive and intelligent, as we remember. activeElement looks like the best solution so far, let's see how it will work in the final code. - Anar
    • Added a variation to the second method) - vp_arth
    • Implemented through activeElement. It works as it should, thanks) - Anar

    Not the best solution to put a function in the href tag

    That's better:

     <a href="#" onclick="MyFunction();">text</a>

    This is even better:

     <a href="#" onclick="MyFunction();return false;">text</a>

    Why is this better? because it tells the browser what's next, after executing the function, you don’t need to do anything.

    You can do so

     function someFunc(sender){ alert(sender.text) alert(sender.title); } 
     <a title="Заголовок" href="#" onclick="someFunc(this); return false;">ссылка</a>

    • what better? Why Not the best solution ? What is the fundamental difference with the way through href? - Grundy
    • It is better? Since when is inline insertion handlers better? - user207618
    • @Grundy, it seems to me that at least the function call in href looks weird. In addition, in this case, the sender will be the window object, not the <a> element. - koks_rs
    • It does not look strange, such an approach can be widely used. It was worth writing about the difference in the answer. - Grundy
    • The variant with href is good when you can add it to bookmarks) - vp_arth