Выберите элемент только своим именем, не используя document.getElementById ()? [Дубликат]

Я думаю, что это должно сделать трюк. Я просто добавил if(isset и добавил конкатенацию к переменным в теле, чтобы отделить PHP от HTML.

<?php
    $name = $_POST['name'];
    $email = $_POST['email'];
    $message = $_POST['message'];
    $from = 'From: yoursite.com'; 
    $to = 'contact@yoursite.com'; 
    $subject = 'Customer Inquiry';
    $body = "From:" .$name."\r\n E-Mail:" .$email."\r\n Message:\r\n" .$message;

if (isset($_POST['submit'])) 
{
    if (mail ($to, $subject, $body, $from)) 
    { 
        echo '<p>Your message has been sent!</p>';
    } 
    else 
    { 
        echo '<p>Something went wrong, go back and try again!</p>'; 
    }
}

?>
307
задан Peter Mortensen 5 March 2016 в 11:59
поделиться

4 ответа

Что должно произойти, так это то, что «именованные элементы» добавляются как кажущиеся свойства объекта document. Это действительно плохая идея, так как позволяет именам элементов сталкиваться с реальными свойствами document.

IE затруднил ситуацию, добавив именованные элементы в качестве свойств объекта window. Это вдвойне плохо, потому что теперь вам нужно избегать именования ваших элементов после того, как захочет использовать какой-либо из объектов document или window, которые вы (или любой другой библиотечный код в своем проекте) захотите использовать.

Это также означает, что эти элементы видны как глобальные переменные. К счастью, в этом случае любые реальные глобальные объявления var или function в вашем коду затушевывают их, поэтому вам не нужно так беспокоиться об именах здесь, но если вы попытаетесь выполнить присвоение глобальной переменной с конфликтом имя и вы забудете объявить его var, вы получите сообщение об ошибке в IE, поскольку оно пытается присвоить значение самому элементу.

Обычно считается, что неправильная практика пропускает var, так как а также полагаться на названные элементы, которые видны на window или в виде глобальных. Придерживайтесь document.getElementById, который более широко поддерживается и менее неоднозначен. Вы можете написать тривиальную функцию обертки с более коротким именем, если вам не нравится ввод текста. В любом случае, нет смысла использовать кеш-поиск с id-элементом, поскольку браузеры обычно оптимизируют вызов getElementById, чтобы использовать быстрый поиск; все, что вы получаете, это проблемы, когда элементы меняются id или добавляются / удаляются из документа.

Opera скопировала IE, затем присоединился WebKit, и теперь обе ранее нестандартная практика размещения именованных элементов в document, и ранее применявшаяся только для IE практика помещать их в window, является стандартизированной HTML5, подход которой заключается в том, чтобы документировать и стандартизировать каждую ужасную практику, причиненную на нас авторами браузеров, делая их частью сети навсегда. Таким образом, Firefox 4 также будет поддерживать это.

Что такое «названные элементы»? Все, что имеет id, и все, что используется name для целей идентификации, то есть формы, изображения, привязки и несколько других, но не другие несвязанные экземпляры атрибута name, например, имена в полях ввода формы, имена параметров в <param> или тип метаданных в <meta>. «Идентификация» name s - это те, которые следует избегать в пользу id.

348
ответ дан T.J. Crowder 21 August 2018 в 05:58
поделиться
  • 1
    Это ясный ответ, спасибо. Не было моей идеи опустить document.getElementById (ну, по сути, я использую xpath, где это возможно, для поиска свойств элементов / элементов в настоящее время). Я наткнулся на эту (плохую) практику для названных предметов и был любопытен, откуда она взялась. Вы ответили, что достаточно много; теперь мы знаем, почему его также можно найти в Chrome (webkit). – KooiInc 8 August 2010 в 14:17
  • 2
    Следует исключить одно исключение из «использования name», с <input>, где атрибут name играет решающую роль в формировании ключа пар ключ-значение для представлений форм. – Yahel 17 August 2011 в 14:33
  • 3
    FYI Firefox делает это только в режиме quirks. – Crescent Fresh 17 August 2011 в 15:04
  • 4
    @yahelc: это именно то, что я делаю. «Не другие виды использования name, такие как имена управления в полях ввода формы ...» – bobince 17 August 2011 в 15:53
  • 5
    ЗАЧЕМ!? Есть ли что-то, что мы можем сделать, чтобы остановить это безумие? Мои функции были переопределены ссылками на элементы, и мне потребовалось час для отладки. :( – Stephen Bugs Kamenar 8 May 2014 в 16:26

Как упоминалось в более раннем ответе, это поведение известно как с именем access по объекту window . Значение атрибута name для некоторых элементов и значение атрибута id для всех элементов становятся доступными как свойства глобального объекта window. Они известны как именованные элементы. Поскольку window является глобальным объектом в браузере, каждый именованный элемент будет доступен как глобальная переменная.

Это было первоначально добавлено Internet Explorer и в конечном итоге было реализовано всеми другими браузерами просто для совместимости с сайтами которые зависят от этого поведения. Интересно, что Gecko (движок рендеринга Firefox) решил реализовать это только в режиме quirks , тогда как другие механизмы рендеринга оставили его в стандартном режиме.

Однако, с Firefox 14, Firefox теперь поддерживает именованный доступ к объекту window в стандартном режиме. Почему они изменили это? Оказывается, все еще есть много сайтов, которые полагаются на эту функциональность в стандартном режиме. Microsoft даже выпустила маркетинговую демонстрацию , которая предотвратила демонстрацию работы в Firefox.

Недавно Webkit рассмотрел противоположное , отменив именованный доступ на window объект только для режима quirks. Они решили против этого по тем же соображениям, что и Гекко.

Итак ... сумасшедший, поскольку кажется, что это поведение теперь технически безопасно использовать в последней версии всех основных браузеров в стандартном режиме. Но хотя названный доступ может показаться несколько удобным, его не следует использовать.

Почему? В этой статье можно суммировать рассуждения о том, почему глобальные переменные являются плохими . Проще говоря, наличие множества дополнительных глобальных переменных приводит к большему количеству ошибок. Допустим, вы случайно набрали имя var и случайно набрали id узла DOM, SURPRISE!

Кроме того, несмотря на стандартизацию, все еще существует довольно много несоответствий в реализациях браузера именованный доступ.

  • IE неправильно делает значение атрибута name доступным для элементов формы (ввод, выбор и т. д.).
  • Gecko и Webkit неправильно НЕ делают <a>, доступных через их атрибут name.
  • Gecko неправильно обрабатывает несколько именованных элементов с тем же именем (он возвращает ссылку на один узел вместо массива ссылок).

И я уверен, что есть больше, если вы попробуете использовать именованный доступ в случаях с краем.

Как упоминалось в других ответах, используйте document.getElementById, чтобы получить ссылку на узел DOM своим id. Если вам нужно получить ссылку на узел по его атрибуту name, используйте document.querySelectorAll.

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

Если вам интересно, я более подробно расскажу об этом в своем блоге - http://tjvantoll.com/2012/07/19/dom-element-references-as-global-variables/ .

39
ответ дан Daniel Trebbien 21 August 2018 в 05:58
поделиться
  • 1
    Просто примечание к очевидному предостережению к предположению, что «его не следует использовать». То есть, «он не должен использоваться, если вы не являетесь ковбоем кода». Кодекс ковбои просто идут на это. – Jeremy Foster 13 September 2014 в 01:19
  • 2
    @jeremyfoster, если "ковбой кода" означает кто-то, кто использует и распространяет плохие разработчики-недружественные реализации, я категорически не согласен. – Patrick Roberts 28 June 2015 в 05:30
  • 3
    Один признак хорошего ковбоя - это то, что многие не согласны. Но теперь я как философский ковбой или что-то в этом роде. – Jeremy Foster 28 June 2015 в 15:49
  • 4
    При доступе к DOM больше людей должны использовать document.querySelectorAll и document.querySelector. +1 за хорошее предложение об использовании этого. Доступ к элементам по селектору определенно является более эффективным процессом. – Travis J 29 October 2015 в 00:14
  • 5
    – Danny '365CSI' Engelman 29 August 2018 в 11:51

В этих случаях вы должны придерживаться getElementById(), например:

document.getElementById('example').innerHTML

IE любит смешивать элементы с атрибутами name и ID в глобальное пространство имен, поэтому лучше всего указать, что вы пытаетесь получить.

17
ответ дан Nick Craver 21 August 2018 в 05:58
поделиться

Да, они делают.

Протестировано в Chrome 55, Firefox 50, IE 11, IE Edge 14 и Safari 10 со следующим примером:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
  <div id="im_not_particularly_happy_with_that">
    Hello World!
  </div>
  <script>
    im_not_particularly_happy_with_that.innerText = 'Hello Internet!';
  </script>
  <!-- Looking at you W3 HTML5 spec group ಠ_ಠ -->
</body>
</html>

http://jsbin.com/mahobinopa/edit?html,output

3
ответ дан qff 21 August 2018 в 05:58
поделиться
Другие вопросы по тегам:

Похожие вопросы: