在动态生成的表之后插入一个来自jQuery的跨度

insert a span from jQuery after dynamically generated table

本文关键字：一个 jQuery 动态 之后 插入      更新时间：2023-09-26

我试图在动态生成的表之后添加一个span，但在加载表的内容之前就添加了span。

以下是我的代码：

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    dash();
    $("button").click(function(){
        $("#th").append("<span>span</span>");
    });
});
function dash()
{ 
     $("#hu").html();
     $("#hu").append("<tr> <td> see this </td> </tr>");
}
</script>
</head>
<body>
<button>Insert content after each p element</button>
<div align="right" id="th">
<table id="hu" align="right">
<tr><td>hello</td></tr>
</table>
</div>
</body>
</html>

在hello之前添加跨度。我希望跨度显示在表格内容之后。

span被添加到dom的底部。您在表格前面看到它，因为表格是右对齐的。尝试以下操作：

$(document).ready(function(){
    dash();
    $("button").click(function(){
        $("#th").append("<span>span</span><br/>");
    });
});
function dash()
{ 
     $("#hu").html();
     $("#hu").append("<tr> <td> see this </td> </tr>");
}
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<body>
<button>Insert content after each p element</button>
<div align="right" id="th">
<table id="hu" >
<tr><td>hello</td></tr>
</table>
  <br/>
</div>
</body>
  
</html>

您编写的内容类似于$("#hu").after("<span>span</span>");

这将把span放在表之后

像@Reoxey那样使用jQuery after函数。但是，请确保在</body>标记之前添加脚本，而不是在<head>标记上使用脚本。建议在</body>标记之前添加Javascript，以防止脚本加载时出现渲染阻塞，这对站点感知头来说要好得多。在</body>标签之前添加Javascript也将提高站点加载速度。

嘿，马努试试这个。

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    dash();
    $("button").click(function(){
        $("#hu").append("<span>span</span>");
    });
});
function dash()
{ 
     $("#hu").html();
     $("#hu").append("<tr> <td> see this </td> </tr>");
}
</script>
</head>
<body>
<button>Insert content after each p element</button>
<div align="right" id="th">
<table id="hu" align="right">
<tr><td>hello</td></tr>
</table>
</div>
</body>
</html>

您应该使用表id，即#hu作为#th 的位置进行附加

希望这能有所帮助。：）

只需更改：

$("#th").append("<span>span</span>");

至：

$("table").append("<span>span</span>");

JS Fiddle：http://jsfiddle.net/tk4h80yn/

这将帮助您

  $(document).ready(function(){
    dash();
    $("button").click(function(){
        $("#hu").after("<span>span</span>");
    });
  });
相关文章：