使用javascript获取影子根目录中的html元素

我有示例HTML代码：

<section class="search-module">
    #shadow-root (open)
        <div class="app">
            <div class="title">Product Title</div>
        </div>
</section>

但无法使用以下命令获取

影子根目录中的元素：

searchModule.getElementsByClassName("title") // undefined

可以使用QuerySelector获取ShadowRoot中的元素

var searchModule = document.getElementsByClassName("search-module").item(0);
searchModule.querySelector('.title')

您必须先导航到
影子根目录
，然后才能获得它：

const searchModule = document.querySelector('.search-module');
const searchModuleRoot = searchModule && searchModule.shadowRoot;

const title = searchModuleRoot.querySelector('.title');

行：
searchModule.getElementsByClassName（“title”）
工作正常。检查JSBin
const searchModule = document.querySelector('.search-module');
const searchModuleRoot = searchModule && searchModule.shadowRoot;

const title = searchModuleRoot.querySelector('.title');