querySelectorAll () не работает в Opera Mobile 11.5? - PullRequest
0 голосов
/ 13 марта 2012

Я пытаюсь удалить с веб-страниц элементы, которые не являются необходимыми, используя querySelectorAll, но, похоже, это не работает на Opera Mobile 11.5 . Я опробовал сценарии на своем компьютере, прежде чем положить их на свой телефон.

Документы Mozilla сбивают с толку, потому что есть две страницы об этой функции, и одна говорит, что она совместима , а другая говорит, что это не .

Есть ли решение, чтобы это исправить? Нужно ли будет добавлять другие библиотеки в эти скрипты, которые я создал?

Вот как бы я хотел это сделать:

function deleteByCSS(el) {
 elem = document.body.querySelectorAll(el);
 for (i=0; i<elem.length; i++){
  elem[i].parentNode.removeChild(elem[i]);
 }
}
deleteByCSS("here goes every CSS selector pointing to objects I want to remove");

Ответы [ 3 ]

1 голос
/ 13 марта 2012

Скорее всего, проблема заключается в том, что вы удаляете элементы из списка во время их итерации.Безопасной альтернативой является цикл в обратном направлении, поэтому удаление узлов не повлияет на остальную часть списка

function deleteByCSS(el) {
  var elem = document.body.querySelectorAll(el);
  for (var i=elem.length - 1; i>=0; i--){
    elem[i].parentNode.removeChild(elem[i]);
  }
}

Кстати, не забудьте добавить var перед локальными переменными

1 голос
/ 13 марта 2012

Несколько выпусков:

  1. Ответ Хуана Мендеса прав насчет порядка удаления. Если вы не удалите в обратном порядке, JS не только будет неэффективным, но и существует реальная вероятность сбоя скрипта из-за недопустимых значений массива. Если неэффективный способ работает один или два раза, это просто удача.

  2. Кроме того, необходимо учитывать вложенные узлы, обратите внимание на дополнительную проверку в приведенном ниже коде.

  3. Тот факт, что код работает для вас за пределами Opera, Пользовательский JavaScript , предполагает, что используемые вами узлы добавляются страницей javascript / AJAX. Компенсировать с помощью таймера или аналогичного метода.

  4. Если все еще возникают трудности, Ссылка на целевую страницу и публикует точные селекторы CSS, которые вы пытаетесь .

  5. Обратите внимание, что querySelectorAll() совместимо с Opera Mobile 11.5 , и обе эти страницы либо говорят об этом, либо показывают знак вопроса - что не означает, что оно несовместимо, просто Mozilla не проверяла это (другие имеют). Обратите внимание, что существует потенциально разница между document.querySelectorAll() и {element}.querySelectorAll(), следовательно, две страницы.

Сложив все вместе, код должен работать так:

function deleteByCSS (cssSelector, delayLoopMax, delayMilliSecs) {
    //-- Use defaults, if not specified.
    var delayLoopMax    = delayLoopMax   || 0;
    var delayMilliSecs  = delayMilliSecs || 300;
    //console.log ("Args: ", cssSelector, delayLoopMax, delayMilliSecs);

    var doomedElements  = document.body.querySelectorAll (cssSelector);
    if (doomedElements  &&  doomedElements.length) {
        //console.log ("Found!");
        //-- Found the node(s); delete it/them.
        for (var J = doomedElements.length - 1;  J >= 0;  --J) {
            var doomedNode  = doomedElements[J];
            if (doomedNode) {
                doomedNode.parentNode.removeChild (doomedNode);
            }
        }
    }
    else {
        //-- Nodes not found. Wait for JS to add them, if specified.
        if (delayLoopMax > 0) {
            delayLoopMax--;
            setTimeout (
                deleteByCSS,
                delayMilliSecs,
                cssSelector, delayLoopMax, delayMilliSecs
            );
        }
    }
}


В этом случае используйте его с начальным дополнительным параметром 20 ...

deleteByCSS ("*VALID* CSS selector", 20);
0 голосов
/ 13 марта 2012

Согласно caniuse (http://caniuse.com/#search=queryselector) он должен поддерживаться Opera Mini.

В любом случае, используйте Zepto или jQuery для выбора css dom, если вы хотите избежать подобных проблем или просто сгореть. querySelectorAll и querySelector, очевидно, поддерживаются не всеми браузерами, как настольными, так и мобильными. Ссылка Mozilla на DOM api не очень хороша или актуальна, на мой взгляд. Разработчики действительно нуждаются в действительно полной и глубокой документации DOM API.

...