document.createElement('div')和React.createElement('div')有什么区别?

时间:2019-11-22 12:13:34

标签: html reactjs dom

import groovy.json.*; def getDependencyResumeFromXML(pathReport){ def xml = bat(script:'type ' + pathReport, returnStdout:true); def x = new XmlParser().parseText(xml); def nDep = x.dependencies.dependency.size(); def dependencies = [:]; for(def i=0;i<nDep;i++){ dependencies[i] = [fileName: x.dependencies.dependency[i].fileName.text(),description:x.dependencies.dependency[i].description.text(),vulnerabilities:[:]]; def nVul = x.dependencies.dependency[i].vulnerabilities.vulnerability.size(); for(def j=0;j<nVul;j++){ dependencies[i].vulnerabilities[j] = [ name:x.dependencies.dependency[i].vulnerabilities.vulnerability[j].name.text(), cvssScore:x.dependencies.dependency[i].vulnerabilities.vulnerability[j].cvssScore.text(), severity:x.dependencies.dependency[i].vulnerabilities.vulnerability[j].severity.text(), cwe:x.dependencies.dependency[i].vulnerabilities.vulnerability[j].cwe.text(), description:x.dependencies.dependency[i].vulnerabilities.vulnerability[j].description.text(), ]; } } return dependencies; } pipeline{ ....... stages{ stage('OWASP dependencies testing'){ steps{ script{ bat 'mvn org.owasp:dependency-check-maven:check'; def pathReport = 'C:\\tmp\\workspace\\umbrella-pipeline-prueba\\target\\dependency-check\\dependency-check-report.xml'; def xml = bat(script:'type ' + pathReport, returnStdout:true); echo '------------------ 1'; echo xml; echo '------------------ 2'; echo '--------------------------------' def dependencias = getDependencyResumeFromXML(pathReport); echo '------------- 3'; echo dependencias; echo '------------- 4'; } } } } }

上面的str可以包含HTML的任何元素。因此,为了让他发短信,我在我的react应用程序中使用了以下str = "<p> this is paragraph </p>"

code

在这种情况下我需要使用ReactDOM吗?

赞:let descriptionDiv = document.createElement('div'); descriptionDiv.innerHTML = description; description = descriptionDiv.textContent || descriptionDiv.innerText;

但我不知道何时使用它?直接访问dom是否安全?

2 个答案:

答案 0 :(得分:0)

React.createElement

React.createElement(
    "button",
          {
            className: "panel-btn-open"
          },
    "Open"
),

document.createElement

 const buttonOpen = document.createElement('button');
 buttonOpen.classList.add('panel-btn-open');
 buttonOpen.textContent = 'Open';

答案 1 :(得分:0)

JSX元素将被转换为React.createElement()函数以创建React元素,这些元素将用于UI的对象表示 在html中,它只是为dom创建另一个节点。

如果您想在使用react时访问dom,可以使用ref

要访问DOM,请传递带有react元素的ref,然后再使用findDOMNode方法访问它

直接使用dom api是完全安全的,但这取决于您的要求...简单或您有一些复杂的任务,建议在react中使用ref

示例

import ReactDOM from 'react-dom';

...  

let reactElement = ReactDOM.findDOMNode(this.refs.refName)

...  

<Component ref='refName'/>