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();

js jQuery笔记的更多相关文章

  1. js+jquery 笔记

    本人也不知道该怎么写javascript笔记,本人就拿一个例子来写,这个例子就从算法所说起吧! 例如: 一个整数的数组 [122,393,664,935,1386,1675,1928,2199,247 ...

  2. 基于jquery的插件turn.js学习笔记

    基于jquery的插件turn.js学习笔记 简介 turn.js是一个可以实现3d书籍展示效果的jq插件,使用html5和css3来执行效果.可以很好的适应于ios和安卓等触摸设备. How it ...

  3. React.js入门笔记

    # React.js入门笔记 核心提示 这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...

  4. 前端:jQuery笔记

    前端:jQuery笔记 此系列文章乃是学习jQuery的学习笔记. Asp.net MVC Comet推送 摘要: 一.简介 在Asp.net MVC实现的Comet推送的原理很简单. 服务器端:接收 ...

  5. 【转】Backbone.js学习笔记(二)细说MVC

    文章转自: http://segmentfault.com/a/1190000002666658 对于初学backbone.js的同学可以先参考我这篇文章:Backbone.js学习笔记(一) Bac ...

  6. Node.js学习笔记(3):NPM简明教程

    Node.js学习笔记(3):NPM简明教程 NPM常用操作 更新NPM版本 npm install npm -g -g,表示全局安装.我们可以指定更新版本,只需要在后面填上@版本号即可,也可以输入@ ...

  7. Python全栈之jQuery笔记

    jQuery runnoob网址: http://www.runoob.com/jquery/jquery-tutorial.html jQuery API手册: http://www.runoob. ...

  8. jQuery笔记之 Ajax回调地狱

    本次演示回调地狱: 模拟电影网站,判断用户是否为该网址的vip用户(最高权限为vip) 如果vpi就展示出vip电影,点击相应的电影显示出该电影的详细介绍 ---------------------- ...

  9. js学习笔记:webpack基础入门(一)

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

随机推荐

  1. chaper3_exercise_Uva1585_score

    #include<iostream> #include<string> using namespace std; int main(void) { , j = ; string ...

  2. iOS-Runtime-Headers

    iOS8.4 及之前的头文件 私有及共有API https://github.com/nst/iOS-Runtime-Headers  

  3. rhel7初体验

    Redhat7界面明显比之前的版本华丽了不少,貌似Redhat对普通用户的使用也要进行普及 可以在安装的同时修改root密码和创建新用户

  4. 网站通用登录模块代码 分类: ASP.NET 2014-12-06 10:49 615人阅读 评论(0) 收藏

    1.HTML部分:     <form id="form1" runat="server">     <script src=".. ...

  5. phpcms v9网站搬家更换域名的方法

    PHPCMS 是国内领先的网站管理系统,同时也是一个开源的PHP开发框架. 本文介绍phpcms v9网站搬家更换域名的方法. 1.在新的主机空间把phpcms安装好. 新安装的版本一定要和准备搬迁的 ...

  6. [Outlook] 重新取得outlook中被禁止访问的文件

    摘要:接收到老大的邮件,邮件中带有jar包,导致我无法接收到这个文件,outlook2010中提示:outlook禁止访问不安全……,相信很多人都遇到过这个问题,以前也遇到过,总没去想着解决这个问题, ...

  7. [Spring Batch] 图解Spring Batch原理

    找到一副以前学习的图,稻清楚的描述了Spring Batch运行原理:  

  8. win8.1/win10 UEFI + GPT 安装(测试机型:华硕S56CM)

    本教程简要介绍在UEFI 启动模式下在GPT分区表中,最简单的方法安装 Windows 10 x64 位系统.(并非傻瓜教程,安装者总要有一定的经验基础)下面先简单介绍一下UEFI和GTP. UEFI ...

  9. hibernate 关联映射

    关联关系大致分为两大类: 1.单向关系:只需单向访问关联端.例如:只能通过老师访问学生,或者只能通过学生访问老师. 2.双向关系:关联的两端可以互相访问.例如:老师和学生之间可以互相访问. 单向关联可 ...

  10. DrawerLayout

        一.概述       DrawerLayout是官方提供的侧滑菜单,相比SliddingMenu,它更加轻量级.默认情况下,DrawerLayout可以设置左侧或者右侧滑出菜单.如下,   x ...