簡體   English   中英

如何使用jQuery替換HTML標簽

[英]How to replace html tags using jquery

我想使用Java腳本將div和span標簽更改為tr td。 但是,Java腳本替換功能僅替換第一次出現的內容,而保持原樣。

<div style="width:100%">
  <div style="border-bottom:1px solid #DDDDDD; padding:10px 0px; height:100%; overflow:hidden;">
    <span style="width:420px; display:block; float:left; border-bottom:1px thin #333333;background:#F2F2F2">
      Custom Stirrups : Category - Adult ,Size-One size fits most 
    </span> 
    <span style="width:220px; display:block; float:left; border-bottom:1px thin #333333;background:#F2F2F2">
      NO
    </span>
    <span style="width:140px; display:block; float:left; border-bottom:1px thin #333333;background:#F2F2F2">
      1
    </span><br />
  </div>
  <div style="border-bottom:1px solid #DDDDDD; padding:10px 0px; height:100%; overflow:hidden;"> 
    <span style="width:420px; display:block; float:left; border-bottom:1px thin #333333;background:#F2F2F2">
      Flat Visor Fitted : Fitted Sizes - 7 1/8 
    </span> 
    <span style="width:220px; display:block; float:left; border-bottom:1px thin #333333;background:#F2F2F2">
      NO 
    </span> 
    <span style="width:140px; display:block; float:left; border-bottom:1px thin #333333;background:#F2F2F2">
      1
    </span>
    <br />
  </div>
</div>

我想要類似的東西

<table width="100%">
        <tbody>
          <tr>
            <td width="471" style="background:#F2F2F2">Cap : Fitted Sizes - 6 5/8 </td>
            <td width="240" style="background:#F2F2F2">YES</td>
            <td width="145" style="background:#F2F2F2">1</td>
          </tr>
          <tr>
            <td width="471" style="background:#F2F2F2">Grey Dri-fit Undershirt : Size - XXL </td>
            <td width="240" style="background:#F2F2F2">YES</td>
            <td width="145" style="background:#F2F2F2">1</td>
          </tr>
         </tbody>
      </table>

這是我正在嘗試的腳本...請讓我知道我錯了

var data = $('#dvData').html();
  data = data.replace('/<div style="width:100%">/g', '<table width="100%"><tbody><tr>');
  data = data.replace('/</div>/g', '</tbody></table></tr>');

提前致謝..

請參閱http://www.w3schools.com/jsref/jsref_replace.asp。這是用於全局替換的:

var str="Mr Blue has a blue house and a blue car";
var n=str.replace(/blue/g,"red");

那里也提供了其他示例。

我看到您也標記了jquery,所以假設您也接受jquery?

您可以為此使用.replaceWith()

$('span, div, tr , td').replaceWith('Replaced!');

好吧,當dom被解析時,它是不變/不變的

您可以嘗試以下方法:

$('div').contents().unwrap().wrap('<tr/>');

看那里的tr標簽...

如果它有作用的嘗試

$(this).replaceWith($('<tr>' + this.innerHTML + '</tr>'));

您可以嘗試類似的方法。.我知道這不是最好的方法...

var data = $('#dvData').html();
  data = data.toString();
    data = data.replace('<div style="width:100%">', '<table width="100%">');
data = data.replace('span', 'td');

因此,請嘗試使用.replaceAll()。 如果沒有幫助,請使用循環。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM