Javascript 用jQuery'解析HTML；s$.get（），则对象的后续操作不会执行任何操作

我目前正在使自己成为一个站点范围的页面生成器，利用JS/jQuery获取所选内容，解析所述内容，并最终初始化GJS。我的问题都源于解析并随后将相对URL转换为绝对URL

在我的页面上，以下是一次访问的结果：

• 提示我输入URL
• 从URL加载文档
• 剥离所有
  s，将它们添加到GJS init变量中（将脚本的

  src

  推送到init.canvas.scripts中），如果不存在

  src

  ，则将包含的代码添加到变量中，以便稍后注入
• 对
  /
  标记重复步骤3
• 将所有链接转换为绝对URL（使用的修改版本）
• 将被操纵的页面放入

• 使用定制的

  init

  变量初始化GJS

目前，我使用jQuery的

$.get（）

函数加载一个文档，然后使用回调数据（这是一个字符串）进行剥离等。但是，如果不解析这个字符串，jQuery就无法对它进行操作，因此我使用

parsePage（）

，理想情况下应该将这个字符串转换为jQuery对象。使用“parsed”变量，我应该能够

.find（'img'）

，不是吗？它没有给我任何东西

如果我做得不正确，如何正确解析页面？同样重要的是，如何将整个文档剥离到文档的

中

---

下面是我用来做这件事的所有JS：

var nosrc_scripts = "";
var nosrc_styles = "";

var init = {
    container: '#gjs',
    fromElement: true,
    width: 'auto',
    height: 'auto',
    storageManager: false,
    panels: {
        defaults: []
    },
    // load external css/scripts
    // found the reference here: https://github.com/artf/grapesjs/blob/master/src/canvas/config/config.js
    canvas: {
        styles: [],
        scripts: []
    },
};

$(document).ready(function() {
    var url = prompt("URL to load:");
    if (url != null) {
        // get page content in var
        $.get(url, function(page) {
            // fix relative images, scripts, stylesheets, etc.
            page.find('img[src^="./"]').attr('src', function(_,existing){
                return new URL(src, "https://example.com/").href;
            });

            // go through scripts, add tags into the config, and add <script>'s into a var to inject later
            getScripts(page);
            // go through stylesheets, add tags into the config, and add <style>'s into a var to inject later
            getStyles(page);

            // load page content into the div to load
            $('#gjs').append(stripToBody(page));

        });
        // finally, initialize grapesjs with our custom init var
        initializeGJS();
    }
});

function initializeGJS() {
    const editor = grapesjs.init(init);
    // create tags to inject
    var nosrc_scripts_tag = document.createElement('script');
    var nosrc_styles_tag = document.createElement('script');

    // set <script>/<style> tags to the variables to inject
    nosrc_scripts_tag.text = nosrc_scripts;
    nosrc_styles_tag.text = nosrc_styles;
    // inject them into the head of the HTML using grapesjs's method
    editor.Canvas.getDocument().head.appendChild(nosrc_scripts_tag);
    editor.Canvas.getDocument().head.appendChild(nosrc_styles_tag);
}

function getScripts() {
    ...
}

function getStyles() {
    ...
}

function parsePage(page) {
    // strip loaded page down to body HTML, with no <script> or <style> tags
    return $.parseHTML(page.substring(page.indexOf("<body"), page.indexOf("</body>")), false);
}

var nosrc_scripts=”“；
var nosrc_style=“”；
var init={
集装箱：“#gjs”，
fromElement:true，
宽度：“自动”，
高度：“自动”，
storageManager:false，
面板：{
默认值：[]
},
//加载外部css/脚本
//在此处找到参考：https://github.com/artf/grapesjs/blob/master/src/canvas/config/config.js
画布：{
样式：[]，
脚本：[]
},
};
$（文档）.ready（函数（）{
var url=prompt（“要加载的url:”）；
如果（url！=null）{
//获取var中的页面内容
$.get（url，函数（第页）{
//修复相关图像、脚本、样式表等。
page.find（'img[src^=“../”]）.attr（'src'，function（389;，现有）{
返回新的URL（src）https://example.com/”）.href；
});
//检查脚本，将标记添加到配置中，并将添加到变量中，以便稍后注入
获取脚本（第页）；
//浏览样式表，将标记添加到配置中，并将添加到变量中，以便稍后注入
获取样式（第页）；
//将页面内容加载到要加载的div中
$（'#gjs'）。追加（条带正文（第页））；
});
//最后，使用我们的定制init变量初始化grapesjs
initializeGJS（）；
}
});
函数initializeGJS（）{
const editor=grapesjs.init（init）；
//创建要注入的标记
var nosrc_scripts_tag=document.createElement（'script'）；
var nosrc_styles_tag=document.createElement（'script'）；
//为要注入的变量设置/标记
nosrc_scripts_tag.text=nosrc_scripts；
nosrc_styles_tag.text=nosrc_styles；
//使用grapesjs的方法将它们注入HTML的头部
editor.Canvas.getDocument（）.head.appendChild（nosrc_scripts_标记）；
editor.Canvas.getDocument（）.head.appendChild（nosrc_styles_标记）；
}
函数getScripts（）{
...
}
函数getStyles（）{
...
}
函数解析页（第页）{
//将加载的页面剥离到正文HTML，不带或标记
返回$.parseHTML（page.substring（page.indexOf）（“在
$中添加
var$page=$（”“）.html（page）；
。get
回调应该会给你一个jQuery对象。@user7290573谢谢！这很快解决了我的问题！添加
var$page=$（”“）.html（page）；
在
$中。get
回调应该会给您一个jQuery对象。@user7290573谢谢！这很快就解决了我的问题！