测开之路四十:jQuery基本用法
从cdn引入jQuery库:https://www.bootcdn.cn/,搜索jQuery

在html里面(使用之前计算器的脚本),把复制的标签粘贴到引入js标签的前面:<script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js"></script>

在js里面使用jQuery:在js里面使用的时候固定格式,$(),类似于python里面的if __name__ == '__main__'

$(function () {
console.log('这是jQuery的打印')
});

访问

jquery-语法
$(this).hide:演示 jQuery hide() 函数,隐藏当前的 HTML 元素。
$("#test").hide():演示jQuery hide() 函数,隐藏 id="test" 的元素。
$("p").hide():演示 jQuery hide() 函数,隐藏所有 <p> 元素。
$(".test").hide():演示 jQuery hide() 函数,隐藏所有 class="test" 的元素。
html():取得第一个匹配元素的html内容
html(val):设置每一个匹配元素的html内容
text():取得所有匹配元素的内容。
text(val):设置所有匹配元素的文本内容
val():获得第一个匹配元素的当前值
val(val):设置每一个匹配元素的值
html里面的input标签

在js里面,给input标签绑定click事件

请求,并点击

把点击的值赋给点击的时候显示
把顶部改为输入框,并设置一个id属性

js里面进行点击的时候赋值

//定义一个获取当前被点击的元素的值的函数
function click_calulator(){
console.log($(this).val()) //输出当前被点击的元素的值,$(this)指当前对象
$('#display').val($(this).val()) //把当前点击获取到的值赋给id为display的元素
} $(function () {
//采用表亲选择器选中所有input标签,对其增加点击事件
//click的参数是一个函数,处理点击行为
$('input').click(click_calulator)
});
访问,并点击

测开之路四十:jQuery基本用法的更多相关文章
- 测开之路四十二:常用的jquery事件
$(‘selector’).click() 触发点击事件$(‘selector’).click(function) 添加点击事件$(‘selector’).dbclick() 触发双击事件$(‘sel ...
- 测开之路四十八:Django之重定向与cookie
基础配置与上一篇一致 404错误 定义一个error页面 <!DOCTYPE html><html lang="en"><head> <m ...
- 测开之路四十九:用Django实现扑克牌游戏
用Django实现和之前flask一样的扑克牌游戏 项目结构 html <!DOCTYPE html><html lang="en"><head> ...
- 测开之路四十五:Django之最小程序
安装Django库 Django最小程序 import sysfrom django.conf.urls import urlfrom django.conf import settingsfrom ...
- 测开之路四十一:常用的jquery函数
jQuery选择器菜鸟教程:https://www.runoob.com/jquery/jquery-selectors.html 引用jquery2.1.1标签:<script src=&qu ...
- 测开之路七十四:python处理kafka
kafka-python地址:https://github.com/dpkp/kafka-python 安装kafka-python:pip install kafka-python 接收消息 fro ...
- 测开之路六十四:UI测试平台之前端页面
{% extends "base.html" %} {% block script %} <!-- 引入js文件,需要在base.html留入口,不然渲染会出问题. --&g ...
- 测开之路三十四:html常用标签
网页的结构: HTML:超文本标记语言是迄今为止网络上应用最为广泛的语言,也是构成网页文档的主要语言.HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字.图形.动画.声音.表格.链 ...
- 测开之路一百:jquery引用、语法、事件
工作中一般会使用jquery代替js,jquery官网:https://jquery.com/ 引用jquery: 第一种方式:下载引用: jquery下载官网:https://jquery.com/ ...
随机推荐
- tensorflow学习框架(炼数成金网络版学习记录)
chapter1 #变量 import tensorflow as tf x = tf.Variable([1,2]) a = tf.constant([3,3]) #增加一个减法op sub = t ...
- phpcms批量更新内容页只更新一点就返回问题
phpcms批量更新内容页只更新一点就返回问题 给caches目录增加写入权限
- python之从文件中按行读取数据
#!/usr/bin/env python3 # -*- coding: utf-8 -*- __author__ = 'jiangwenwen' # 从文件中按行读取数据 file = open(& ...
- Redis进行数据同步
数据库中的数据一般都涉及到需要对数据进行备份的,这样可以保证数据的安全性,并且如果将一个主设备的数据同步到多个从设备上,允许用户访问数据时可以从多个从设备进行读取, 这样还可以缓解主设备的压力,Red ...
- sql插入语句笔记
使用INSERT插入数据行 [一次插入一行数据] 全写: INSERT INTO renshi (name, sex, age ,tel) VALUES ('胡大姐','女','35','13 ...
- 基于Airtest实现python自动抢红包
一.Airtest的介绍 1)Airtest的简介 Airtest是网易出品的一款基于图像识别和poco控件识别的一款UI自动化测试工具. Airtest的框架是网易团队自己开发的一个图像识别框架,这 ...
- ubuntu16.04编译linux3.9内核
下载linux内核 解压内核 tar -xvf 安装低版本gcc,不然会报错 apt-cache search gcc-4.7 sudo apt-get install 搜索的名字 设置默认gccsu ...
- 2018-2-13-C#-复制列表
title author date CreateTime categories C# 复制列表 lindexi 2018-2-13 17:23:3 +0800 2018-2-13 17:23:3 +0 ...
- 工作中常用的linux命令大全
文章内容参考:https://www.cnblogs.com/yjd_hycf_space/p/7730690.html 谢谢大佬的分享 系统信息 date 显示系统日期 cal + 年份 显示 ...
- 转贴健康资讯:神奇的“XX水”,死了一茬又来一茬?
神奇的“XX水”,死了一茬又来一茬? 2014年7月20日 京虎子 http://www.scipark.net/archives/19816 最近看到两桩事,一是孕妇防辐射服,一是富氧水.这两桩事合 ...