zoukankan      html  css  js  c++  java
  • DOM操作

    点击表格里的内容,弹出对话框,对话框显示的内容是表格的内容

    <script src="Script/jquery-1.7.1.min.js"></script>
        <script language="javascript">
            $(document).ready(function () {
                $(".tritem td").click(function () {
                    alert($(this).html());
                });
            });
        </script>

    操作相关元素

    里:children()  外:parent()

        <script src="Script/jquery-1.7.1.min.js"></script>
        <script language="javascript">
            $(document).ready(function () {
                $(".tritem td").click(function () {
                    $(this).parent().children().eq(0).css("background-color","yellow");//点击整行使找到的第一个背景颜色变为黄色
                });
            });
        </script>
    $(this).parents("#GridView1").find(".trhead").css("background-color","blue");//点击表格使表头背景颜色变为蓝色

    上:prev(),prevAll("选择器")

    $(this).parent().prevAll(".tritem").css("background-color","yellow");

    下:next(),nextAll("选择器");

     $(this).parent().nextAll().css("background-color","red");

    元素的添加:append(元素对象)

                    var tr = $(this).parent();
                    $("#tb").append(tr);

    复制:clone()

                    var tr = $(this).parent().clone();
                    $("#tb").append(tr);

    清除:empty() - 保留外围的元素,把子元素和内容全都清除掉

    移除: remove() - 把元素全都删除

                $("GridView1 tr").dblclick(function () {
                    $(this).parents("table").empty();
                $("GridView1 tr").dblclick(function () {
                    $(this).parents("table").remove();
                });

    替换:replaceWith()

     <script language="javascript">
            $(document).ready(function () {
                var o = $("ul").find("li").first();
                var n = $("ul").find("li").last().clone();
                $(o).replaceWith(n);
            });
        </script>

    点击单元格变成文本框,可在文本框里添加内容

                    var txt = "<input type='text' class='tt'>";
                    var $txt = $(txt);
                    $txt.val($(this).text());
                    $(this).empty().append($txt);
                    $txt.click(function () {
                        return false;
                    });
                    $txt.blur(function () {
                        var s = $(this).val();
                        $txt.replaceWith(s);
                    });
  • 相关阅读:
    linux(CENTOS)系统各个目录的作用详解
    2018 焦作E java 高精度暴力
    [SHOI2015]激光发生器,计算几何 直线相交
    codeforces 600E dfs+线段树合并
    2018 南京区域赛A SG打表
    8个常见的硬币博弈的SG值规律
    hdu 3389 阶梯博弈
    组合游戏与博弈好文
    gym 100500B 多项式哈希+Rabbin-Karp/最小表示法
    zjoi 2007 捉迷藏 动态点分治+可删堆
  • 原文地址:https://www.cnblogs.com/qianxiaojinnian/p/4750615.html
Copyright © 2011-2022 走看看