Can Inline JavaScript Scripts Use a `src` Attribute?

Can JavaScript Inline Scripts Have a Source Attribute?

The question arises regarding the validity of having an inline JavaScript script with a source attribute, such as:

<code class="html">&lt;script type='text/javascript' src='/path/to/script.js'&gt;
    alert('Do some stuff here, using resources defined in script.js.');
&lt;/script&gt;</code>

Unlike common JavaScript usage where scripts are included through a source attribute and executed separately, this example attempts to combine both approaches.

Official Behavior

The official behavior, as defined by the HTML 4.01 Specification, dictates that an inline script cannot have a source attribute. The specification states:

"If the src attribute is not set, user agents must interpret the contents of the element as the script. If the src has a URI value, user agents must ignore the element's contents and retrieve the script via the URI."

This means that the inline script's contents will be ignored if a source attribute is present.

Browser Behavior

In practice, major browsers interpret this specification as follows:

• Chrome, Firefox, Edge: The inline script's contents are ignored, and only the script defined in the source file is executed.
• Safari: Both the inline script and the source file are executed.

Best Practice

To avoid potential browser inconsistencies, it is recommended to use either an inline script or a separate script file, but not both simultaneously. This approach ensures consistent and predictable behavior across all browsers.

The above is the detailed content of Can Inline JavaScript Scripts Use a `src` Attribute?. For more information, please follow other related articles on the PHP Chinese website!