js对象上下移动怎么搞

JavaScript015

js对象上下移动怎么搞,第1张

视图的改变都应该是因为数据的改变而引起的,而不是直接通过一些api去更改视图,像你这种对应的数据应该类似

[

    {

        name: '开始',

        value: 1

    },

    {

        name: '结束',

        value: 2

    }

]

交换就是交换这个数据,然后根据新的数据去渲染你上面的视图,这样就不用担心数据和视图不同步了。

用document.getElementById(div1)获取到该div,然后操作它就行了,如果是文本上下移动完全可以使用marquee标签。

引用JS:

www.cyin.cn/js/front/supermarquee.js

HTML代码:

<div class="zuixinxuqiu" style="height: 197pxwidth: 678pxoverflow: hiddenposition: relative">

<ul>

<dl class="clearfix">

<dt class="coladdress">

成都市</dt>

</dl>

<dl class="clearfix">

<dt class="coladdress">

成都市</dt>

</dl>

<dl class="clearfix">

<dt class="coladdress">

成都市</dt>

</dl>

<dl class="clearfix">

<dt class="coladdress">

成都市</dt>

</dl>

<dl class="clearfix">

<dt class="coladdress">

成都市</dt>

</dl>

</ul>

</div>

执行JS:

$(".zuixinxuqiu").kxbdSuperMarquee({

isEqual: false,

distance: 33,

time: 5,

direction: 'up'

})

<!DOCTYPE html>

<html>

<head lang="en">

<meta charset="UTF-8">

<title>js</title>

<style>

</style>

<script>

window.onload=function(){

var sp=document.getElementsByTagName('span')

var last=document.getElementById('last')

var next=document.getElementById('next')

var n=0

for(var i=1i<sp.lengthi++){

sp[i].style.display='none'

}

last.onclick=function(){

n--

if(n<0){

n=0

}

for(var i=0i<sp.lengthi++){

sp[i].style.display='none'

}

sp[n].style.display='block'

}

next.onclick=function(){

n++

if(n>sp.length-1){

n=sp.length-1

}

for(var i=0i<sp.lengthi++){

sp[i].style.display='none'

}

sp[n].style.display='block'

}

}

</script>

</head>

<body>

<span>1</span>

<span>2</span>

<span>3</span>

<span>4</span>

<br>

<a id="last">上一页</a><a id="next">下一页</a>

</body>

</html>