Can a <button> in HTML do something without javascript?
Use an a
element, that's what they're for:
<a class="click-me" href="/path/to/whatever/page">Click me to navigate</a>
And then simply style it as a button
.
For example with the following CSS:
.clickMe {
-moz-appearance: button;
-ms-appearance: button;
-o-appearance: button;
-webkit-appearance: button;
appearance: button;
text-decoration: none;
color: #000;
padding: 0.2em 0.4em;
}
JS Fiddle demo.
(Obviously this assumes the use of a browser that supports the appearance
(or vendor-prefixed versions) CSS property.)
References:
appearance
(albeit it's the-moz-
prefixed MDN documentation).appearance
property, at the W3C.- Unfortunately-dropped CSS3 features (at the W3C).
To answer the question asked in the heading, yes, the button
element can “do things” without JavaScript. With type=submit
, it submits a form, as in the example at the end of the question. With type=reset
, it wipes out all user input from the form. It’s just type=button
(the default when the element is outside any form) that is JavaScript-dependent and does not do anything without scripting.
To answer the question you should have asked: Use links, Luke. You can style a link look pretty much like a button if you want (might make sense in an application-like context), even using just CSS 2.1 plus optional CSS3 enhancements like rounded corners.
You can simply add implementation of button click (if that references any webpage) by adding an <a>
tag before it. For example:
<a href="https://www.youtube.com/">
<button>Youtube</button>
</a>
This doesn't need any JavaScript as far as I know.