элемент возвращает NaN как ширину

#javascript #jquery #css

Вопрос:

Я пытаюсь изменить ширину элемента при изменении размера окна. Я пытаюсь получить ширину элемента, но он возвращается NaN . Это мой код для получения ширины и ее регистрации:

 var widthItemMedia = parseInt($(".my-class .list-block .item-media i").css('width'));
console.log("Previous: "   lastWindowWidth   " Current: "   windowWidth   " Width "   widthItemMedia);

1. NaN может быть результатом только тогда, когда результат не определен, логический или нулевой. Проверьте, действителен ли селектор

2. Не могли бы вы также поделиться своим css и html кодом? Всегда было бы неплохо создать здесь скрипку.

3. @K3v1n это неверно. Если значение ширины равно «auto», результат (от вызова parseInt() ) будет NaN .

4. console.log($(".my-class .list-block .item-media i").css('width')) возвращает что?

5. Как это вернет NAN?

Ответ №1:

Из документации jQuery:

Разница между .css(width) и .width() заключается в том, что последний возвращает значение пикселя без единицы измерения (например, 400), в то время как первый возвращает значение с неизмененными единицами измерения (например, 400 пикселей). Этот .width() метод рекомендуется, когда ширину элемента необходимо использовать в математических вычислениях.

Используйте .width() , когда вы хотите, чтобы число работало с:

 var widthItemMedia = $(".my-class .list-block .item-media i").width();

Вам не нужно parseInt() ни то, ни другое. parseInt() Функция допускает нечисловые данные в конце входной строки, поэтому «20 пикселей» подойдет. Однако что-то вроде «auto» не подходит. .width() Метод дает вам фактическую ширину макета. См. Также Методы .innerWidth() and .outerWidth() , которые иногда могут дать вам нужный ответ в зависимости от ситуации.

1. Консоль теперь возвращает это Previous: 678 Current: 1173 ElemWidth undefined

2. @ВасяПупкин в вопросе недостаточно кода, чтобы понять, в чем проблема; console.log() опубликованный вами текст вообще не включает «ElemWidth».