Разница между SRC и HREF

ответ apnerve был правильным до выхода HTML 5, теперь это немного сложнее.

например,script элемент, согласно HTML 5 спецификация, имеет два глобальных атрибута, которые изменяют как src атрибут функции: async и defer. Они изменяют способ выполнения сценария (встроенный встроенный или импортированный из внешнего файла).

это означает, что есть три возможных режима, которые могут быть выбраны с помощью этих атрибуты:

1. когда async атрибут присутствует, то скрипт будет выполняться асинхронно, как только он будет доступен.
2. когда async атрибут отсутствует, но defer атрибут присутствует, то скрипт выполняется, когда страница закончила разбор.
3. если ни один из атрибутов не присутствует, то сценарий извлекается и выполняется немедленно, прежде чем агент пользователя продолжит разбор страница.

подробности HTML 5 рекомендация

Я просто хотел обновить с новым ответом для тех, кто иногда посещает эту тему. Некоторые ответы должны быть проверены и архивированы stackoverflow и каждым из нас.

Я думаю <src> добавляет некоторые ресурсы на страницу и <href> это просто для предоставления ссылки на ресурс (без добавления самого ресурса на страницу).

Простое Определение

SRC : (Source). To specify the origin of (a communication); document:     

HREF : (Hypertext Reference). A reference or link to another page, document...

вы должны помнить, когда использовать всех, и это все
элемент href используется со ссылками

<a href="#"></a>
<link rel="stylesheet" href="style.css" />

the src используется со скриптами и изображениями

<img src="the_image_link" />
<script type="text/javascript" src="" />

the url обычно используется в CSS, чтобы включить что-то, например, чтобы добавить фоновое изображение

selector { background-image: url('the_image_link'); } 

SRC(Source) -- я хочу загрузить этот ресурс для себя.

например:

Absolute URL with script element: <script src="http://googleapi.com/jquery/script.js"></script>   

Relative URL with img element : <img src="mypic.jpg">

HREF(H ypertext REFЯ хочу обратиться к этому ресурсу для кого-то другого.

например:

Absolute URL with anchor element: <a href="http://www.google.com/">Click here</a>

Relative URL with link element: <link href="mystylesheet.css" type="text/css">

вежливость

Если вы говорите HTML4, его список атрибутов может помочь вам с тонкостями. Они не взаимозаменяемы.

От W3:

когда атрибут href элемента a устанавливать элемент определяет источник якорь для ссылки, которая может быть активируется Пользователем для получения Веб-ресурсы. Якорь источника-это расположение экземпляра A и якорь назначения-это веб ресурс.

Источник:http://www.w3.org/TR/html401/struct/links.html

этот атрибут определяет местоположение изображения ресурс. Примеры широко признанные форматы изображений включите GIF, JPEG и PNG.

Источник:http://www.w3.org/TR/REC-html40/struct/objects.html

H REF: Это REFинформация для текущей страницыie css info Для стиля страницы или ссылки на другую страницу. разбор страниц не прекращается.

SRC: это reисточник для добавления / загрузки на страницу, как в изображениях или javascript. Разбор страниц может прекратиться в зависимости от закодированного атрибута. Вот почему лучше добавить скрипт непосредственно перед тегом конечного тела, чтобы рендеринг страницы не проводился вверх.

после прохождения HTML 5.1 ducumentation (1 November 2016):

---

часть 4 (элементы HTML)

Глава 2 (метаданные документа)

раздел 4 (элемент link) гласит, что:

назначение ссылки(ов) задается href атрибут, который должен присутствовать и должен содержать допустимый непустой URL, потенциально окруженный пространства. Если href атрибут отсутствует, то элемент не определяет связь.

не содержит ...

ведьма логична, потому что это ссылка .

---

Глава 12 (Скрипты)

раздел 1 (элемент script) гласит, что:

классические скрипты могут быть встроены или импортированы из внешнего файла с помощью src атрибут, который при указании дает URL внешнего ресурса скрипта для использования. Если , это должен быть допустимый непустой URL-адрес, потенциально окруженный пробелами. Содержимое встроенных элементов скрипта или внешнего ресурса скрипта должно соответствовать требованиям создания скриптов спецификации JavaScript для классических скриптов.

он даже не упоминает href атрибут...

это означает, что при использовании тегов скрипта всегда используйте src атрибут !!!

---

Глава 7 (встроенный контент)

раздел 5 (элемент img)

изображение дано src и srcset атрибуты, и любой предыдущий брат исходного элемента srcset атрибуты, если родитель является picture элемент, является встроенным содержимым.

также не упоминает ...

это означает, что при использовании img теги src атрибут должен использоваться также ...

---

ссылка на рекомендацию W3C

Они не заменимы - каждый определяется на разных элементах, как видно здесь.

Они действительно имеют сходные значения, так что это непоследовательность. Я бы предположил, что в основном из-за различных тегов, которые реализуются разными поставщиками, а затем включаются в спецификацию, чтобы избежать нарушения обратной совместимости.

Они не имеют схожие значения. 'src' указывает ресурс, который браузер должен получить как часть текущей страницы. Солар, указывающие ресурса, чтобы быть извлечена, если пользователь запрашивает его.

простое определение

• SRC: если ресурс может быть размещен внутри тега body (для изображения, скрипта, iframe, frame)
• HREF: если ресурс не может быть размещен внутри тега body и может быть связан только (для html, css)

Я согласен с тем, что apnerve говорит о различии. Но в случае CSS это выглядит странно. Поскольку css также загружается в клиент браузером. Это не похоже на якорный тег, который указывает на какой-либо конкретный ресурс. Поэтому использование href кажется мне странным. Даже если он не загружен со страницей, все равно без этой страницы не может выглядеть полным, и поэтому его не просто отношение, но как ресурс, который, в свою очередь, относится ко многим другим ресурсам, таким как изображения.

src используется для добавления этого ресурса на страницу, в то время как href используется для ссылки на определенный ресурс с этой страницы.

когда вы используете на своей веб-странице, браузер видит, что его таблица стилей и, следовательно, продолжает рендеринг страницы, поскольку таблица стилей загружается в parellel.

когда вы используете на своей веб-странице, он сообщает браузеру, чтобы вставить ресурс в местоположение. Итак, теперь браузер должен получить файл js, а затем загрузить его. Пока браузер завершает процесс загрузки, процесс рендеринга страницы останавливается. Именно по этой причине YUI рекомендует загружать файлы JS в самом низу вашей веб-страницы.