不写正则，如何提取html字符串中的信息？

如果有一段html文本，我们想提取里面的某个属性值，但又不想写正则表达式，怎么办呢？
如果是node，因为没有dom，我们可以选择用cheerio这个库来帮我们搞定；而前端的话，我们可以新创建一个dom节点，将html文本信息以innerHTML的方式写入进去，然后就可以利用querySelectorAll等方法提取相关信息了。

    let txt = `<div  class="html-box" draggable="false" style="background-color: rgba(0, 0, 0, 0.6); opacity: 1; background-repeat: no-repeat; width: 430px; height: 530px; position: absolute; cursor: default; z-index: 12; background-position: 50% 50%; background-size: contain; padding: 20px; display: inline; color: rgb(255, 255, 255); text-align: left; font-size: 32px; font-family: 微软雅黑; font-weight: 400; line-height: 1.5; overflow-wrap: anywhere; left: 60px; top: 165px; right: unset; bottom: unset; border-color: rgb(255, 255, 255); border-width: 0px; border-style: none; background-image: url(&quot;https://hellokitty.aliyuncs.com/pptService/663c7a8d9e24896fe9189e49897ee4dc733e57d07cb793e65599fc059ca073f6a45f8af721954045ff07dc5d24d1923023cef2c47662d6ff8b38e871deae5a2d/blur-1853262_1280.jpg&quot;);"><div class="scroll_box" style="height: 100%; overflow: hidden auto;"><p>富文本测试</p></div></div>`;

    console.log(replaceHtmlFile(txt));

    function replaceHtmlFile(html) {
    
    let div = document.createElement('div');//创建node节点
    div.innerHTML = html;//将html写入
    let bg = div.querySelectorAll('.html-box')[0];
    let bgImage = bg.style.backgroundImage;//提取信息
    let url = '';
    if (bgImage) {
        url = bgImage.replace(/^url\(\"(.*)\"\)$/, '$1');//将背景图url提取出来
    }

    return url;
}