<body>

<div id="one"><span>one</span></div>
<div class="test" bs="aa">two</div>
<div class="test">three</div>
<div class="test">four</div>
<input type="text" name="uid" bs="aa" id="uid" />
<input type="button" id="btn" value="取消绑定" />
<input type="button" id="add" value="绑定事件" />

</body>

书写位置在JS代码中

<script type="text/javascript">

书写格式：

$(document).ready(function(e) {

　　//JS方式
　　//1.根据ID取元素，DOM对象
　　//var div = document.getElementById("one");
　　//2.根据class取元素
　　//var div = document.getElementsByClassName("test");
　　//3.根据name取
　　//var bd = document.getElementsByName("uid");
　　//4.根据标签名取
　　//var div = document.getElementsByTagName("div");

　　//操作内容
　　//1.非表单元素
　　//alert(div.innerText);
　　//div.innerText = "aaaa";
　　//div.innerHTML;
　　//2.表单元素
　　//div.value

　　//操作属性
　　//div.setAttribute("","");
　　//div.removeAttribute("");
　　//div.getAttribute("");

　　//操作样式
　　//div.style.backgroundColor = "red";
　　//alert(div.style.color);只能获取内联样式

　　//在数组里面如果要取DOM对象使用索引的方式，如果要取Jquery对象使用eq()

　　//JQUERY方式
　　//1.根据ID取元素，Jquery对象
　　var div = $("#one");
　　//2.根据class取
　　//var div = $(".test");
　　//3.根据属性取
　　//var bd = $("[bs='aa']");
　　//4.根据标签名取
　　//var div = $("div");
　　//5.组合选取
　　//var div = $("div span");

　　//操作内容
　　//1.非表单元素
　　//alert(div.text());
　　//div.text("aaaa");  ——文本
　　//div.html();     —— html代码
　　//2.表单元素
　　//div.val("aaa");

　　//操作属性
　　//div.attr("属性名","属性值");  ——添加、设置属性
　　//div.removeAttr("属性名");  ——移除属性
　　//div.attr("属性名");   ——获取属性

　　//操作样式
　　//div.css("样式名","样式值");    ——添加样式
　　//div.css("样式名");   ——获取样式

　　//操作元素
　　//var str = "<div id='a' style='width:100px; height:100px; background-color:red'></div>";

　　//div.append(str); //追加元素
　　//$("#a").remove(); //移除某个元素

　　$(".test").click(function(){
　　$(this).text();
　　})

　　  绑定事件：
　　$(".test").bind("click",function(){

　　　　$(this).text();

　　});
  　　取消绑定：
　　$("#btn").click(function(){

　　　　$(".test").unbind("click");

　　});

绑定事件：
　　$("#add").click(function(){

　　　　$(".test").bind("click",function(){

　　　　　　$(this).text();

　　　　});
　　});

});

</script>

Jquery方法的应用的更多相关文章

  1. 1.4 jQuery方法，JSON介绍

    jQuery方法: jQuery添加元素: append()方法: $("元素").append("追加内容"); prepend()方法: $("元 ...

  2. SpringMVC框架下实现JSON（类方法中回传数据到jsp页面，使用jQuery方法回传）

    JSON的实现,即将需要的数据回传到jsp页面: 1>.加入实现Json的三个架包到lib中:2>.目标方法上边加入注解,需要返回的值3>.在jsp页面中书写jQuery方法: ec ...

  3. 形行色色的下拉菜单（HTML/CSS JS方法 jQuery方法实现）

    HTML/CSS方法实现下拉菜单来源:慕课网<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

  4. JQuery 方法简写

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  5. Jquery方法load之后导致js失效解决方法

    Jquery方法load之后导致js失效解决方法 >>>>>>>>>>>>>>>>>>> ...

  6. Javascript或jQuery方法产生任意随机整数

    方法1:javascritp方法 1 2 3 4 5 6 //随机数    function diu_Randomize(b,e){        if(!b && b!=0 || ! ...

  7. jquery方法详解

    jquery方法详解 http://www.365mini.com/doc

  8. jQuery方法区别:click() bind() live() delegate()区别

    今天看到一篇jquery 事件的文章,自己写了个小例子,虽然2种方式都可以实现,但是不太明白,找了点资料 $("#box1").delegate("p",&qu ...

  9. jQuery()方法的第二个参数

    关于jQuery()方法的第二个参数,有下面这几种用法: 1.jQuery(selector, [context]) 这种用法,相当于 $(context).find(selector) 或者 con ...

  10. 原生JS取代一些JQuery方法的简单实现

    原生JS取代一些JQuery方法的简单实现 下面小编就为大家带来一篇原生JS取代一些JQuery方法的简单实现.小编觉得挺不错的,现在就分享给大家,也给大家做个参考.一起跟随小编过来看看吧   1.选 ...

随机推荐

  1. javascript中substring()、substr()、slice()的区别

    在js字符截取函数有常用的三个slice().substring().substr()了,下面我来给大家介绍slice().substring().substr()函数在字符截取时的一些用法与区别吧. ...

  2. linux下vi的复制，黏贴，删除，撤销，跳转等命令

    前言     在嵌入式linux开发中,进行需要修改一下配置文件之类的,必须使用vi,因此,熟悉 vi 的一些基本操作,有助于提高工作效率. 一,模式vi编辑器有3种模式:命令模式.输入模式.末行模式 ...

  3. [leetcode]_Balanced Binary Tree

    第四道树题,逐渐能写递归了.虽然最后AC的代码还是看了网络,但是距离成功攻克此类问题仅一步之遥. 题目:一棵树,判断是否为AVL.(AVL条件:树上任意一点的左右子树的高度差<=1) 思路:树依 ...

  4. 如何在Word表格中的某一栏添加背景颜色

     如何在Word表格中的某一栏添加背景颜色 编写人:CC阿爸 2014-3-14 用鼠标选中某一个单元格然后右键单击 下拉菜单选择.<边框和低纹>然后点<低纹>选项卡 选中色卡 ...

  5. Java 连接MongoDB

    1.驱动 通过java连接MongoDB需要一个java版的驱动 下载地址:http://mongodb.github.io/mongo-java-driver/ 2.连接MongoDB 通过 com ...

  6. Head First-观察者模式

    什么是观察者模式?观察者模式定义了对象之间一对多的关系. 观察者模式中有主题(即可观察者)和观察者.主题用一个共同的接口来通知观察者,主题不知道观察者的细节,只知道观察者实现了主题的接口. 普遍的观察 ...

  7. delphi控件安装与删除

    附带通用控件安装方法:----------基本安装1.对于单个控件,Componet-->install component..-->PAS或DCU文件-->install;2.对于 ...

  8. 利用HttpWebRequest访问WebApi

    WebApi现在越来越流行,下面给出利用HttpWebRequest访问WebApi的工具方法: 1.利用基准URL和参数字典生成完整URL /// <summary> /// 生成URL ...

  9. python时间-time模块

    time是python自带的模块,用于处理时间问题,提供了一系列的操作时间的函数. 以下说明针对于 python2.7,其他版本可能有所差异. 模块提供了两个种表示时间的格式: 1.时间戳,是以秒表示 ...

  10. Python脚本控制的WebDriver 常用操作 <一> 启动浏览器

    由于本人的学习定位是基于Selenium+WebDriver+Python+FireFox+Eclipse+Pydev, 所以我的笔记也只和这方面相关. 我打算先学习基于Python脚本WebDriv ...