Bsrgvty

You cannot hide HTML and expect the browser to be able to interpret it. The browser needs full access to the HTML in order to display all parts of the site. As soon as the browser has access to it, the user can also gain access to it.

On a further note, JavaScript is also not able to "hide" the content of the site and still make it accessible to the browser, and thus the end user, for the exact same reason.

Well, IMHO the only reliable way to prevent the user to know the mail address it to have the mail sent server side instead of client side. Said differently the client only gives their own mail address and the text, it is uploaded to the server by the form, and the mail is sent by the server application which is the only part knowing the recipient address.

This is commonly used in help centers to prevent users to directly use their internal addresses.

You can't. And neither can Javascript.
You have three options, and they all depend on a backend language. You have two options, one right way and two lunatic ways if you have no server:

The right way: You do a form submit to a server, and the server handles this e-mail over SMTP.

The okay way: You submit to another domain or API that can handle it server-side.

The crazy way: You write a desktop application that is registered to your own custom URL protocol and the parameters include the form's body. Your consumer installs this desktop application, and it silently handles this e-mail over SMTP instead of opening their e-mail client. The destination mail can be hardcoded within that application and they can't get it unless they decompile or do a memory dump. Instead of "mailto:email.com" it becomes "custom-mail:" sans the mail.

This is what "mailto" is. It's a protocol that's registered with the OS. However, keep in mind that if you're relying on their client and "mailto", it doesn't matter what you do. They'll see it the second their client opens, so you didn't really solve anything here.

You can HTML-encode it, like this:

<form action="mailto:someone@example.com">

However, that only really obfuscates it. Anyone can decode this.

If you really want to hide it you need server side functionality (PHP), where the form is submitted to the server and the server emails it to you.

To accomplish what you're trying to do, get a gmail address or forwarding address that you use in your form, which serves your purpose of keeping your real email address secret.

TL;DR: No.

If I understand your problem correctly, you do not want to hide the e-mail address from the users, but from bots which parse the source code to collect e-mail addresses for spamming.

Sure, in JavaScript there are several easy ways reduce to this problem to practically zero, because it needs execution of the script which hardly any spammer does:

function getEMailAddr(user, domain) 
 return user + '@' + domain;

and then:

link = document.createElement('A');
link.href = 'mailto:' + getEMailAddr('example', 'something.com');

In plain HTML, there is no way to do this. However, there are some possibilities to make less attack surface for stupid parsers. The very catchy at-sign can be expressed as HTML entities &at; or @, so that parsers that only search for @ fail to find them. These HTML entities are also allowed in attribute values, such as href.

You can't hide HTML from the browser. HTML is a client-side markup language which means that it is loaded by the browser on the client-side, so the browser must be able to interpret it.

As someone alluded to, you won't be able to accomplish what you're trying to accomplish with the way that you are doing it. You might be able to accomplish something close by encoding/decoding elements as needed, however, security through obscurity is not a recommended strategy, and anyone can easily decode an encoded string.

Alternative answer.

Yes there is, try and view the source of https://samy.pl/ its almost impossible to find, you have to be pretty dedicated to find it yet the website works fine.

But more seriously the code is still visible, Its just out of reach of most users, even those who have some idea of where to look.

HTML/JS is all executed client side, so it's impossible not to give it to the client to process.

The part you specifically wish to hide actually triggers in the client browser, a mailto link is a link telling the computer to open a mail client and pre fill in the form. So even if you did do what Samy does, clicking the link will simply open in the mail client and show the end user the email address.

If you wish to keep it secret, email must be sent server side

As others have said, you can't hide HTML. However it sounds like you don't particularly want to hide HTML, you just want the recipient of the form to not be visible in your code which is simple enough depending on your framework.

For example, if you're using PHP, PHP Mailer is a pretty simple way to send an email, and since PHP is handled server side, when your form submits the user won't ever see your email address if you don't want them too.

If you're using ASP.NET or whatever else, simply typing the name of your environment and email into your favorite search engine will likely give you plenty of options on how to send an email and you can combine that with your form to do it server side.

TL;DR: No, you can't hide the HTML source code. You can only obfuscate the email address to defer spammers as long as you don't use server side code.

Besides using HTML entities (m) or Javascript, you can also use XSLT for obfuscation, if you use XHTML instead of HTML.

XSLT is a XML-based programming language supported by all major browsers that can transform any XML into another form (XML, HTML, Plaintext, etc.). One application would be to pass through most of the document except for action attributes that contain a magic part, e.g. +rot13.

One advantage is that this also works in browsers where Javascript is disabled. One caveat is that you need to write XHTML, so instead of the lenient HTML parser browsers use the strict XML parser, which causes error messages on every syntax error.

Please also keep in mind that every HTML obfuscation technique can only defer spammers. The browser needs the correct mailto link to do the right thing when submitting the form, so eventually the user will see the unobfuscated address.

index.xhtml

<?xml-stylesheet type="text/xsl" href="obfuscation.xsl" ?>
…
<form action="mailto+rot13:fbzrbar$rknzcyr.pbz">
 Email Adress:<br/>
 <input type="email" name="email_address" value="" maxlength="100" />
 <br/>
 <input type="submit" value="Submit" />
</form>

obfuscation.xsl

<xsl:stylesheet
 version="1.0"
 xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
 xmlns="http://www.w3.org/1999/xhtml"
 xmlns:html="http://www.w3.org/1999/xhtml">
<xsl:output method="xml" encoding="UTF-8"/>

<!-- Identity Transformation for HTML nodes -->
<xsl:template match="@*|html:*">
 <xsl:copy>
 <xsl:apply-templates select="@*|node()" />
 </xsl:copy>
</xsl:template>

<!-- decode form actions with a ROT-13 variant -->
<xsl:template match="@action[contains(substring(., 0, 16), '+rot13:')]">
 <xsl:attribute name="action"><xsl:value-of select="substring-before(., '+')"/>:<xsl:value-of select="translate(substring-after(., ':'),'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz@$6789012345', 'NOPQRSTUVWXYZABCDEFGHIJKLMnopqrstuvwxyzabcdefghijklm$@1234567890')" /></xsl:attribute>
</xsl:template>

</xsl:stylesheet>

This cannot be done for a mailto link, however there are services like MailThis, Formspree, that allows you to build a form that posts to their server, and they'll convert that to send an email. MailThis also allows you to create an alias name so that you don't expose your real email address on the HTML page itself.