
JavaScript
JavaScript 是 Web 的编程语言。HTML 页面都使用JavaScript。JavaScript 非常容易学。本栏目将教你学习从初级到高级JavaScript知识。
豆皮没有豆
好好生活慢慢相遇
展开
-
JS 、JQ设置网站基本信息(标题、关键字、描述)
JS代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>后台管理中心</title> <meta name="keywords" content="关原创 2021-08-25 11:50:08 · 418 阅读 · 0 评论 -
JavaScript 生成随机数
js 通过 Math(算数) 对象来实现随机数的生成。方法描述ceil(x)对数进行上舍入,即向上取整。floor(x)对 x 进行下舍入,即向下取整。round(x)四舍五入。random()返回 0 ~ 1 之间的随机数,包含 0 不包含 1。Math.random() 生成 [0,1) 的数,所以 Math.random()*5 生成 {0,5) 的数。通常期望得到整数,所以要对得到的结果处理一下。parseInt(),Math.floor()转载 2021-07-15 09:49:58 · 953 阅读 · 0 评论 -
JavaScript return;return true;return false 的区别
return 语句会终止函数的执行并返回函数的值。返回函数的值就是 return 变量在表单提交过程中如果函数返回 false 表单就不提交了return ; return false ; return true 都会在函数内部阻止程序的执行。只有 return false 会阻止表单的提交。...原创 2021-05-18 17:33:36 · 148 阅读 · 0 评论 -
JavaScript/jQuery当元素的class类名发生改变时执行的操作,通过MutationObserver监听
概述MutationObserver 是现代浏览器提供的用来检测 DOM 变化的网页接口。你可以使用这个接口来监听新增或者删除节点,属性更改,或者文本节点的内容更改。你可以在以下几种情况信手拈来 MutationObserver 接口。比如: 通知用户当前所在的页面所发生的一些变化。 通过使用一些很棒的 JavaScript 框架来根据 DOM 的变化来动态加载JavaScript 模块。 可能当你在开发一个所见即所得编辑器的时候,使用 MutationObserver 接口来收集任意时间点原创 2020-09-10 17:30:41 · 5320 阅读 · 0 评论 -
JavaScript 实现的网格图片相册
style.css:@charset "utf-8";/*公共样式*/body,html,div,p{ margin: 0;padding: 0; box-sizing: border-box;}div,button{ display: block;}.head,.body{ position: absolute;}a{ display: inline-block; text-decoration: none;}button{ outline: none;}/*细转载 2020-08-31 17:27:39 · 566 阅读 · 0 评论 -
JavaScript 满屏爱心和认识天数计时效果
style.css:*{ margin: 0; padding:0;}html,body{ width:100%; height:100%; /*text-align: center;*/ background-color: #ffc5b3; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform转载 2020-08-31 16:08:04 · 609 阅读 · 0 评论 -
js+css3 3D倾斜图片列表布局点击放大切换特效
style.css代码:body,p{ margin: 0;}ul{ margin: 0; padding: 0; list-style: none;}img{ border: none; vertical-align: middle;}body{ background: #000000; color: #fff; overflow-x: hidden; /* 旋转后会出现横向的滚动条 */}/*works*/#wrap{margin-top: 150p转载 2020-08-26 10:04:50 · 481 阅读 · 0 评论 -
JavaScript 打字游戏
style.css代码:#game { position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: url("../img/bg.jpg") center /cover;}.board { position: absolute; width: 300px; height: 360px; background: url("../img转载 2020-08-26 10:05:02 · 865 阅读 · 4 评论 -
JavaScript 统计文本框剩余多少字符可输入
1.一个英文字母符号等代表一个字符,汉子代表两个字符代码如下限制为200个字符:<!DOCTYPE html><html><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><head runat="server"> <title></title> <script type="text/javascript"> va原创 2020-07-24 17:55:40 · 197 阅读 · 0 评论 -
JavaScript Window parent 属性
有这样的一个后台系统,用户登录成功通过session记录用户名或ID,session超时时,需要重新登录跳转到登录页面,系统采用的iframe框架,跳转页面时总是把登录页面跳转到嵌套进去了,解决时想到了parent属性,这样就从iframe中出来了:if (Session["MemberID"] == null){ Response.Write("<script>alert('已超时,请先登录!');window.parent.location.href='login.aspx';原创 2020-05-22 16:07:20 · 561 阅读 · 0 评论 -
JavaScript 返回上一页和刷新页面
1.window.location.reload();刷新当前页2.window.history.go(-1);返回上一页3.window.history.back();返回上一页window.history.back();后退后返回的不只是前一个页而是前一个页的状态。如果一个页我修改了3次那必须后退3次才能回到前一个页。而且数据库中删除的数据依然显示在上面感觉非常的不实用。解决办法:hi...转载 2020-04-02 09:58:28 · 1122 阅读 · 0 评论 -
JavaScript正则匹配出所有图片及所有图片地址src
<script type="text/javascript">//思路分两步.//1,匹配出图片img标签(即匹配出所有图片),过滤其他不需要的字符//2.从匹配出来的结果(img标签中)循环匹配出图片地址(即src属性)var str = "this is test string <img src=\"http:yanue.net/test.jpg\" width='...转载 2019-10-22 09:33:24 · 1545 阅读 · 0 评论 -
JavaScript 判断字符串中是否包含某个字符串(五种方法)
String对象的方法方法一:indexOf() (推荐)var str ="123";console.log(str.indexof("3")!=-1);//trueindexof()方法可返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串值没有出现,则该方法返回-1。方法二:search()var str="123";console.log(str.sear...原创 2019-08-26 16:42:59 · 4505 阅读 · 0 评论 -
JavaScript 跳转页面与打开新窗口的方法
超链接<a href="http://www.jb51.net" title="脚本之家">Welcome</a>等效于js代码window.location.href=“http://www.jb51.net”; //在同当前窗口中打开窗口超链接<a href="http://www.jb51.net" title="脚本之家" target="_b...转载 2019-08-26 15:52:40 · 757 阅读 · 0 评论 -
JavaScript 如何准确获取当前页面url网址信息
JavaScript如何准确获取当前页面url网址信息在WEB开发中,时常会用到javascript来获取当前页面的url网址信息,在这里是我的一些获取url信息的小总结。下面我们举例一个URL,然后获得它的各个组成部分:http://i.cnblogs.com/EditPosts.aspx?opt=1window.location.href(设置或获取整个 URL 为字符串)var...转载 2019-08-26 15:22:26 · 244 阅读 · 0 评论 -
JavaScript教程(十六)JavaScript中的DoM操作
1. 什么是 DOM?DOM是W3C(万维网联盟)的标准.DOM 定义了访问 HTML 和 XML 文档的标准:“W3C文档对象模型(DOM)是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容\结构和样式.”W3C DOM标准被分为3个不同的部分:(1)核心 DOM - 针对任何结构化文档的标准模型(2)XML DOM - 针对 XML 文档的标准模型(3)HTML...原创 2018-12-16 15:41:14 · 162 阅读 · 0 评论 -
JavaScript教程(十五)JavaScript面向对象编程
一.JavaScript 面向对象编程1.什么是面向对象编程面向对象是一种解决问题的思路,一种编程思想.2.面向过程和面向对象的对比在这里给大家举个洗衣服的例子面向过程的思维方式:step 1:收拾脏衣服step 2:打开洗衣机盖step 3:将脏衣服放进去step 4:设定洗衣程序step 5:开始洗衣服step 6:打开洗衣机盖子step 7:晒衣服而面向对象的思维方...原创 2018-12-14 15:57:54 · 193 阅读 · 0 评论 -
JavaScript教程(二)JavaScript中的自增自减运算符和流程语句
一.自增自减运算符1.自增运算符(一种算数运算符)a++:表示的是a=a+1,先赋值后运算++a:表示的是a=a+1,先运算后赋值eg:&lt;script type="text/javascript"&gt;var a=2; b=8; //a=3---------&gt;4var sum=a++ + b++ +...原创 2018-11-27 19:09:37 · 866 阅读 · 1 评论 -
JavaScript教程(三)JavaScript中的for循环及案例
1.语法结构:for(初始值;逻辑条件;增量/减量){循环体}例1:输出0~100之间的数,不包含0,100&amp;lt;script type=&quot;text/javascript&quot;&amp;gt;for(var i=1;i&amp;lt;100;i++){ document.write(i+'&amp;lt;br /&amp;gt;');}原创 2018-11-28 19:35:05 · 1671 阅读 · 0 评论 -
JavaScript教程(四)JavaScript中获取页面元素的方法
一.charAT():表示是把字符串中的每一个字母按照字符转换输出.例:&amp;lt;script type=&quot;text/javascript&quot;&amp;gt; var str='i love javascript'; for(var i=0;i&amp;lt;str.length;i++){// alert(str.length);//输出值为17,获取数组的长度// alert原创 2018-12-02 11:06:14 · 1294 阅读 · 0 评论 -
JavaScript教程(五)JavaScript中数组及数组的方法
一.数组及数组的方法1.数组的概念:是值数据的集合,在JavaScript中数组中的数据类型可以是不同的.2.数组的声明:(1)var 数组的名称=new Array();(2)var 数组的名称=[];3.数组的初始化(1)var 数组的名称=new Array(‘值1’,值2,‘值3’,…)//js 是一种弱类型的脚本语言索引可以存储不同的数据类型.(2)var 数组的名称=[...原创 2018-12-02 12:13:47 · 839 阅读 · 0 评论 -
JavaScript教程(六)JavaScript中冒泡排序
var arr=[23,1,2,0,11];第一轮比较(0): 比较了4次(arr.length-i-1)1,23,2,0,11;1,2,23,0,11;1,2,0,23,11;1,2,0,11,23;第二轮比较(1) 比较了3次(arr.length-i-1)1,2,0,11,23;1,0,2,11,23;1,0,2,11,23;第三轮比较(2) 比较了2次(ar...原创 2018-12-03 15:56:37 · 174 阅读 · 0 评论 -
JavaScript教程(七)javascript中字符串(String)对象及处理字符串的方法
字符串的属性 length 的介绍:在JavaScript 中,对于字符串来说,要掌握的属性就只有一个,那就是 length 属性.我们可以通过 length属性来获取字符串的长度.语法:字符串名称.length说明:length 属性很简单,但是在字符串操作中经常要用到,这个大家一定 要记住.&lt;script type="text/javascript"&gt; //lengt...原创 2018-12-03 17:53:04 · 278 阅读 · 0 评论 -
JavaScript教程(八)javascript中函数(function)
1.概念:重复执行的代码块或者说函数是事件驱动的重复执行的代码块.2.函数的定义:语法结构:function 函数名称遵循命名规则(){函数体}例:&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt;原创 2018-12-04 19:26:19 · 600 阅读 · 0 评论 -
JavaScript教程(九)javascript中的事件介绍以及兼容性①[鼠标事件,键盘事件,event,目标事件,表单事件]
一.事件类型1.事件的定义:指的是文档或者浏览器窗口中发生的一些特定交互瞬间.我们可以通过侦听器(或者处理程序)来预定事件,以便事件发生的时候执行相应的代码.(说白了,一段程序需要接受了一个指令才会去完成)2.事件类型:事件的类型是用来说明发生什么类型事件的字符串.eg:鼠标事件,键盘事件,点击事件…3.事件的目标:事件是要添加给那个对象,常用的事件目标有window,按钮,文本域,Docu...原创 2018-12-07 17:27:22 · 289 阅读 · 0 评论 -
JavaScript教程(十)JavaScript中的事件流②(事件捕获/冒泡)
一.事件流1.事件流的介绍:事件流描述的是从页面中接收事件的顺序.事件流是描述的从页面接受事件的顺序,当几个都具有事件的元素层叠在一起的时候,那么你点击其中一个元素,并不是只有当前被点击的元素会触发事件,而层叠在你点击范围的所有元素都会触发事件.2.事件流包括两种模式:冒泡和捕获.(1)事件冒泡:是值子元素和父元素具备同样的事件,当触发子元素的事件时,也会触发父元素的事件(由内至外).子...原创 2018-12-12 18:51:35 · 190 阅读 · 0 评论 -
JavaScript教程(十一)JavaScript中事件的兼容③(事件的绑定addEventListener/移除removeEventListener,阻止冒泡/默认)
一.事件兼容1.事件绑定:addEventListener 用于注册事件处理程序(为文档节点).IE 中为 attachEvent,我们为 什么讲addEventListener而不讲attachEvent呢?一来attachEvent比较简单,二来addEventListener才是 DOM 中的标准内容.语法:第一个参数是事件的类型(如 “click” 或 “mousedown”).第...原创 2018-12-13 17:45:27 · 841 阅读 · 0 评论 -
JavaScript教程(十二)JavaScript中函数闭包的应用
1. 事件闭包的理解:闭包是指有权限访问另一个函数作用域中的变量的函数.在 javascript 语言中,闭包就是函数和该函数作用域的组合.在JavaScript中任何一个函数都是一个闭包,但是嵌套的函数功能更强(闭包的作用更加强大,产生一个作用域链)2.变量的作用域:要理解闭包,首先必须理解 Javascript 特殊的变量作用域.变量的作用域无非就是两种:全局变量和局部变量.Javascr...原创 2018-12-13 18:11:43 · 175 阅读 · 1 评论 -
JavaScript教程(十三)JavaScript的定时器setInterval()与setTimeout()
js定时器有以下两种方法:(1).SetInterval():按照指定的周期(以毫秒计)来调用函数或计算表达式,方法会不停的调用函数,直到clearInterval()被调用或者窗口被关闭.(2) SetTimeout():在指定的毫秒数后调用函数或计算表达式.1.setInterval();循环定时器:固定时间间隔指定一次,像闹钟 一样,不关闭继续执行.语法结构:eg:每三秒弹出一...原创 2018-12-13 18:59:36 · 444 阅读 · 0 评论 -
JavaScript教程(十四)JavaScript的内置对象
1.内置函数 eval()和 isNaN()原创 2018-12-14 14:45:51 · 332 阅读 · 0 评论 -
JavaScript教程(一)JAVAscript的简单介绍/嵌入页面的方式/变量定义/数据类型及转换
一.JavaScript的简单介绍1.JavaScript是一种基于对象和事件驱动的客户端脚本语言,提供用户和界面的交互方式.2.JavaScript的编辑工具:&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;常见的JavaScript编辑工具有很多,例如记事本、 Hbuilder、Dreamweaver和Visual Studio,还有Sublime Text、 Notepad++等。3...原创 2018-11-26 22:22:12 · 259 阅读 · 0 评论