jQuery(20161108)
jQuery的引入包必须要在其他引入包的最上方,否则会出错。因为如果在页面加载完成后还未执行jQuery包,那么jQuery的引入包就没用了
如果浏览器报错:Uncaught Error: Bootstrap's JavaScript requires jQuery_...
就要注意文件引入的先后顺序,应该先引入jquery再引入bootstrap
//js或jquer y里面有数据存储的方式
//名字叫JSON
/* var json = {
code:"n001",
name:"张三",
js:{c:"p001",n:"回族"}
};
//取值 用点或者是索引
alert(json["code"]);
alert(json.js.n);
*/
//去空格
/*var str = " hello ";
str = str.trim(); //重要 非空验证的时候可以用来去空格,还可以在ajax返回值的时候去空格
alert(str.length);
*/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--引入JQUERY包(要先引入jequery,再写js,否则有些功能无法实现,因为如果js在上面,加载完上面的js后并没有加载上jequery,有些功能就无法实现,,,,所以jequery要在所有的引入前面) min:压缩版-->
<script src="jquery-3.1.1.min.js"></script> <style type="text/css">
#a1{
color:red;
}
.aa{ width:100px; height:100px; background-color:#39F}
</style> <title>无标题文档</title>
</head> <body> <div id="a1" class="tt" style="width:100px; height:200px;">11</div> <div class="aa" bs="1">aaaa</div>
<div class="aa" bs="2">bbbbb</div>
<div class="aa" bs="3">ccccc</div> <div name="cc"></div>
<div bs="1"></div>
<input type="text" id="p1" />
<input type="button" id="b1" value="挂事件" />
<input type="button" id="b2" value="移除事件" />
<script type="text/javascript"> //JS
//根据ID取元素,取到的是具体的元素
//var a = document.getElementById("a1");
//根据CLASS取 (取到的是数组)
//var a = document.getElementsByClassName("aa");
//根据标签名取
//var a = document.getElementsByTagName("div");
//根据name取
//var a = document.getElementsByName("cc");
//alert(a); //操作元素
//操作内容
//非表单元素 只能通过ID找
//a.innerText = "hello"; 取值
//a.innerHTML = "<span style='color:red'>world</span>"; 赋值
//表单元素 赋值 取值
//a.value = "hello";
//操作属性
//a.setAttribute("bs","1");
//a.getAttribute("bs");
//a.removeAttribute("bs");
//操作样式 样式表里的样式和js里的样式不一样;js只能获取内联的
//a.style.color = red; //三个DIV隐藏
//找到后交给一个变量存起来
/*var a = document.getElementsByClassName("aa"); for(var i=0;i<a.length;i++)
{
a[i].style.display = "none";
}*/ //事件 在标签里面直接加 /**************************************************/ //Jquery
//根据ID找元素,取到的是JQUERY对象;$是选取元素的方法
//var b = $("#a1"); //根据CLASS取
//var b = $(".aa");
//alert(b.eq(0)); //取jquery对象用eq()取元素本身用[] //根据标签名取
//var b = $("div"); //根据属性筛选
//var b = $("[name=aa]"); //操作元素
//操作内容 取值不给参数,赋值给参数
//非表单元素
//b.text();
//b.html();
//表单元素
//b.val();
//操作属性
//b.attr("bs","1"); 设置属性
//b.attr("bs"); 获取属性
//b.removeAttr("bs"); 移除属性
//操作样式 jquery还可以获取内嵌的和外部的
//alert(b.css("color"));
//b.css("font-size","50px"); //alert(b[0]); //取jquery对象用eq()取元素本身用[] //隐藏三个元素
//$(".aa").css("display","none"); //Jquery【加】事件 先找元素,找到之后挂上事件; document:页面文档 匿名函数:function(e) {} 一般还是使用加 //页面加载完成之后执行的事件 "#a1" 代表事件源 e代表事件数据
$(document).ready(function(e) { /*//给a1加点击client
$("#a1").click(function(){
alert('aa');
})
//给class为aa的所有元素加事件
$(".aa").click(function(){
//alert($(this).attr("bs"));
$(".aa").css("background-color","#39F");
$(this).css("background-color","red");
})*/ //第二种方式【挂】事件 bind("要绑定的事件名",执行的方法) unbind("要移除的事件名")
$("#b1").click(function(){ $("#a1").bind("click",function(){ alert("我是挂上的事件"); }); })
$("#b2").click(function(){ $("#a1").unbind("click");
}) }); </script> </body>
</html>
1108testjs.php
jQuery(20161108)的更多相关文章
- 强大的JQuery(二)--动画效果
上篇博客我们讲过了jquery的基础知识--强大的JQuery(一)--基础篇,作为web开发人员,网页的动画效果是不可缺少的,本篇博客重点来说说jquery的动画效果的实现. 因为动画的效果不能截图 ...
- 从零开始,DIY一个jQuery(2)
在上篇文章我们简单实现了一个 jQuery 的基础结构,不过为了顺应潮流,这次咱把它改为模块化的写法,此举得以有效提升项目的可维护性,因此在后续也将以模块化形式进行持续开发. 模块化开发和编译需要用上 ...
- 从零开始,DIY一个jQuery(1)
从本篇开始会陪大家一起从零开始走一遍 jQuery 的奇妙旅途,在整个系列的实践中,我们会把 jQuery 的主要功能模块都了解和实现一遍. 这会是一段很长的历程,但也会很有意思 —— 作为前端领域的 ...
- 锋利的JQuery(五)
jQuery与Ajax: load: load(url) $("#resText").load("test.html") 加载所有元素 load(url ...
- 强大的JQuery(一)--基础篇
JQuery是一个优秀的Javascript框架,是轻量级的js库,使用jQuery将极大的提高编写javascript代码的效率,,让写出来的代码更加优雅,更加健壮. 学好了jquery,我们相当于 ...
- Python开发【第十三篇】:jQuery(二)
http://www.bubuko.com/infodetail-1438296.html 处理完毕需要整理贴进来 Python之路[第十三篇]jQuery案例-Form表单&插件及扩展 ...
- 从零开始学习jquery (二)
前面我们了解到了如何获取使用jquery,下面我们主要看看jquery的一些语法.基本的语法 $(selector).action(). 美元符号定义 jQuery 选择符(selector)&quo ...
- JQuery(上)
1.流行的JavaScript类库 -- 框架.插件 )为了简化 JavaScript 的开发, 一些 JavsScript 库诞生了. JavaScript 库封装了很多预定义的对象和实用函数 ...
- JQuery(下)
26.jQuery 中的 DOM 操作 )DOM(Document Object Model—文档对象模型):一种与浏览器, 平台, 语言无关的接口, 使用该接口可以轻松地访问页面中所有的标准组件 ) ...
随机推荐
- oracle求时间差的常用函数
oracle求时间差的常用函数 求时间差: 天: ROUND(TO_NUMBER(END_DATE - START_DATE)) 小时: ROUND(TO_NUMBER(END_D ...
- Java程序打开指定地址网页
1.今天遇到了需要手动输入http地址打开指定网页的需求,试着做一个用程序打开指定网页的功能,搜了一下,还真有一个现成的例子,稍加改造,实现自己的需求: 2.代码不多,两个文件:如下: package ...
- JSON在线解析,新版本JSON在线解析
SOJSON,出了新版本的JSON在线解析,真的很好用,可以上下版本.左右版本.效果图如下.它的网址是:http://www.sojson.com/simple_json.html SOJSON集成了 ...
- RxJava2出现:Unable to create call adapter for io.reactivex.Flowable
前面一直使用的是Rxjava 1.x 版本,最近 Rxjava 2.x 版本发布了,并且支持了背压,便换成了 Rxjava 2.x 版本.更换之后出现了下面的错误. Caused by: java.l ...
- Salesforce使用truncate清空数据库
如果想快速的清空MySQL中的表,可以使用Truncate命令.Truncate能够快速的,对数据进行无差别的清空. 在Mysql中使用truncate的语法是TRUNCATE TABLE [Tabl ...
- EF操作扩展之async
EF的操作类网上很多类,我只是把我在平时项目中的类进行一些改进和扩展,扩展了部分同步和异步的EF操作 接口 /// <summary> /// 接口数据操作基础类 /// </sum ...
- React-intl 实现多语言
前言 React 做国际化,我推荐使用 React-intl , 这个库提供了 React 组件和Api两种方式来格式化日期,数字和字符串等.知道这个库了,那让我们开始使用它 组件用法 为了和Reac ...
- 1.1XAF框架开发视频教程-简单的订单管理实现过程,视频,提纲,及教程源码
下面是视频教程的提纲: PPT版本的提纲下载 本节源码下载 XAF框架开发教程 快速实现企业级信息系统开发的利器 XAF简介 ´ 开发公司:www.devexpress.com,老牌控件公司 ´ ...
- Spring源码解析一:IOC容器设计
一.IOC接口设计 IOC容器设计的源码主要在spring-beans.jar.spring-context.jar这两个包中.IOC容器主要接口设计如下: 这里的接口设计有两条主线:BeanFact ...
- angular 2 animate 笔记
好久没有在这里写点笔记了.时隔已久,angular1 去 angular2 咯 笔记来源:https://angular.cn/docs/ts/latest/guide/animations.html ...