What's the difference between the lang attribute and the <meta http-equiv="Content-Language" content="en-US"> tag?

The lang attribute (on the HTML element) specifies the language for the document (unless overridden with another lang attribute which can change the language for a section of the document).

The Content-Language HTTP header specifies the language of the intended audience. This is not the same as the language the document is actually written in. For example, part of a French language course could consist of a page written in French, but Content-Language would be en as it was intended for English speakers learning French.

From the spec:

The Content-Language entity-header field describes the natural language(s) of the intended audience for the enclosed entity. Note that this might not be equivalent to all the languages used within the entity-body.

Meta HTTP-equiv is the poor man's HTTP header. It has all the meaning of the real HTTP header, but less respect (and support).

As a rule of thumb, Content-Language is of more interest to search engines and the lang attribute is of more interest to screen readers.

HTML5 update: meta http-equiv="Content-Language" is obsolete, and the lang tag can be used on all elements.

They mean the same thing — setting the language of the content in question — however the lang attribute has a higher precedence. See 8.1.2 Inheritance of language codes. They handle different use cases — the lang attribute can be set <i lang=la>exempla gratis</i> on an individual element, while the Content-Language header can be configured globally by the server to apply to a whole set of documents.

Your examples show two equivalent ways to set the language of the html element, but since the lang attribute takes precedence, the value will be "en" and not "en-US".