|
Почему метод .html() не работает так как .innerHTML()?
Здравствуйте!
Есть такой скрипт:
var num = $('.p'),
btn = $('.btn');
btn.on({
'click': sum
});
function sum() {
for (var i = 0; i < num.length; i++) {
num[i].innerHTML = num[i].innerHTML + ' ' + (i + 1);
}
}
Он должен ставить в конце каждого параграфа его, соответствующий, номер. НО! Проковырялся с jQuery минут 20 в итоге его метод .html() так и не вывел нумерацию в браузере (хотя через console.log(num) нумерация присваивается). В отличии от его аналога в нативном js - .innerHTML() - этим всё выводится (console.log(num) выводит всё то же, что и с html). Буду очень благодарен если мне объяснит знающий человек в чём тут дело, так как во всех источниках указано, что эти методы являются аналогами друг друга. |
Цитата:
|
<div class="p">Первый</div>
<div class="p">Второй</div>
<div class="p">Третий</div>
<div class="p">Четвертый</div>
<button class="btn">Sum</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
var num = $('.p'),
btn = $('.btn');
btn.on({
'click': sum
});
function sum() {
for (var i = 0; i < num.length; i++) {
$(num[i]).html( $(num[i]).html() + ' ' + (i + 1));
}
}
</script>
|
Цитата:
|
<div class="p">Первый</div>
<div class="p">Второй</div>
<div class="p">Третий</div>
<div class="p">Четвертый</div>
<button class="btn">Sum</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
var $num = $('.p'),
btn = $('.btn');
btn.on({
'click': sum
});
function sum() {
$num.append(function(i){return ' ' + ++i});
}
</script>
|
Цитата:
У меня не работает... Цитата:
function sum() {
var arr = [];
for (var i = 0; i < num.length; i++) {
arr[i] = +num[i].innerHTML;
inp.val(arr.sort(srt));
}
}
Функция сортирует номера в параграфах и выводит в инпут, по возрастанию. Но когда ставлю вместо innerHTML html то выводит NaN. :cray: |
Цитата:
innerHTML - это свойство элемента DOM .html() - это метод объекта jQuery Смотрите внимательно пример в пост 3 |
Цитата:
num.each(function(n, e) {
e.innerHTML += ' ' + ++n
})
|
Цитата:
https://x-twig.ru/blog/239/ Цитата:
|
Цитата:
Вот полноценный скрипт:
var num = $('.p'),
btn = $('.btn'),
inp = $('input');
btn.on({
'click': sum
});
function sum() {
var arr = [];
for (var i = 0; i < num.length; i++) {
arr[i] = +num[i].innerHTML;
inp.val(arr.sort(srt));
}
}
function srt(a, b) {
if (a > b) {
return -1;
}
if (a < b) {
return -1;
}
if (a == b) {
return 0;
}
}
Всё работает, я же говорил. Просто думал писать всё на jQuery, но теперь выходит, что так нельзя и innerHTML не заменится тут... |
| Часовой пояс GMT +3, время: 05:47. |
|