3

Появился вопрос, почему я не вижу span'ы в которые обернул текст? Если добавлять через append, к примеру, то все гут, а тут нет.

$("li").wrapInner("span");
$("span").on("click", function() {
  alert($(this).html());
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
</ul>

1 ответ 1

3

Вы немного неправильно используете метод wrapInner. В документации написано - Тип: htmlString or Selector or jQuery or Element. А вы отправляете строку 'span', которая является селектором, но элементов с таким селектором у вас нет.

htmlString

$("li").wrapInner("<span></span>");
$("span").on("click", function() {
  alert($(this).html());
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
</ul>

Element

$("li").wrapInner(document.createElement('span'));
$("span").on("click", function() {
  alert($(this).html());
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
</ul>

Selector

$("li").wrapInner('span');
$("span").on("click", function() {
  alert($(this).html());
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span></span>
<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
</ul>

jQuery то же самое, что Element, но обернутое в jQuery

3
  • Ну вот из документации и не могу понять в чем проблема, поэтому пришёл сюда.
    – wind
    16 мар 2018 в 11:13
  • @wind обновил ответ, стало понятнее?
    – Darth
    16 мар 2018 в 12:10
  • Действительно, упустил момент с тем что указывал селектор, пытался работать как с document.createElement, Спасибо за помощь!
    – wind
    16 мар 2018 в 12:39

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.