如何在Javascript中重新排序子标记
如何在Javascript中重新排序子标记
提问于 2018-08-02 04:52:56
我正在尝试用Javascript重新排序2个元素，这样一个元素就会出现在另一个元素之后。我使用的是Wordpress插件模板，这就是我不能修改原始模板文件的原因。
下面是我正在使用的HTML：
<td class="membership-actions order-actions">
<a href="#" class="button cancel">Cancel</a>
<a href="#" class="button view">View</a>
</td>我希望视图按钮出现在取消按钮之前。
下面是我创建的用来交换两个a标签的javascript函数，但它似乎不起作用。
function myscript() {
$(".view").insertAfter(".cancel");
}回答 2
Stack Overflow用户
发布于 2018-08-02 05:02:17
试试看，如果有帮助，请告诉我。
$(function() {
let cancelButton = $("a.button.cancel");
let viewButton = $("a.button.view");
//cancelButton.insertAfter(viewButton);
viewButton.insertBefore(cancelButton)
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td class="membership-actions order-actions">
<a href="#" class="button cancel">Cancel</a>
<a href="#" class="button view">View</a>
</td>
Stack Overflow用户
发布于 2018-08-02 05:09:50
只要切换选择器的位置即可。$(".view").insertAfter(".cancel")将在cancel链接之后插入view链接，但$(".cancel").insertAfter(".view")将在view链接之后插入view链接。
function myscript() {
$(".cancel").insertAfter(".view");
}
myscript();<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td class="membership-actions order-actions">
<a href="#" class="button cancel">Cancel</a>
<a href="#" class="button view">View</a>
</td>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51642089
复制相关文章
相似问题