Question

我正在使用一个所有标题都使用h2标签的网页。我想转换第一个标题，以便使用h1。

这是我正在使用的代码：

<script type="text/javascript">
var myHeader = $('h2:first');
var myHeaderHTML = myHeader.html();

alert("myHeader: " + myHeader);
alert("myHeaderHTML: " + myHeaderHTML);

$(document).ready(function() {
$(myHeader).replaceWith("<h1>" + $(myHeaderHTML) + "</h1>");
});
</script>

然而，当我重新加载页面时，我得到一个包含在h1标签内的[object Object]错误。正如您在上面所看到的，我在代码中添加了一些警报，因此我可以看到变量包含的值，并且它是包含[object Object]的myHeader变量。 myHeaderHTML变量包含我期望的内容。

我该如何解决这个问题？

Answer 1

这是错误的：

"<h1>" + $(myHeaderHTML) + "</h1>"

您正在向对象添加字符串，该对象将对象转换为字符串"[Object object]"并执行连接。

应该是：

 "<h1>" + myHeaderHTML + "</h1>"

Answer 2

你不应该再次调用jquery。

$(myHeader).replaceWith("<h1>" + myHeaderHTML + "</h1>");

Answer 3

通过$(myHeaderHTML)，您将HTML字符串包装在jQuery对象中，当与其他字符串（[object Object]）连接时，该对象将被序列化"<h1>"。

使用

$(document).ready(function() {

    var myHeader = $('h2:first');
    var myHeaderHTML = myHeader.html();

    alert("myHeader: " + myHeader); // alerts [object Object] as well
    alert("myHeaderHTML: " + myHeaderHTML);

    myHeader.replaceWith("<h1>" + myHeaderHTML + "</h1>");
});

Answer 4

这是一种可能更安全的方法，不需要将HTML内容放入字符串中：

<script type="text/javascript">
  $(function(){
    $('h2:first').wrapInner('<h1>').find('h1').unwrap();
  });
</script>

尝试将第一个h2标记转换为h1时出现jQuery [object Object]错误

4 个答案: