如何獲取innerHTML中的原始html字符串？

問題：當我嘗試使用關於jsx代碼的highlight.js時，消失了html標記。如何獲取innerHTML中的原始html字符串？

原始出處：

<pre> 
    <code class="javascript"> 
    const { Link } = ReactRouter; 

    App.QnAChild = React.createClass({ 
     mixins: [Mixins.Accounts, Mixins.Utils], 

     render() { 
     let name = ""; 

     if (this.props.user && this.props.user.name) { 
      name = this.props.user.name; 
     }  

     return (
      <tr> 
      <td> 
       {this.props.index + 1} 
      </td> 
      <td> 
       <Link to={`/qna/${ this.props._id }`} 
        className="title-link"> {this.props.title} 
       </Link> 
      </td> 
      <td> 
       <Link to=""> 
       {name} 
       </Link> 
      </td> 
      <td> 
       {this.momentKoreanDate(this.props.createdAt, 5)} 
      </td> 
      </tr> 
     ) 
     } 
    });   
    </code> 
</pre>

渲染之後來源：

const { Link } = ReactRouter; 
App.QnAChild = React.createClass({ 
    mixins: [Mixins.Accounts, Mixins.Utils], 
    render() { 
     let name = ""; 
     if (this.props.user && this.props.user.name) { 
      name = this.props.user.name; 
     } 
     return (
      {this.props.index + 1} 
      {this.props.title} 
      {name} 
      {this.momentKoreanDate(this.props.createdAt, 5)} 
     ) 
    } 
});

$（ '預編碼'）[0] .innerHTML：

"const { Link } = ReactRouter; App.QnAChild = React.createClass({ mixins: [Mixins.Accounts, Mixins.Utils], render() { let name = ""; if (this.props.user &amp;&amp; this.props.user.name) { name = this.props.user.name; } return ({this.props.index + 1} <link to="{`/qna/${" this.props._id="" }`}="" classname="title-link"> {this.props.title} <link to=""> {name} {this.momentKoreanDate(this.props.createdAt, 5)}) } }); "

爲什麼消失html標記innerHTML的？如何獲取innerHTML中的原始html字符串？

我希望能源渲染後：

const { Link } = ReactRouter; 

App.QnAChild = React.createClass({ 
    mixins: [Mixins.Accounts, Mixins.Utils], 

     render() { 
      let name = ""; 

      if (this.props.user && this.props.user.name) { 
       name = this.props.user.name; 
      }  

      return (
      <tr> 
       <td> 
        {this.props.index + 1} 
       </td> 
       <td> 
        <Link to={`/qna/${ this.props._id }`} 
          className="title-link"> {this.props.title} 
        </Link> 
       </td> 
       <td> 
        <Link to=""> 
        {name} 
        </Link> 
       </td> 
       <td> 
        {this.momentKoreanDate(this.props.createdAt, 5)} 
       </td> 
      </tr> 
     ) 
    } 
});

感謝您的耐心:)

有一個愉快的一天！

來源

2015-10-09 Programming Pearls

的< and the >應該是實體 – epascarello

"<" = < (lower then)

">" = > (greater then)

<pre> 
 
    <code class="javascript"> 
 
    const { Link } = ReactRouter; 
 

 
    App.QnAChild = React.createClass({ 
 
     mixins: [Mixins.Accounts, Mixins.Utils], 
 

 
     render() { 
 
     let name = ""; 
 

 
     if (this.props.user && this.props.user.name) { 
 
      name = this.props.user.name; 
 
     }  
 

 
     return (
 
      &lt;tr&gt; 
 
      &lt;td&gt; 
 
       {this.props.index + 1} 
 
      &lt;/td&gt; 
 
      &lt;td&gt; 
 
       &lt;Link to={`/qna/${ this.props._id }`} 
 
        className="title-link"> {this.props.title} 
 
       &lt;/Link&gt; 
 
      &lt;/td&gt; 
 
      &lt;td&gt; 
 
       &lt;Link to=""&gt; 
 
       {name} 
 
       &lt;/Link&gt; 
 
      &lt;/td&gt; 
 
      &lt;td&gt; 
 
       {this.momentKoreanDate(this.props.createdAt, 5)} 
 
      &lt;/td&gt; 
 
      &lt;/tr&gt; 
 
     ) 
 
     } 
 
    });   
 
    </code> 
 
</pre>

你應該將代碼存儲在一個變量：

var myCode = "<html>"; 
var processed = yourProcessor(myCode); 
$('pre code').innerHTML = processed;

來源

2015-10-09 18:07:08 webdeb

謝謝！！我試圖替換源代碼。 innerHTML.replace（//gi，「>」）; 所以，我想獲得innerHTML中的原始代碼... :) –

@ProgrammingPearls檢查編輯 – webdeb

我發現消失到innerHTML中的表標記（tr，td）... 其他標記（div，span）是存在於innerHTML ... 我不明白.. –

如何獲取innerHTML中的原始html字符串？

回答

相關問題