Question

我有这些字符串

var str = '<div class="page">&lt;div class</div>
<div class="page">=&quot;nodejs-c</div>
<div class="page">lass&quot;&gt;Wakh</div>
<div class="page">ed un sing</div>
<div class="page">e sur son </div>
<div class="page">argent les</div>
<div class="page"> appelle d</div>
<div class="page">e l&#39;argent</div>
<div class="page"> et garçon</div>
<div class="page">asseoir S</div>
<div class="page">inge incha</div>
<div class="page">ngée.&lt;&#x2F;div</div>
<div class="page">&gt;</div>';

我尝试用pageWrap

包装页面类

var content = $(str).wrap('<div id="source-wrapper"></div>')
                    .find('.page')
                    .wrap('<div class="pageWrap"></div>')
                    .closest('.pageWrap')
                    .text(function() {
                        return $(this).html()
                    })
                    .closest('#source-wrapper')
                    [0].outerHTML;

我得到了未定义的HTML？我的text（）函数有什么问题吗？

Answer 1

您已选择.page，因此find()方法无法在此处搜索.page，但其中没有包含该类的元素。最后，您正在尝试获取未定义ID且未选中任何内容的dom对象并返回undefined，并且您尝试从outerHTML获取undefined属性。

使用wrappAll()方法使用单个元素包装所有元素，然后不需要find()方法，因为它已经是.page元素的集合。

var str = '<div class="page">&lt;div class</div><div class="page">=&quot;nodejs-c</div><div class="page">lass&quot;&gt;Wakh</div><div class="page">ed un sing</div><div class="page">e sur son </div><div class="page">argent les</div><div class="page"> appelle d</div><div class="page">e l&#39;argent</div><div class="page"> et garçon</div><div class="page"> asseoir S</div><div class="page">inge incha</div><div class="page">ngée.&lt;&#x2F;div</div><div class="page">&gt;</div>';


var content = $(str)
  // wrap all the elements by a single tag
  .wrapAll('<div id="source-wrapper"></div>')
  // wrap each individual element
  .wrap('<div class="pageWrap"></div>')
  .closest('.pageWrap')
  .text(function() {
    return $(this).html();
  })
  .closest('#source-wrapper')[0].outerHTML;

console.log(content);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

只需删除[0]部分，因为#source-wrapper只返回一个元素，而不是元素数组。

$(document).ready(function() {
  var content = $('.page').wrap('<div id="source-wrapper"></div>').find('.page')
    .wrap('<div class="pageWrap"></div>')
    .closest('.pageWrap')
    .text(function() {
      return $(this).html()
    })
    .closest('#source-wrapper')
    .outerHTML;
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="page">&lt;div class</div>
<div class="page">=&quot;nodejs-c</div>
<div class="page">lass&quot;&gt;Wakh</div>
<div class="page">ed un sing</div>
<div class="page">e sur son</div>
<div class="page">argent les</div>
<div class="page">appelle d</div>
<div class="page">e l&#39;argent</div>
<div class="page">et garçon</div>
<div class="page">asseoir S</div>
<div class="page">inge incha</div>
<div class="page">ngée.&lt;&#x2F;div</div>
<div class="page">&gt;</div>

“undefined的outerHtml”在jquery中出错

2 个答案: