zoukankan      html  css  js  c++  java
  • js jQuery笔记

    jQuery

    1、几种获取子元素的方法及区别

    children方法获得的仅仅是元素一下级的子元素,即:immediate children。 
    find方法获得所有下级元素,即:descendants of these elements in the DOM tree 
    children方法的参数selector 是可选的(optionally),用来过滤子元素,但find方法的参数selector方法是必选的。 

    $("#list p") 是查找id为list的元素的所有是P标签的后代,即:子元素,孙子元素,孙孙子元素……都可以。

    $("#list>p") 是查找id为list的元素的所有是P标签的一级后代,超过一代就获取不到了。

    2、超链接添加onclick事件后,阻止超链接跳转:

    <div class="SubCategoryBox">
        <ul>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">佳能</a><i>(30440)</i></li>
            <li><a href="#">其他品牌相机</a><i>(30440)</i></li>
        </ul>
        <div class="showmore">
            <a href="more.html" id="button-1" data-role="button"
                data-icon="arrow-d" data-iconpos="left">
                显示全部品牌
            </a>
        </div>
    </div>
    </body>
    <script type="text/javascript">
    var $category=$("ul li:gt(5):not(:last)");
    $category.hide();
    var $toggleBtn=$("div.showmore>a");
    $toggleBtn.click(function(){
    $category.show();
    return false;//超链接不跳转
    });
    </script>

     3、jQuery查找属性节点

    var $para=$("p");

    var p_txt=$para.attr("title");

    4、jQuery创建节点

    var $li_1=$("<li></li>");

    var $li_2=$("<li></li>");

    $("ul").append($li_1).append($li_2);

     5、jQuery删除节点

    $("ul li").remove();

    $("ul li").remove("li[title!=菠萝]");

    detach();

    empty();

    6、复制节点

    $(this).clone().appendTo("ul");

    7、替换节点

    replaceWith();

    replaceAll();

  • 相关阅读:
    Meten Special Activities II
    Meten Special Activities II
    Meten Special Activities II
    Meten Special Activities II
    Meten Special Activities
    Meten Special Activities
    Meten Special Activities
    Meten Special Activities
    Meten Special Activities
    冒泡排序和选择排序
  • 原文地址:https://www.cnblogs.com/peterpanzsy/p/3995171.html
Copyright © 2011-2022 走看看