Доступ к узлу <span>в Javascript - PullRequest
Новая
       12

Доступ к узлу <span>в Javascript

1 голос
/ 04 августа 2010

Я пытаюсь написать скрипт greasemonkey, который отображает только фотографии с тегами бекон.

Сайт, на котором он работает, написан так: 

<div class="photos">
<ul>
...
<li>
<a href="photo1"> <img src="http://somesite.co/photo1.jpg" </a> <br /> <a href="tags_photo1"> <span class="tags">&nbsp;bacon, delicious&nbsp;</span> </a>
</li>
...
</ul>
</div>

Сначала я попытался использовать DOM, обработав div, а затем используя childNodes.Я мог получить доступ к узлам img и обоим href, но не к span.

Затем я попытался использовать это для получения тегов из span: 

tagNodes=document.getElementsByClassName('tags');

И он вернул коллекцию XPCNativeWrapper для всехчьи элементы были не определены.

Есть идеи, как получить метки? Я довольно новичок в javascript, поэтому извините, если мой вопрос глупый.

[Редактировать] 

var spans, tags;    
spans = document.getElementsByTagName('span');
for (var i = spans.length - 1; i >= 0; --i)
{
    tags = spans[i];
    alert(tags.wrappedJSObject.nodeValue);
}

Возвращается как ноль, даже с wrappedJSObject.Это потому, что Object.prototype не работает для XPCNativeWrapper?Или я что-то упустил?

1 Ответ

3 голосов
/ 04 августа 2010

Используя чистый Javascript (вместо использования библиотеки, такой как jQuery - которую я не думаю, что вы можете использовать в скрипте greasemonkey), это должно работать: 

var spans = document.getElementsByTagName("span");
for(var i = spans.length - 1; i >= 0; i--) {
    if(spans[i].className == "tags") {
        var span = spans[i];
        // do something to span
    }
}

Возможно, вы захотите использоватьjQuery, если вы можете, потому что код в jQuery будет: 

$("span.tags").each(function() {
    var span = this;
    // do something to span
});

[EDIT]

У вас могут быть проблемы, потому что ваш тег img незакрыто.

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

Этот код удалит весь элемент списка, если элемент тегов нене содержит "бекон": 

var spans = document.getElementsByTagName("span");
for(var i = spans.length - 1; i >= 0; i--) {
    if(spans[i].className == "tags") {
        var span = spans[i];
        if (!span.innerHTML.match(/bacon/i)) {
            var li = span.parentElement.parentElement;
            li.style.display = "none";
        }
    }
}
...