<ul id="ul">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
<span id="pre">pre</span>
<script>
window.onload = function(){
var pre = document.getElementById('pre');
var ul = document.getElementById('ul');
var lis = ul.getElementsByTagName('li');
pre.onclick = function(){
ul.insertBefore(ul.lastChild,ul.firstChild);
}
}
为什么点两下实现一次;
但是只要把 ul.firstChild 换成 lis[0]就清除了bug。求DOM大神解答。
写代码你还可以再仔细点:domo -> demo、functioin -> function
小弟刚入门,不太明白您什么意思。能否详细。
@大贱豪: 先把你贴出来的代码跑通,
@幻天芒: 不太明白跑通的意思,是不是在Firefox中没有报错;
@大贱豪: 你在检查下你的代码,在代码里搜索domo变为demo、搜索functioin变为function
@幻天芒: 哦哦哦,这是我随意打的。我是上次写过没有报错的代码,但就是没有成功要点两下他才会实现。
@大贱豪: 等我下,我打份完整的。
@大贱豪:
<ul id="ul">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
<span id="pre">pre</span>
<script>
window.onload = function(){
var pre = document.getElementById('pre');
var ul = document.getElementById('ul');
var lis = ul.getElementsByTagName('li');
pre.onclick = function(){
ul.insertBefore(ul.lastChild,ul.firstChild);
}
}
点两下实现一次。
@大贱豪: 代码很重要的一点就是排版,你贴的代码,完全没有看下去的欲望啊。就算不能实现功能,那让代码好看一点,也是可行的吧。
@大贱豪: 至于为什么你的代码有问题,你可以输出ul.childNodes 和ul.children对比看看。。因为firstChild是取的childNodes的第一个元素,这不难发现其实是一个回车符。
<ul id="ul"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> <span id="pre">pre</span> <script> window.onload = function(){ var pre = document.getElementById('pre'), ul = document.getElementById('ul'); pre.onclick = function(){ ul.insertBefore(ul.children[ul.childElementCount - 1], ul.childNodes[0]); } }; </script>
@幻天芒: 大神,我这是从sublimetext上粘贴过来的。粘过来就这样了。代码不多还可以看吧。
@幻天芒: lastChild是取的childNodes的第一个元素???不是最后一个吗。我知道怎么使我的代码实现,我就想问问为什么我原来那样子不行。
@大贱豪: 写错了,是firstChild,已更正。
我只是想告诉你。ul.childNodes和ul.children不等价,这就是你出错的原因。firstChild和lastChild是针对childNodes来说的。console.log(ul.childNodes);console.log(ul.children);输出对比下就知道了。
@幻天芒: 明白了。好评