2

Google Chrome プラグインの場合、特定の文字列を含む DOM 要素までスクロールしようとしています。ただし、セレクターをフィルタリングした後、DOM で少し迷ってしまいます。

$('*', 'body')
    .andSelf()
    .contents()
    .filter(function(){                     
        return this.nodeType === 3;
    })
    .filter(function(){
        // Only match when contains given string anywhere in the text       

        if(this.nodeValue.indexOf(givenString != -1){
            //idArr.push(this.offsetLeft);

            var ele = $(this);
                       $('html, body').animate({
                    scrollTop: ele.offset().top
                     }, 2000);                              
                return true;
            }

            return false;

    });

の上部オフセットを取得しようとするたびにele、代わりにドキュメントに関連するスクロールバーの上部オフセットを取得します。何か案は?$thisフィルター内での使用に関するスコープの問題である可能性があると思いましたが、フィルターthis内では現在の DOM 要素を参照する必要があります。

編集:

呼び出すことによって

var ele=$(this.parentNode);

テキストノードを含む要素を取得できました

4

2 に答える 2

2

これを試して:

var matches = $('body, body *').
        addBack().
        contents().
        filter(function(){                     
            return this.nodeType === 3;
        }).
        filter(function(){
        // Only match when contains given string anywhere in the text               
             if(this.nodeValue.indexOf(givenString) != -1)
               return true;
        }).first();

基本的には、あなたが持っていたのと同じフィルタリングです (欠けていた括弧を追加しただけです)。これにより、文字列に一致する最初の (存在する場合) textnode が得られます。しかし、DOM で textnodes の位置を直接取得することはできないため (この質問を参照してください)、単純なトリックを試して、それを span 要素内にラップし、オフセットを取得してページをスクロールすることをお勧めします。

if(matches.length > 0){
    var offset = $(matches).wrap('<span>').parent().offset().top;
    $('html, body').animate({scrollTop: offset}, 'slow');
}

フィドルの例はこちら

于 2013-07-02T05:46:58.137 に答える
0
el = $(":not(html, body, div, table, tbody, tr):contains('" + givenString + "')")

これにより、一致した要素が返されます。次に、要素までスクロールできます

于 2013-07-02T06:46:19.393 に答える