将一个ul下的li转移到另外一个ul里面 【appendTo】

<1>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>将一个ul下的li转移到另外一个ul里面</title>
    <script src="script/jquery-1.11.0.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            //创建一个节点
            var li = $("<li>中国队</li><li>美国队</li><li>巴西队</li><li>德国队</li>")
            //给这个节点添加到#ul1里面
            $("#ul1").append(li)
            $("ul li").mouseover(function () {
                $(this).css("background", "red").siblings().css("background", "White").click(function () {

                    //$(this).appendTo($("#ul2"))的意思是将当前的li添加到#ul2里面
                    $(this).appendTo($("#ul2")).css("background","white")
                })
            })
        })
    </script>
</head>
<body>
<ul id="ul1" style=" float:left"></ul>
<ul id="ul2"style=" float:right"></ul>
</body>
</html>

             

将一个ul下的li转移到另外一个ul里面 【appendTo】

时间: 2024-10-03 23:03:16

将一个ul下的li转移到另外一个ul里面 【appendTo】的相关文章

ul下的li浮动,如何是ul有li的高度

此时ul展示的界面为: ①给ul加上一个样式,display:inline-block; <html> <head> <title>float</title> <style> ul{ display: inline-block; border:1px solid #000; } ul li{ border:1px solid #f00; float:left; } </style> </head> <body>

jquery选择div下的ul下的li下的a

使用jQuery选择器: $("div#div的id ul li a")//选择的是div下 ul下所有li下的所有a标签 $("div#div的id").children("ul:first").children("li:first").find("a");//div下的第一个ul下的第一个li下的a标签 //可以用下标 $("div#div的id").children("u

遍历ul下的li,点击弹出li的索引

首先我们需要一个html结构 <div > <ul> <li>a</li> <li>a</li> <li>a</li> <li>a</li> <li>a</li> </ul> </div> 我们遍历ul 下所有的li 并添加点击事件,一般我们会在for循环里面添加点击事件,但是结果和我们所期盼不一样,那么是为什么呢???? 接下来看看我们的

jqury控制&lt;ul&gt;下的&lt;li&gt;选中效果

这里是引用art-template模板的版本(具体不详说啦) css部分 .wk_res_ul li.active a ,.wk_res_ul li:hover a{    color: #f90 !important;} ---------------------------------------- html部分 <ul class="wk_res_ul fl_ul" style="border-bottom:none" id="subject_

jquery,javascript -设置某一ul下的li下的 a的属性

//javascriptvar ul = document.getElementById('ul); var as = ul.getElementsByTagName('a'); for(var i = 0; i <as.length; i++) { as.item(i).onmouseover = function() { var iframe_con = document.getElementById(pos_content); var src = './content/' + this.i

解决ul下的li换行问题,(父元素div加overflow:scroll没作用的问题)

#left, #right { width: 50%; box-sizing: border-box; min-height: 100%; float: left; overflow: scroll;//必须写} #left ul{ float: left;//必须写 display:flex;//必须写 }#left ul > li { display:inline-block;//必须写 list-style: none; box-sizing: border-box; float: lef

问题:FF中把UL下的LI设为左浮动UL的背景色就没有了?

因为容器的子元素设置浮动后, 内容移出了文档流!  解决办法: 1.给个overflow:hidden;作为闭合浮动元素2.设定UL 一个固定的高度 下面是一些与之相关的解决办法,参考文章<那些年一起清除过的浮动><style type="text/css"> .warp{ width:80%; border:1px solid #000000; } .main{ width:70%; height:300px; background-color:#999933

找到div下的第一个ul

$("div#div的id ul li a")//选择的是div下 ul下所有li下的所有a标签 $("div#div的id").children("ul:first").children("li:first").find("a");//div下的第一个ul下的第一个li下的a标签 //可以用下标 $("div#div的id").children("ul:eq(0)"

query怎么获取ul下的多个li元素的宽度总和

一般情况下,li 的宽度是固定的话, 直接 获取li的数量  *  宽度就可以了 比如: 获取li 的个数: var lis = $('ul li ').length; 如果 li 宽度是  100的话. var UL= lis * 100; ul宽度 = li 个数 * li 的宽度 li 的宽度不是固定的 var sumWidth =0;  $("ul").find("li").each(function(){sumWidth += $(this).witdh(