0

HTML の文字列全体を検索して置換するのに問題があります。

このフィドルでの私の例は、div タグ全体をそのすべてのクラスとマークアップに置き換えようとしているものです。

HTML:

<ul class="slides">
      <li><div class="flex-caption"><strong>Climb to the Top of Your Potential</strong>&nbsp;</div></li>
      <li><div class="flex-caption"><strong>Reach for the Clouds with Simple Solutions</strong>&nbsp;</div></li>
      <li><div class="flex-caption"><strong>Obtain the Courage to Suceed as a Leader, Team, & Company</strong>&nbsp;</div></li>
</ul>

JavaScript:

// This works perfect to search & replace text strings, but not for searching HTML:

jQuery(document).ready(function(){
function makeLink () {
jQuery(".flex-caption").html(function(i, str) {
return str.replace("Climb to the Top of Your Potential", "<div class='caption-align'>Climb to the Top of <a href='http://google.com'>Your Potential</a></div>");
});
}makeLink();
});

// Issue #1: This is my failed attempt to search & replace a large portion of the string:

jQuery(document).ready(function(){
function changeString () {
jQuery(".flex-caption").html(function(i, str) {
return str.replace("<div class='flex-caption'><strong>Reach for the Clouds with Simple Solutions</strong></div>", "<div class='flex-caption'><strong><div class='caption-align caption-right'>REPLACED TEXT! Reach for the Clouds with Simple Solutions</div></strong>&nbsp;</div>");
});
}changeString();
});

// Issue #2: I don't know why the character "&" is break this, so I tried \u0026 & both CDATA with no avail:

jQuery(document).ready(function(){
function changeString2 () {
jQuery(".flex-caption").html(function(i, str) {
return str.replace("<strong>Obtain the Courage to Suceed as a Leader, Team, \u0026 Company", "<i>Obtain the Courage to Suceed as a Leader, Team, \u0026 Company");
});
}changeString2();
});

http://jsfiddle.net/LqkNE/

ご覧のとおり、2 つの小さな問題があります。

私は何を間違っていますか？

4

2 に答える 2

1

ここに作業バージョンがあります: http://jsfiddle.net/Regisc/jeVjn/

前述のように、&エンコードする必要があり、最初の発行では、他の部分は変更されないため、強力な部分のみを置き換えることができます

編集：

// Issue #1: This is my failed attempt to search & replace a large portion of the string:

jQuery(document).ready(function () {
  function changeString() {
    jQuery(".flex-caption").parent().html(function (i, str) {
      return str.replace(
        '<div class="flex-caption"><strong>Reach for the Clouds with Simple Solutions</strong>&nbsp;</div>', 
        "<div class='flex-caption flex-align'><strong><div class='caption-align caption-right'>REPLACED TEXT! Reach for the Clouds with Simple Solutions</div></strong>&nbsp;</div>"
      );
    });
  }

  changeString();
});

http://jsfiddle.net/jeVjn/1/

parent()、単純な引用符に注意してください。&nbsp;これは、.flex-captionhtml が機能して<strong>...いないため機能していませんでした<div class=".flex-caption">...

于 2012-09-02T05:09:16.040 に答える
0

としてエンコードする&必要があります&amp;

したがって、html は次のようになります。

      <li><div class="flex-caption"><strong>Obtain the Courage to Suceed as a Leader, Team, &amp; Company</strong>&nbsp;</div></li>

そして JavaScript:

jQuery(document).ready(function(){
  function changeString2 () {
    jQuery(".flex-caption").html(function(i, str) {
      return str.replace("<strong>Obtain the Courage to Suceed as a Leader, Team, &amp; Company", "<i>Obtain the Courage to Suceed as a Leader, Team, &amp; Company");
    });
  }
  changeString2();
});
于 2012-09-02T05:04:06.937 に答える