JavaScriptのDOMParserにアクセスinnerHTMLプロパティおよびその他のプロパティ

私はDOMに文字列を解析するには、次のコードを使用しています：stringはちょうど<!DOCTYPE html><html><head></head><body>content</body></html>のようなものであるJavaScriptのDOMParserにアクセスinnerHTMLプロパティおよびその他のプロパティ

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

。

typeof docは私にobjectを与えます。私がdoc.querySelector('body')のようなことをすると、DOMオブジェクトが戻ってきます。私はあなたが正常にできるように、任意のプロパティにアクセスしようとした場合でも、それは私にundefinedを与える：

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

同じことが他の特性のために行く、例えばid。一方、属性の検索は、細かいdoc.querySelector('body').getAttribute('id');になります。

これらのプロパティにアクセスするための魔法の機能はありますか？

出典

2012-02-12 DADU

HTMLプロパティが指定されたXMLドキュメントに対して定義されていないため、現在のメソッドが失敗します。 text/html MIMEタイプを指定すると、このメソッドが機能するはずです。

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タイプを可能にします。 Mozilla Developer Networkから取得されます：

/* 
* 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));

出典

2012-02-12 17:50:28

PS用。説明のために、 'text/xml'を使用しているとき、' doc'は 'XMDocument'のインスタンスです。 'text/html'を使うと、' HTMLDocument'のインスタンスです。 –

Waaw、かなり役に立つ答え！私はそれを自分で見つけられませんでした。ちょうどmimeのタイプとそのMIMEタイプを有効にする:) – DADU

@RobW私はあなたが 'XMLDocument'を意味すると仮定します。 – devios1

使用element.getAttribute(attributeName) XML/HTML要素

出典

2017-03-05 17:44:54 swannty

JavaScriptのDOMParserにアクセスinnerHTMLプロパティおよびその他のプロパティ

答えて

関連する問題