12

コントロールできないウィジェットの HTML 出力を変更しようとしています。基本的に問題は、ウィジェットが無効な ap 内で div を使用する HTML を出力することです。

<div class="widget_output">
    <ul>
        <li>
            <p>
                <div>This is a random item</div>
                <div>This is a random item</div>
                <div>This is a random item</div>
                <div>This is a random item</div>
            </p>
       </li>
       <li>
            <p>
                <div>This is a random item</div>
                <div>This is a random item</div>
                <div>This is a random item</div>
                <div>This is a random item</div>
            </p>
        </li>
</div>

私の考えは、div をインライン要素であるスパンに変更することです。そうすれば、HTML は有効になるはずです。私はjqueryを見て、クラスを選択してから、これらのdivをスパンに変換しようとしました。誰かが私を正しい方向に向けたり、似たようなことを達成した人のチュートリアルを教えてもらえますか?

4

2 に答える 2

19

JSFiddle をくっつけただけです:

http://jsfiddle.net/daYL4/3/

$(".widget_output div").replaceWith(function() { 
    return "<span>" + this.innerHTML + "</span>"; 
});

私の最初の提案よりもうまくいくようです。しかし、いくつかの良い点をカバーしているので、この関連する質問への回答を見てください。

jQuery を使用して HTML タグを変更しますか?

于 2012-07-29T07:10:09.760 に答える
2

そのためにjQueryは必要ありません。正規表現を使用して、<div>タグを<span>タグに置き換えることができます。これを試して：

var widgetHTML = $('div.widget_output').html();
    widgetHTML = widgetHTML
       .replace(/<div>/g, '<span>')
       .replace(/<\/div>/g, '</span>');
$('div.widget_output').html(widgetHTML);

デモ： http： //jsfiddle.net/codef0rmer/daYL4/3/

于 2012-07-29T07:59:54.703 に答える