Hrefs vs JavaScript onclick (regarding unobtrusive JavaScript)

What is the best practice of using links / <a> tags with explicit hrefs to other pages on your site (i.e. href = "/ blah / blah / blah.html) against having hrefs / divs / etc. that don’t have explicit href, and their onclick set in the finished document handler with JavaScript in the main.js.

I'm not an expert when it comes to web development, but I like to learn jQuery and the like, and I approach the concept of unobtrusive JavaScript. Although both options above do not break the “do not have JavaScript in HTML” part of this mentality, I believe that I hung up on “Separation of structure and presentation from behavior”. Although, admittedly, it was more natural for me to put a <a> tag and explicitly set href, I believe that this is really a behavior and should therefore be set in JS.

Is it really far, or am I just not used to it? The other side of me sees the advantage of putting it in JS, b / c, now I have the ability to completely control the behavior of this link without changing anything in the HTML. You'll probably say that I'm on the notorious fence. Please help me. =)

(One note: the site makes heavy use of JavaScript, so the concept of providing JS functions is disabled, it is not really a concern, since most of the site will not work without it.)

+5
source share
5 answers

This is really too far for many reasons.

  • This is complex code that should be avoided.
  • This does not provide tangible benefits for your site.
  • It does not have an eloquent reserve for no-js.
  • This has a negative impact on SEO. In particular, bots will not run your script and therefore will not see links and, ultimately, will not index your site correctly.
  • , , UX JS (, JS).

, (, ), , , JavaScript , HTML.

+10

. , SEO href="" , , . , . , DOM.

, , href.

, javascript onclick jQuery .

+6

- . - , , , - , , , M4 . .

, . , , . "", .

+4

. , href - , . , , - - "" - JS .

, , 9 hrefs, href, , , .

+1

The jquery history plugin is pretty nice, it allows you to set href = '# / url' so that you can have real urls, real buttons back, but your hand tools just listen for events related to history.url.

http://tkyk.github.com/jquery-history-plugin/

Unused tags can probably also have some usability problems for visually impaired users using on-screen programs.

+1
source

All Articles