react-native-html-parser
can use html parser in react-native, titanium, and anywhere. This is based on xmldom.
Install:
npm install react-native-html-parser
Example:
import React, {
Component,
View,
Text,
StyleSheet,
TextInput,
WebView,
} from 'react-native'
var DomParser = require('react-native-html-parser').DOMParser
class TestReactNativeHtmlParser extends Component {
componentDidMount() {
let html = `<html>
<body>
<div id="b a">
<a href="example.org">
<div class="inA">
<br>bbbb</br>
</div>
</div>
<div class="bb a">
Test
</div>
</body>
</html>`
let doc = new DomParser().parseFromString(html,'text/html')
console.log(doc.querySelect('#b .inA'))
console.log(doc.getElementsByTagName('a'))
console.log(doc.querySelect('#b a[href="example.org"]'))
console.log(doc.getElementsByClassName('a', false))
}
}
or
var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
'<html><body>'+
'<div id="a" class="a">'+
'<a class="b">abcd</a>'+
'</div>'+
'<div class="b">'+
'<a href="aa" id="b">'+
'</div>'+
'</body></html>'
,'text/html');
console.log(doc.getElementsByAttribute('class', 'b'));
console.log(querySelecotr('.div.aa class#a a'))
console.log(getElementsBySelector('div.aa#in[ii="a"]'))
console.log(doc.querySelect('div.a a.b'))
console.log('end')
or
import DOMParser from 'react-native-html-parser';
const html = `<p>Hello world <b>world</b> <i>foo</i> abc</p>`;
const parser = new DOMParser.DOMParser();
const parsed = parser.parseFromString(html, 'text/html');
...
error solution
[xmldom error] entity not found: ~~~~~
Check this issue
API Reference
-
DOMParser:
parseFromString(xmlsource,mimeType)
- options extension by xmldom(not BOM standard!!)
new DOMParser(options)
new DOMParser({
locator:{},
errorHandler:{warning:function(w){console.warn(w)},error:callback,fatalError:callback}
})
-
XMLSerializer
serializeToString(node)
DOM level2 method and attribute:
-
Node
attribute:
nodeValue|prefix
readonly attribute:
nodeName|nodeType|parentNode|childNodes|firstChild|lastChild|previousSibling|nextSibling|attributes|ownerDocument|namespaceURI|localName
method:
insertBefore(newChild, refChild)
replaceChild(newChild, oldChild)
removeChild(oldChild)
appendChild(newChild)
hasChildNodes()
cloneNode(deep)
normalize()
isSupported(feature, version)
hasAttributes()
-
DOMImplementation
method:
hasFeature(feature, version)
createDocumentType(qualifiedName, publicId, systemId)
createDocument(namespaceURI, qualifiedName, doctype)
-
Document : Node
readonly attribute:
doctype|implementation|documentElement
method:
createElement(tagName)
createDocumentFragment()
createTextNode(data)
createComment(data)
createCDATASection(data)
createProcessingInstruction(target, data)
createAttribute(name)
createEntityReference(name)
getElementsByTagName(tagname)
importNode(importedNode, deep)
createElementNS(namespaceURI, qualifiedName)
createAttributeNS(namespaceURI, qualifiedName)
getElementsByTagNameNS(namespaceURI, localName)
getElementById(elementId)
getElementByClassName(classname)
querySelect(query) // querySelect only support tagName,className,Attribute,id, parent descendant
-
DocumentFragment : Node
-
Element : Node
readonly attribute:
tagName
method:
getAttribute(name)
setAttribute(name, value)
removeAttribute(name)
getAttributeNode(name)
setAttributeNode(newAttr)
removeAttributeNode(oldAttr)
getElementsByTagName(name)
getAttributeNS(namespaceURI, localName)
setAttributeNS(namespaceURI, qualifiedName, value)
removeAttributeNS(namespaceURI, localName)
getAttributeNodeNS(namespaceURI, localName)
setAttributeNodeNS(newAttr)
getElementsByTagNameNS(namespaceURI, localName)
hasAttribute(name)
hasAttributeNS(namespaceURI, localName)
getElementByClassName(classname)
querySelect(query) // querySelect only support tagName,className,Attribute,id, parent descendant
-
Attr : Node
attribute:
value
readonly attribute:
name|specified|ownerElement
-
NodeList
readonly attribute:
length
method:
item(index)
-
NamedNodeMap
readonly attribute:
length
method:
getNamedItem(name)
setNamedItem(arg)
removeNamedItem(name)
item(index)
getNamedItemNS(namespaceURI, localName)
setNamedItemNS(arg)
removeNamedItemNS(namespaceURI, localName)
-
CharacterData : Node
method:
substringData(offset, count)
appendData(arg)
insertData(offset, arg)
deleteData(offset, count)
replaceData(offset, count, arg)
-
Text : CharacterData
method:
splitText(offset)
-
CDATASection
-
Comment : CharacterData
-
DocumentType
readonly attribute:
name|entities|notations|publicId|systemId|internalSubset
-
Notation : Node
readonly attribute:
publicId|systemId
-
Entity : Node
readonly attribute:
publicId|systemId|notationName
-
EntityReference : Node
-
ProcessingInstruction : Node
attribute:
data
readonly attribute:
target
DOM level 3 support:
DOM extension by xmldom