当前位置: 首页 > 面试题库 >

JavaScript DOMParser访问innerHTML和其他属性

许子平
2023-03-14
问题内容

我正在使用以下代码将字符串解析为DOM:

var doc new DOMParser().parseFromString(string, 'text/xml');

哪里string是这样的<!DOCTYPE html><html><head></head><body>content</body></html>

typeof doc给我object。如果我做类似的事情,doc.querySelector('body')我会得到一个DOM对象。但是,如果像往常一样尝试访问任何属性,它将为我提供undefined

doc.querySelector('body').innerHTML; // undefined

其他属性也是如此,例如id。另一方面,属性检索很好doc.querySelector('body').getAttribute('id');

是否有魔术功能可以访问这些属性?


问题答案:

您的当前方法失败,因为未为给定XML文档定义HTML属性。如果提供text/htmlMIME类型,则该方法应该起作用。

var string = '<!DOCTYPE html><html><head></head><body>content</body></html>';
var doc = new DOMParser().parseFromString(string, 'text/html');
doc.body.innerHTML; // or doc.querySelector('body').innerHTML
// ^ Returns "content"

下面的代码text/html为尚不支持它的浏览器启用MIME类型。

/* 
 * DOMParser HTML extension 
 * 2012-02-02 
 * 
 * By Eli Grey, http://eligrey.com 
 * Public domain. 
 * NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK. 
 */

/*! @source https://gist.github.com/1129031 */  
/*global document, DOMParser*/

(function(DOMParser) {  
    "use strict";  
    var DOMParser_proto = DOMParser.prototype  
      , real_parseFromString = DOMParser_proto.parseFromString;

    // Firefox/Opera/IE throw errors on unsupported types  
    try {  
        // WebKit returns null on unsupported types  
        if ((new DOMParser).parseFromString("", "text/html")) {  
            // text/html parsing is natively supported  
            return;  
        }  
    } catch (ex) {}

    DOMParser_proto.parseFromString = function(markup, type) {  
        if (/^\s*text\/html\s*(?:;|$)/i.test(type)) {  
            var doc = document.implementation.createHTMLDocument("")
              , doc_elt = doc.documentElement
              , first_elt;

            doc_elt.innerHTML = markup;
            first_elt = doc_elt.firstElementChild;

            if (doc_elt.childElementCount === 1
                && first_elt.localName.toLowerCase() === "html") {  
                doc.replaceChild(first_elt, doc_elt);  
            }

            return doc;  
        } else {  
            return real_parseFromString.apply(this, arguments);  
        }  
    };  
}(DOMParser));


 类似资料:
  • 你可以在 属性检查器 里修改节点和组件,也能在脚本中动态修改。动态修改的好处是能够在一段时间内连续地修改属性、过渡属性,实现渐变效果。脚本还能够响应玩家输入,能够修改、创建和销毁节点或组件,实现各种各样的游戏逻辑。要实现这些效果,你需要先在脚本中获得你要修改的节点或组件。 在本篇教程,我们将介绍如何 获得组件所在的节点 获得其它组件 使用 属性检查器 设置节点和组件 查找子节点 全局节点查找 访问

  • 你可以在 属性检查器 里修改节点和组件,也能在脚本中动态修改。动态修改的好处是能够在一段时间内连续地修改属性、过渡属性,实现渐变效果。脚本还能够响应玩家输入,能够修改、创建和销毁节点或组件,实现各种各样的游戏逻辑。要实现这些效果,你需要先在脚本中获得你要修改的节点或组件。 在本篇教程,我们将介绍如何 获得组件所在的节点 获得其它组件 使用 属性检查器 设置节点和组件 查找子节点 全局节点查找 访问

  • 问题内容: 我的班级有一个名为DataStorage的哈希图: 如何在另一个类中访问此HashMap中的数据? 问题答案: 将HashMap创建为实例变量,并提供一种将其访问类API的方法:

  • 问题内容: 我最近拾起Java并遇到了问题。我有几个具有不同类的文件,但是我无法弄清楚如何访问文件中声明了其他类之外的其他类的对象。例如: 我不确定如何从其他文件和类本身有效访问其他类的这些对象?我知道我可以使对象静态化,然后通过它们所在的类将它们作为变量进行访问,但这似乎有点违反直觉?我来自面向对象较少的编程背景,因此我仍在尝试了解Java的编程风格。 问题答案: 您可能只想要这样的东西: 希望

  • 问题内容: 我想从另一个软件包访问主软件包,但这是不可能的,因为主文件不在目录中。我已经尝试将主文件放在目录中,但是当我尝试导入它时,出现此错误: 我想要这个的原因是因为我有一个tcp服务器和一个Web服务器一起工作。Web服务器可以通过主程序包获取tcp服务器,而tcp服务器可以通过主程序包获取web服务器。 我已经使它可以与Web服务器和tcpserver相互读取(中间没有主程序包),但是我想

  • 由于某种原因,我有一个LinkedList类无法访问我的学生类方法。我不明白为什么会发生这种情况,因为我的linkedlist类是Student类型。我一直收到一个错误:找不到symbol symbol:method getName()位置:Student类型的变量数据,其中Student是一个类型变量:Student extends对象在类节点中声明。下面的方法来自我的链表类 getGpa是我的