Question

我在Chrome扩展程序中使用了可观察的突变并且运行良好：

var insertedNodes = [];
var observer = new MutationObserver(function (mutations) {
    mutations.forEach(function (mutation) {
        // loop through each chunk of html that changes on the page
        for (var i = 0; i < mutation.addedNodes.length; i++){
            newHTMLChunk = mutation.addedNodes[i];
            //console.log(newHTMLChunk);
        }
    })
});
observer.observe(document, {
    attributes: true,
    childList: true,
    characterData: true,
    subtree:true
});

在每次迭代中（在本例中为YouTube内），newHTMLChunk评估为一大块HTML，如下所示：

<li class="channels-content-item yt-shelf-grid-item">
   <div class="yt-lockup clearfix  yt-lockup-video yt-lockup-grid vve-check" data-context-item-id="Kky3wgURBJ0" data-visibility-tracking="QJ2JxKig-K2mKg==">
      <div class="yt-lockup-dismissable">
         <div class="yt-lockup-thumbnail">
            <span class=" spf-link  ux-thumb-wrap contains-addto">
               <a href="/watch?v=Kky3wgURBJ0" class="yt-uix-sessionlink" aria-hidden="true" data-sessionlink="ei=PkhhWMS-CoXMugKIxL_YDg&amp;feature=c4-videos-u">  <span class="video-thumb  yt-thumb yt-thumb-196">
               <span class="yt-thumb-default">
               <span class="yt-thumb-clip">
               <img alt="" src="https://i.ytimg.com/vi/Kky3wgURBJ0/hqdefault.jpg?custom=true&amp;w=336&amp;h=188&amp;stc=true&amp;jpg444=true&amp;jpgq=90&amp;sp=68&amp;sigh=PSGK-mxzthJQOk44ZEKdd1jCrkA" onload=";__ytRIL(this)" width="196" data-ytimg="1" aria-hidden="true">
               ...more here ...

现在我要做的是以下内容：

获取该<img>元素的句柄。（它将是HTML中唯一的图像元素。）
获取包含<div>属性的data-context-item-id元素的句柄。（在这种特殊情况下，值为Kky3wgURBJ0。）

如上所示，jQuery能否在任意一块html中找到元素？或者它只能在整个网页上运行？在此先感谢您的帮助。

Answer 1

jQuery能否在如上所示的任意html块中找到元素？

是的，它可以。这是一个例子。

// create a container for your html
var $div = $('<div>')

// inject html
$div.html(newHTMLChunk)

// traverse
$div.find('div[data-context-item-id="Kky3wgURBJ0"]')

编辑：这也可以在没有jQuery的情况下使用DocumentFragment

完成

请参阅Inserting arbitrary HTML into a DocumentFragment

如何使用jQuery在任意一块HTML中查找元素？

1 个答案: