Как работает jquery $ ('# some_id'). Текст ('some_text') работает?

Question

Я сейчас работаю с некоторыми javascript и пытаюсь установить текст в span, как это -

<span id='span_id'></span> 
..... 
.... 
<script type='text/javascript'> 
    $('#span_id').text('Hello World'); 
</script> 

До сих пор я знаю, чтобы изменить/установить некоторое значение/текст на HTML-странице без перезагрузки это мы имеем использовать ajax. Я задаюсь вопросом, как же это - $('#span_id').text('Hello World') здесь работает без перезагрузки страницы

Answer 1

Вот источник, из JQuery (в частности manipulation.js), где определена функция:

text: function(value) { 
    return access(this, function(value) { 
     return value === undefined ? 
      jQuery.text(this) : 
      this.empty().each(function() { 
       if (this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9) { 
        this.textContent = value; 
       } 
      }); 
    }, null, value, arguments.length); 

}

Это просто определение атрибута на выбранном узле textContent. Это инициирует событие reflow/repaint (поскольку новый текст займет новый объем пространства), но не полностью перезагружает страницу. Вы можете прочитать, что означает значения nodeType: https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType

Answer 2

Использование jQuery$('#span_id') является то, что идентифицирует элемент с идентификатором span_id. Оттуда метод text устанавливает текст в Hello World. Вам не нужно перезагружать javascript для изменения DOM. После начальной загрузки страницы выполняется сценарий и, таким образом, изменяет DOM. Вам не нужно перезагружать страницу.