8.8 JQuery框架
2.1 JQuery框架
一、JQuery是一个javascript的框架,是对javascript的一种封装。
通过JQuery可以非常方便的操作html的元素\要使用Jquery需要导入一个第三方的javascript库 jquery.min.js,
与javascript通过id获取元素节点的方式(document.getElementById )不同
需要注意的是,通过 document.getElementById 获取到的是 DOM里的 元素节点
JQuery通过$("#id") 获取到的是一个 JQuery 对象
<script src="http://how2j.cn/study/jquery.min.js"></script>
<script>
//$(...);JQuery代码都是文档加载好之后的。
$(function(){
//通过$("#b1") 获取到的是一个 JQuery 对象
$("#b1").click(function(){
//通过$("#d")拿到div对象后,直接调用hide()和show()方法,即可实现隐藏和显示。
$("#d").hide();
});
$("#b2").click(function(){
$("#d").show();
});
}); </script>
<button id="b1">隐藏div</button>
<button id="b2">显示div</button> <br>
<br>
<div id="d"> 这是一个div
</div>
JQuery 不需要在html元素上进行操作
这样的好处是,html只需要显示内容,特别是业务复杂起来之后维护js代码会更加容易。
二、常见方法
2.1 通过JQuery对象的val()方法获取值 、相当于 document.getElementById("input1").value;
2.2 通过html() 获取元素内容,如果有子元素,保留标签
2.3 通过text() 获取元素内容,如果有子元素,不包含标签
三、
8.8 JQuery框架的更多相关文章
- 小谈Jquery框架
现在Jquery框架对于开发人员基本上是无人不知,无人不晓了,用起来十分的方便,特别是选择器十分强大,提高了我们的开发速度.但是好多人也只是停留在了会用的基础上,我个人觉得会用一个框架不算什么,只能说 ...
- jQuery框架分析第一章: 第一个匿名函数
我的jQuery版本为1.7* 这个版本代码比之前的版本优化了很多,结构也清晰了不少,就用最新的吧. 打开jQuery源代码 首先你能看到所有代码被一个 (function(window,undefi ...
- jQuery框架的简单使用(H5)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 浅析jQuery框架与构造对象
这是一些分析jQuery框架的文字 面向的读者应具备以下要求 1.非常熟悉HTML 2.非常熟悉javascript语法知识 3.熟悉javascript面向对象方面的知识 4.熟练使用jQue ...
- 引用jquery框架后出错
问题描述:当引用了jquery框架后,页面的js不能正常工作. 后面我的解决办法:是因为在引用 jquery的框架时的代码为 <script type="text/javascript ...
- Jquery框架
现在Jquery框架对于开发人员基本上是无人不知,无人不晓了,用起来十分的方便,特别是选择器十分强大,提高了我们的开发速度.但是好多人也只是停留在了会用的基础上,我个人觉得会用一个框架不算什么,只能说 ...
- jQuery框架-2.jQuery操作DOM节点与jQuery.ajax方法
一.jQuery操作DOM 内部插入操作: append(content|fn):向每个匹配的元素内部追加内容. prepend(content):向每个匹配的元素内部前置内容. 外部插入操作: af ...
- jQuery系列 第四章 jQuery框架的选择器
第四章 jQuery框架的选择器 4.1 jQuery选择器说明 jQuery 最核心的组成部分就是选择器引擎.它完全继承了 CSS 的风格,可以对 DOM 元 素的标签名.属性名.状态等进行快速准确 ...
- jQuery系列 第八章 jQuery框架Ajax模块
第八章 jQuery框架Ajax模块 8.1 jQuery框架中的Ajax简介 Ajax技术的核心是XMLHTTPRequest对象,该对象是Ajax实现的关键,发送异步请求.接收服务器端的响应以及执 ...
- jQuery系列 第七章 jQuery框架DOM操作
第七章 jQuery框架的选择器 jQuery框架继承和优化了JavaScript访问DOM对象的特性,我们使用jQuery框架提供的api可以更加方便的操作DOM对象. 7.1 创建DOM节点 使用 ...
随机推荐
- HTTP协议探究(三):HTTPS
一 复习与目标 1 复习 代理:转发通信数据(一般协议不变,作为中间人,可对报文进行过滤修改) 网关:转发通信数据(协议改变,作为资源拥有者) 隧道:转发通信数据(协议不变,作为管道,不对报文进行过滤 ...
- spring——aop详细总结1
AOP(Aspect-Oriented Programming, 面向切面编程): 是一种新的方法论, 是对传统 OOP(Object-Oriented Programming, 面向对象编程) 的补 ...
- BFC渲染机制
BFC(block formatting context):块级格式化上下文(实际就是一个隔离罩) W3C CSS2.1 规范中的一个概念.它是页面中的一块渲染区域,并且有一套渲染规则,它决定了其子元 ...
- ASP.NET---如何使用web api创建web服务
1 首先创建asp.net web空项目,并且创建模拟数据,我在工程下面创建了一个Models文件夹,在文件夹Nodels下面创建类Product和Repository 具体如下: [Serializ ...
- PHP 手机短信发送验证码
点击链接加入群[php/web 学习课堂]:https://jq.qq.com/?_wv=1027&k=5645xiw 欢迎大家加入,一起讨论学习 本篇设计的知识点有点多,我会分类将,同学们可 ...
- elasticsearch 配置外网访问
进入 config/ elasticsearch.ym 修改:network.host: 127.0.0.1 或者内网Ip 添加:http.host: 0.0.0.0
- 【Git】五、远程仓库
前面4节将的都是本地的git操作,这节开始讲合并到本地分支后,如何与远程仓库做交互 -------------------------------- 提要 //生成本地ssh密钥 $ ssh-keyg ...
- Django ORM常用的字段和参数
ORM 常用字段 AutoField int自增列,必须填入参数 primary_key=True.当model中如果没有自增列,则自动会创建一个列名为id的列. IntegerField 一个整数类 ...
- 蓝牙RSSI转距离计算工具
RSSI是无线接收的信号强度指示,如WIFI.BLE.ZigBee.接收到的RSSI的强弱与发射点与接收点的距离有一定的关系,故可以依据RSSI进行粗略的定位计算,如苹果的iBeacon. 其中用到最 ...
- web开发:jquery高级
一.jq选择器 二.属性操作 三.jq轮播图 四.样式操作 五.jq动事件 六.jq动画 七.自定义动画 八.jq动画案例 一.jq选择器 - css3语法选择器 ```js$('css3选择器位') ...