首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

前端学习笔记—JavaScript和jQuery

JavaScript分为函数对象和普通对象 ,每个对象都有proto属性,但是只有函数对象才有prototype属性,prototype属性就是函数的原型对象。...并不是所有的环境都支持proto作为一个可访问的属性,因此最好使用Object.getPrototypeOf()和Object.setPrototypeOf()方法来获取和设置原型链接。...使用 1、简介: jQuery是一个javaScript封装框架是一个函数库,能够简化原生JavaScript的使用。...同样还有其他同类型优秀的框架,如Vue和React等。jQuery与其他框架思想结构有所不同,但是现在更加流行的是Vue和React。...bootcdn远程cdn资源 1.使用jQuery核心函数:$/jQuery 2.使用jQuery核心对象:执行$()返回的对象 DOM 对象加载完毕后,马上执行的函数。

18510
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JavaScript、Jquery获取屏幕的宽度和高度

    在日常的项目中经常需要获取屏幕的宽度或者高度,简单记录一下: Javascript方法获取: document.body.clientWidth //网页可见区域宽 document.body.clientHeight... //网页可见区域高 document.body.offsetWidth //网页可见区域宽(包括边线的宽) document.body.offsetHeight //网页可见区域高(包括边线的高) document.body.scrollWidth... //网页被卷去的左 window.screenTop //网页正文部分上 window.screenLeft //网页正文部分左 window.screen.height //屏幕分辨率的高 window.screen.width... //屏幕分辨率的宽 window.screen.availHeight //屏幕可用工作区高度 window.screen.availWidth //屏幕可用工作区宽度 JQuery方法获取: ($(...;//浏览器当前窗口文档body的高度 ($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin

    5.3K00

    Javascript 的逻辑运算符的使用技巧和其内在逻辑

    运算符 与类型强制转换 通常,我们可以在if(condition) 的condiction直接使用Object、String、Number、null、undefined值或者变量,Javascript...我们可以使用 非运算符! 让表达是转换成对应的boolean值的相反值。如下所示: var s="abc"; var flag = !...s中的!!这两个非运算符,它们起到的作用有很大的不同哦,最右边的 !运算符,首先是Javascript首先对s进行了强制类型转换,然后再进行非操作,左边的!非操作符则是简单的非运算。...如果大家有阅读过Javascript框架如prototype或者jquery的经历,对于代码中的 两个!形式的运算符!! 就不足为奇了。 !!...obj; console.log(flag9);//~output: true   3. && 和|| 运算符  短路与 &&运算符  Javascript 的双目运算符&& 和|| 分别完成

    65630

    JavaScript运算符和控制语句

    一 运算符 1.基本概念     表达式:由常量/变量和运算符组成的短语     操作数:表达式中的常量和变量成为操作数     单目运算符:只能带一个操作数的成为单目运算符     多目运算符:带多个操作数的成为多目运算符...加减乘除:+ - * / 取模运算符:% 正负运算符:+ - 递增递减运算符:++ --:使数字递增/递减1(注意前置和后置的区别) 若没有赋值前置和后置,相同。...若有赋值:前置则先计算递增/减后赋值,后置则相反 5 比较运算符 比较运算符返回的是一个布尔值 相等运算符 == :不同的数据类型会自动转换为相等的数据类型再做比较 等同运算符=== :全等(值和类型)...not(非)       7 条件运算符 根据条件在两个语句中执行其中的一个,使用符号 ?:语法如下:  条件表达式?...//简单的例子,感受一下 javascript"> var a=5; var b=4; if(a>b){ alert("a是最棒的")

    60820

    JavaScript中!!、||、?.、??运算符的区别和用法

    JavaScript 中有四个常用的运算符,分别是 !!、||、?.、??,它们都可以用于处理值的真假性和空值情况,但它们的行为和逻辑有所不同。...本文将介绍这四个运算符的定义、功能和示例,帮助你理解和掌握它们的用法。 !! 用法 !! ...和 ?? 的区别 ?. 是可选链运算符,用于访问一个可能为空或者未定义的对象的属性,如果对象为空或者未定义,它会返回 undefined,而不会抛出错误。...和 || 的用法取决于你想要实现的逻辑。一般来说,如果你只想排除 null 或者 undefined,那么使用 ?? 比较好;如果你想排除所有假值,那么使用 || 比较好。...运算符的区别和用法

    3.1K20

    使用AmplifyJS和JQuery编写更好更优雅的javascript事件处理代码

    事件(或消息)是一种经常使用的软件设计模式。可以减少消息处理者和消息公布者的之间的耦合,比方J2EE里面的JMS规范。设计模式中的观察者模式(也叫公布/订阅模式)。...这对于javascript代码相同适用。之前写的JQuery相关博客中。具体介绍了JQuery的事件处理机制和特性,具体可以參考这个文件夹下的文章。...JQuery事件处理事实上就是使用了公布/订阅模式,包含它提供的命名空间机制、自己定义事件都非常的棒,可是JQuery事件处理有一个缺陷:JQuery事件都是和DOM元素相关的,可是非常多时候我们并不须要...仅仅希望使用事件的公布/订阅这样的机制。 代码1:假设某个DOM元素不存在。那么不能依靠它使用事件的公布和订阅。...,通过AmplifyJS的使用方式能够看到。

    66830

    JavaScript 学习-17.扩展运算符(...)的使用

    前言 JavaScript ES6新增了扩展运算符的语法,扩展运算符(spread)是三个点(…)。 该运算符主要用于,将一个数组转为用逗号分隔的参数序列, 通常用于函数的调用传参。...let keys = [...m.keys()] console.log(keys); // ['user', 1, 2] 函数 rest 参数 如果你能弄清楚python函数参数 里面的 *args 和...**kwargs ,那么*args 就相当于 JavaScript里面的 rest 参数 ...args。...先看一段python的代码关于*arg参数的使用 def func(a, *args): print(a) print(args) func(1, 2, 3, 4) # a 得到 1...(args); // [2, 3, 4] } arr = [2, 3, 4]; func(1, ...arr); 使用 rest 参数的时候需要注意顺序,一定要放到函数的最后一个参数位置 字符串转数字

    57230

    JavaScript 比较 和 逻辑运算符

    比较和逻辑运算符用于测试 true 或者 false。 比较运算符 比较运算符在逻辑语句中使用,以测定变量或值是否相等。...x=5,下面的表格解释了比较运算符: 1.png 如何使用 可以在条件语句中使用比较运算符对值进行比较,然后根据结果来采取行动: if (age<18) x="Too young"; 您将在本教程的下一节中学习更多有关条件语句的知识...逻辑运算符 逻辑运算符用于测定变量或值之间的逻辑。 给定 x=6 以及 y=3,下表解释了逻辑运算符: 2.png JavaScript 还包含了基于某些条件对变量进行赋值的条件运算符。...value1:value2 如果变量 age 中的值小于 18,则向变量 voteable 赋值 "年龄太小",否则赋值 "年龄已达到"。 voteable=(age<18)?"

    33520

    JavaScript与jQuery获取元素的宽、高和位置

    今天汇总整理了 JavaScript 和 jQuery 获取元素宽高和位置的方法,比较全面,方便自己和需要并搜到此文章的朋友们查看。...var div = document.getElementById("myDiv");     console.log(div.getBoundingClientRect()); JavaScript...:元素的高度(包括边框和内边距,不包括外边距) offsetWidth :元素的宽度(包括边框和内边距,不包括外边距) 偏移值 offsetLeft :元素的相对水平偏移位置(左边界距离可视区域最左侧的距离...:是该元素的显示(可见)的内容与该元素实际的内容的距离(滚动条滚去的高度) jQuery中: ?...即:当网页滚动条拉到最低端时: $(document).height() == $(window).height() + $(window).scrollTop() 注意:不建议使用 $("html")

    3.1K00

    JavaScript运算符以及JavaScript存在的问题

    JavaScript运算符以及JavaScript存在的问题 运算符 描述 + 用于数值类型的时候,是加法;用于字符串和其它数据类型(包括字符串)的时候,将字符串和其它数据类型连接起来 - 减法 * 乘法.../ 真除法 % 取余 ++ 自增,前置++或者后置++ – 自减,前置–或者后置– = 赋值运算符 == 等于 === 绝对等于(值和类型均相等) !...: 条件表达式 可以将+,-,*,/和=结合起来使用,形成复合赋值运算符。例如: a+=1,n-=m;它们的含义是a = a + 1和n = n - m....JavaScript是前端的必需品,它是浏览器中运行的唯一语言。每一位前端开发者都需要使用它。但是JavaScript存在上面的问题,现在的方法是进行转译。...转译就是采用另外一种语言编写代码,然后将其转换为JavaScript。但是这样,你还是无法避免使用JavaScript。 目前看来,TypeScript是取代JavaScript的一个更好的选择。

    50630

    JavaScript强化教程——jQuery - 获得内容和属性

    本文作者:IMWeb 王军 原文出处:IMWeb社区 未经同意,禁止转载 本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 —— jQuery - 获得内容和属性...jQuery 拥有可操作 HTML 元素和属性的强大方法。...jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力。 jQuery 提供一系列与 DOM 相关的方法,这使访问和操作元素和属性变得很容易。...提示:DOM = Document Object Model(文档对象模型) DOM 定义访问 HTML 和 XML 文档的标准: “W3C 文档对象模型独立于平台和语言的界面,允许程序和脚本动态访问和更新文档的内容...(包括 HTML 标记) val() - 设置或返回表单字段的值 下面的例子演示如何通过 jQuery text() 和 html() 方法来获得内容: 实例$("#btn1").click(function

    70920

    JavaScript强化教程——jQuery - 获得内容和属性

    本文作者:IMWeb 王军 原文出处:IMWeb社区 未经同意,禁止转载 本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 —— jQuery - 获得内容和属性...jQuery 拥有可操作 HTML 元素和属性的强大方法。...jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力。 jQuery 提供一系列与 DOM 相关的方法,这使访问和操作元素和属性变得很容易。...提示:DOM = Document Object Model(文档对象模型) DOM 定义访问 HTML 和 XML 文档的标准: “W3C 文档对象模型独立于平台和语言的界面,允许程序和脚本动态访问和更新文档的内容...(包括 HTML 标记) val() - 设置或返回表单字段的值 下面的例子演示如何通过 jQuery text() 和 html() 方法来获得内容: 实例$("#btn1").click(function

    96150
    领券