Hướng dẫn react-native-html-parser - phản ứng gốc-html-trình phân tích cú pháp

Question

0.1.0 & nbsp; • & nbsp; public & nbsp; • & nbsp; đã xuất bản 3 năm trướcPublic • Published 3 years ago

Nội dung chính Show

react-native-html-parser
Giải pháp lỗi
Tham khảo API
Phương thức và thuộc tính DOM Cấp độ2:
Hỗ trợ cấp 3 của DOM:
DomiMplementation

Readme
Khám phá BetaBETA
0 phụ thuộc
4 người phụ thuộc
6 phiên bản

react-native-html-parser

Có thể sử dụng trình phân tích cú pháp HTML trong phản ứng, titan và bất cứ nơi nào.Điều này dựa trên XMLDOM.

Install:

NPM Cài đặt phản ứng-HTML-Parser phản ứng

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 = `

bbbb

Test

`

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))

}

hoặc

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

hoặc

import DOMParser from 'react-native-html-parser';
const html = `
Hello world world foo abc
`;    
const parser = new DOMParser.DOMParser();
const parsed = parser.parseFromString(html, 'text/html');
...

Giải pháp lỗi

[Lỗi xmldom] Không tìm thấy thực thể: ~~~~~~~

Kiểm tra vấn đề này

Tham khảo API

DOMParser:

parseFromString(xmlsource,mimeType)

Tùy chọn Tiện ích mở rộng bởi XMLDOM (không phải BOM Standard !!) by xmldom(not BOM standard!!)

new DOMParser(options)
new DOMParser({
    locator:{},
    errorHandler:{warning:function(w){console.warn(w)},error:callback,fatalError:callback}
})

XMLSerializer

Phương thức và thuộc tính DOM Cấp độ2:

Nút

 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)

Tài liệu: Nút

 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

Phần tử: Nút

 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: nút

 attribute:
 	value
 readonly attribute:
 	name|specified|ownerElement

Nodelist

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

0

Được đặt tênNodemap

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

1

Đặc điểm: Nút

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

2

Văn bản: ký tự

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

3

Cdatasection
Nhận xét: ký tự

Loại tài liệu

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

4

Ký hiệu: Nút

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

5

Thực thể: Nút

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+



    ''+
    ''
    ,'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')

6

EntityReference: Node

Xử lý Instruction: Node

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

7

Hỗ trợ cấp 3 của DOM:

Nút

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

8

DomiMplementation

Tài liệu: Nút

var DOMParser = require('react-native-html-parser').DOMParser;
var doc = new DOMParser().parseFromString(
    ''+
    ''+
        'abcd'+
    ''+
    ''+
        ''+
    ''+
    ''
    ,'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')

9

programming html React-native-render-html React-native-webview Fast html parser React-native-render-html example ReactHtmlParser Node-html parser

Hướng dẫn react-native-html-parser - phản ứng gốc-html-trình phân tích cú pháp

react-native-html-parser

Install:

Example:

Giải pháp lỗi

[Lỗi xmldom] Không tìm thấy thực thể: ~~~~~~~

Tham khảo API

Phương thức và thuộc tính DOM Cấp độ2:

Hỗ trợ cấp 3 của DOM:

DomiMplementation

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội