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框架的更多相关文章

  1. 小谈Jquery框架

    现在Jquery框架对于开发人员基本上是无人不知,无人不晓了,用起来十分的方便,特别是选择器十分强大,提高了我们的开发速度.但是好多人也只是停留在了会用的基础上,我个人觉得会用一个框架不算什么,只能说 ...

  2. jQuery框架分析第一章: 第一个匿名函数

    我的jQuery版本为1.7* 这个版本代码比之前的版本优化了很多,结构也清晰了不少,就用最新的吧. 打开jQuery源代码 首先你能看到所有代码被一个 (function(window,undefi ...

  3. jQuery框架的简单使用(H5)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. 浅析jQuery框架与构造对象

    这是一些分析jQuery框架的文字    面向的读者应具备以下要求 1.非常熟悉HTML 2.非常熟悉javascript语法知识 3.熟悉javascript面向对象方面的知识 4.熟练使用jQue ...

  5. 引用jquery框架后出错

    问题描述:当引用了jquery框架后,页面的js不能正常工作. 后面我的解决办法:是因为在引用 jquery的框架时的代码为 <script type="text/javascript ...

  6. Jquery框架

    现在Jquery框架对于开发人员基本上是无人不知,无人不晓了,用起来十分的方便,特别是选择器十分强大,提高了我们的开发速度.但是好多人也只是停留在了会用的基础上,我个人觉得会用一个框架不算什么,只能说 ...

  7. jQuery框架-2.jQuery操作DOM节点与jQuery.ajax方法

    一.jQuery操作DOM 内部插入操作: append(content|fn):向每个匹配的元素内部追加内容. prepend(content):向每个匹配的元素内部前置内容. 外部插入操作: af ...

  8. jQuery系列 第四章 jQuery框架的选择器

    第四章 jQuery框架的选择器 4.1 jQuery选择器说明 jQuery 最核心的组成部分就是选择器引擎.它完全继承了 CSS 的风格,可以对 DOM 元 素的标签名.属性名.状态等进行快速准确 ...

  9. jQuery系列 第八章 jQuery框架Ajax模块

    第八章 jQuery框架Ajax模块 8.1 jQuery框架中的Ajax简介 Ajax技术的核心是XMLHTTPRequest对象,该对象是Ajax实现的关键,发送异步请求.接收服务器端的响应以及执 ...

  10. jQuery系列 第七章 jQuery框架DOM操作

    第七章 jQuery框架的选择器 jQuery框架继承和优化了JavaScript访问DOM对象的特性,我们使用jQuery框架提供的api可以更加方便的操作DOM对象. 7.1 创建DOM节点 使用 ...

随机推荐

  1. Springboot 使用pageHelper实现分页查询

    本文链接:https://blog.csdn.net/qq_35387940/article/details/91530234

  2. npm install 报错踩坑路

    先出现的是超过最大调用栈问题: npm ERR! Maximum call stack size exceeded 百度之后说给npm降级或者升级 降级 : npm install -g npm@5. ...

  3. 【小知识点】input输入框在安卓以及IOS手机中光标及字体不居中解决方法

    问题根本:不要使用line-height垂直居中. 解决方法:可直接定义height,然后高度由上下padding值撑开. input { height: 1rem; padding: 1rem 0; ...

  4. ORACLE和SQL查询库数据量

    ORACLE根据账号查询每张表数据量: select t.table_name,t.num_rows from user_tables t ORDER BY NUM_ROWS DESC; SQL SE ...

  5. error connection reset by peer 104

    connection reset by peer的常见原因 1.服务器的并发连接数超过了其承载量,服务器会将其中一些连接关闭:2. errno = 104错误表明你在对一个对端socket已经关闭的的 ...

  6. Educational Codeforces Round 37 G. List Of Integers (二分,容斥定律,数论)

    G. List Of Integers time limit per test 5 seconds memory limit per test 256 megabytes input standard ...

  7. OpenJudge POJ C19C 贪心

    https://cn.vjudge.net/contest/309482#problem/C #include<bits/stdc++.h> using namespace std; ty ...

  8. Python&Selenium智能等待方法封装

    摘要:本篇博文用几行代码展示Python和Selenium做自动化测试时常见的显示等待和封装 # 用于实现智能等待页面元素的出现 # encoding = utf-8 ""&quo ...

  9. python之global用法

    如果需要在函数内部改变函数外部的变量,就可以通过在函数内部声明变量为global变量.这样当程序运行至global变量便会替换外部的同名变量. 例1: # -*- coding:utf-8 -*- n ...

  10. CentOS7下tftp服务安装配置

    1.软件包安装 root用户或者普通用户使用sudo权限执行如下命令: yum install xinetd tftp tftp-server # root 用户执行 sudo yum install ...