Объект не поддерживает это свойство или метод

Question

У меня возникла проблема, когда IE не работает со следующим кодом. Код в основном скрывает div, если элементы пусты, вы заметите, что он работает во всех, кроме IE.

//hide webapp item if empty
if ($("#features").html().trim()) {} else {
    $("#f-h").hide()
}
if ($("#application").html().trim()) {} else {
    $("#a-h").hide()
}
if ($("#tech-specs").html().trim()) {} else {
    $("#t-h").hide()
}
if ($("#downloads").html().trim()) {} else {
    $("#d-h").hide()
}
if ($("#custom-field").html().trim()) {} else {
    $("#c-f").hide()
}

Страницы, чтобы увидеть его в действии: webpage

Любые намеки на то, почему то есть не нравится, или лучше метод будет оценен.

Answer 1

Я предполагаю, что Internet Explorer по-разному анализирует строки, что приводит к ошибке. Решение этой проблемы состоит в том, чтобы всегда использовать точки с запятой , чтобы отметить концы ваших строк. Я также немного очистил код, заменив пустые блоки if / else на if-nots.

//hide webapp item if empty

if (!$("#features").html().trim()) {
  $("#f-h").hide();
}

if (!$("#application").html().trim()) {
  $("#a-h").hide();
}

if (!$("#tech-specs").html().trim()) {
  $("#t-h").hide();
}

if (!$("#downloads").html().trim()) {
  $("#d-h").hide();
}

if (!$("#custom-field").html().trim()) {
  $("#c-f").hide();
}

Answer 2

jQuery html() метод просто возвращает строку, содержащую HTML.

Строки JavaScript не имеют метода trim().

Если вы хотите ввести его в строку JavaScriptобъект.Вы можете сделать это с помощью:

String.prototype.trim = function () {
    return this.replace(/^\s*/, "").replace(/\s*$/, "");
}

^^^ это не проверялось, но я почти уверен, что это сработает.

Answer 3

Вы могли бы значительно упростить ваш JavaScript в зависимости от структуры вашего HTML.Если элементы, которые вы хотели скрыть, были последовательно расположены рядом / рядом друг с другом, вы можете назначить классы разделам («функции», «приложение», «технические спецификации» и т. Д.), Например, «раздел» иэлементы, которые вы хотите скрыть («fh», «ah», «th» и т. д.), например «hide-me», и использовать одну функцию для выполнения работы:

$('.section').each(function() {
    if ($(this).is(':empty')) {
        $(this).closest('.hide-me').hide();
    }
});

Я надеваюВам не обязательно понравится это решение, но вы также можете использовать карту разделов, которые вы хотите протестировать, и скрыть их, если они находятся в случайных местах в вашем HTML:

var items = [
    { key: '#features', value: '#f-h' },
    { key: '#application', value: '#a-h' },
    { key: '#tech-specs', value: '#t-h' },
    { key: '#downloads', value: '#d-h' },
    { key: '#custom-field', value: '#c-h' }
];

$.each(items, function(index, element) {
    if ($(element.key).is(':empty')) {
        $(element.value).hide();
    }
});

Вот рабочий пример приведенного выше кода.

Я знаю, что это не отвечает на ваш вопрос, но я просто хотел дать свои 0,02 доллара.