我如何在我的网站页脚中的另一个现有ul元素之前插入ul元素

我有一个网站，其中包含由Atlassian Confluence提供的文档部分。在我的文档的页脚中，Atlassian提供了一些信息，如图所示。我如何在我的网站页脚中的另一个现有ul元素之前插入ul元素

我想要做的是在它上面添加一个句子。到目前为止，我只能将它添加到现有的ul下面。在合流中，我只能通过在自定义HTML块中插入新代码来覆盖元素。

这是我的代码从页脚得到，当我检查我的网页浏览器的页脚元素。

<section class="footer-body"> 
 
    <ul id="poweredby">...</ul> 
 
</section>

，这是我插入自定义HTML块得到的页脚我一句的代码。（如图所示的图片）

<ul id="copyright"> 
 
    <li class="noprint"> THIS INFORMATION SHOULD BE ABOVE </li> 
 
</ul>

我怎样才能改变这种代码，以便它被插入现有的合流上面的句子？

来源

2017-06-19 JP Garza

我喜欢@Hitmands的答案，但如果你想动态地创建元素，你可以这样做https://codepen.io/anon/pen/awJLxb。不知道这是否有帮助。如果您愿意，我可以提交答案。 –

如下记载： https://developer.mozilla.org/en-US/docs/Web/API/Node/insertBefore

function move() { 
 
    var copyright = document.querySelector('#copyright'); 
 
    var target = document.querySelector('#poweredby'); 
 

 
    target.parentNode.insertBefore(copyright, target); 
 
} 
 

 
window.setTimeout(move, 3000);

<section class="footer-body"> 
 
    <ul id="poweredby"> 
 
     <li> hello world</li> 
 
    </ul> 
 
</section> 
 

 
<ul id="copyright"> 
 
    <li class="noprint"> THIS INFORMATION SHOULD BE ABOVE </li> 
 
</ul>

来源

2017-06-19 16:08:42 Hitmands

-1

使用jQuery，在文件负载，可以dinamically一个元素移动到另一个

$(document).ready(function() { 
    $('#copyright').prependTo($('.footer-body')); 
});

来源

2017-06-19 16:10:20 Truerick

这将最终插入节点作为容器的第一个子节点，但是，他希望在'＃poweredby'之前＃ – Hitmands

在他的示例和图片上，只有2个元素，因此prepend是有效的选择 – Truerick

它不是' t，该片段仅显示OP的相关部分，但您无法知道真实案例，并且您的解决方案很容易出错。 – Hitmands

我如何在我的网站页脚中的另一个现有ul元素之前插入ul元素

回答

相关问题