JavaScript封闭函数及常用内置对象示例


Posted in Javascript onMay 13, 2019

本文实例讲述了JavaScript封闭函数及常用内置对象。分享给大家供大家参考,具体如下:

封闭函数

在封闭函数内部定义的函数与外部函数尽管同名也没有关系,同理,定义的变量也可以同名。

封闭函数的写法,一是加括号,一是加感叹号。

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>封闭函数</title>
 <script type="text/javascript">
  var num = 22;
  function f() {
   alert("hello ");
  }
  (function () {
   var num = 11;
   function myalter() {
    alert("hello world");
   }
   alert(num);
   myalter()
  })();
  /*封闭函数的第二种写法,前面加一个感叹号或者加一个波浪线*/
  !function(){
   alert("ll");
  }();
  alert(num)
 </script>
</head>
<body>
<div>
 55
</div>
</body>
</html>

常用内置对象

1.document

document.getElemntsByTagName 通过标签名获取元素
document.getElementsById 通过id获取元素
document.referrer 获取上一个跳转页面的地址

2.location

window.location.href 获取或者重定向url地址
window.location.search 获取地址参数部分
window.location.hash 获取页面锚点或者叫hash值

<meta charset="UTF-8">
 <title>常用内置对象</title>
 <script type="text/javascript">
  /*
  * 1.document
  * document.getElemntsByTagName 通过标签名获取元素
  * document.getElementsById 通过id获取元素
  * document.referrer 获取上一个跳转页面的地址
  *
  * 2.location
  * window.location.href 获取或者重定向url地址
  * window.location.search 获取地址参数部分
  * window.location.hash 获取页面锚点或者叫hash值
  *
  * */
  window.onload = function () {
   var sUrl = document.referrer;
   /*获取服务器地址,或者说上一个页面地址*/
   var oBtn = document.getElementById("btn01");
   oBtn.onclick = function () {
    window.location.href = sUrl;
    /*但是因为不是服务器地址所以存不下来,这边可以直接写百度网址的字符串*/
   };
   var oBody = window.getElementById('body01');
   var sData = window.location.search;
   /*http://localhost:63342/Javascirpt/%E5%B8%B8%E7%94%A8%E5%86%85%E7%BD%AE%E5%AF%B9%E8%B1%A1.html?_ijt=1
   * 如上是访问页面的地址,在最后?问好后面的就是参数,在开放中可以根据不同的参数,使得页面表现形式不一样。
   * 比如现在参数是1
   * 我们得到body的属性,让他的背景颜色变成金色
   * */
   var aRr = sData.split("=");
   var iNum = aRr[1];
   if (iNum == 1) {
    oBody.style.backgroundColor = "gold";
   }
   // if(sData!=null)
   // {
   //  alert(sData);
   // }
   alert(sData);
   /*获取地址参数*/
  }
 </script>
</head>
<body id='body01'>
<input type="button" name="" value="跳转" id="btn01">
</body>
</html>

http://localhost:63342/Javascirpt/常用内置对象.html?_ijt=1

如上是访问页面的地址,在最后?问好后面的就是参数,在开放中可以根据不同的参数,使得页面表现形式不一样。

比如现在参数是1

我们得到body的属性,让他的背景颜色变成金色

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Document</title>
</head>
<body>
 <a href="常用内置对象.html" rel="external nofollow" >链接到常用内置对象的页面</a>
 <a href="常用内置对象.html?aa=1" rel="external nofollow" >链接到常用内置对象的页面1</a>
 <a href="常用内置对象.html?aa=2" rel="external nofollow" >链接到常用内置对象的页面2</a>
 <a href="常用内置对象.html?aa=3" rel="external nofollow" >链接到常用内置对象的页面3</a>
</body>
</html>

传递不同的参数改变页面的状态。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
菜单效果
Oct 14 Javascript
google地图的路线实现代码
Aug 20 Javascript
node.js中的url.parse方法使用说明
Dec 10 Javascript
基于jQuery实现点击列表加载更多效果
May 31 Javascript
利用JavaScript实现拖拽改变元素大小
Dec 14 Javascript
jQuery使用Layer弹出层插件闪退问题
Dec 22 Javascript
VueAwesomeSwiper在VUE中的使用以及遇到的一些问题
Jan 11 Javascript
详解html-webpack-plugin用法全解
Jan 22 Javascript
浅谈vue中改elementUI默认样式引发的static与assets的区别
Feb 03 Javascript
使用live-server快速搭建本地服务器+自动刷新的方法
Mar 09 Javascript
微信小程序BindTap快速连续点击目标页面跳转多次问题处理
Apr 08 Javascript
vue-cli3.x配置全局的scss的时候报错问题及解决
Apr 30 Vue.js
vue 表单之通过v-model绑定单选按钮radio
May 13 #Javascript
JS中的函数与对象的创建方式
May 12 #Javascript
详解无限滚动插件vue-infinite-scroll源码解析
May 12 #Javascript
ES6中的迭代器、Generator函数及Generator函数的异步操作方法
May 12 #Javascript
浅谈vue.use()方法从源码到使用
May 12 #Javascript
Vue安装浏览器开发工具的步骤详解
May 12 #Javascript
微信小程序缓存过期时间的使用详情
May 12 #Javascript
You might like
php获取当前页面完整URL地址
2015/12/30 PHP
php通过smtp邮件验证登陆的方法
2016/05/11 PHP
php中引用&amp;的用法分析【变量引用,函数引用,对象引用】
2016/12/12 PHP
PHP基于socket实现客户端和服务端通讯功能
2017/07/13 PHP
Laravel中使用Queue的最基本操作教程
2017/12/27 PHP
Prototype Function对象 学习
2009/07/12 Javascript
jQuery操作select的实例代码
2012/06/14 Javascript
javascript移动设备Web开发中对touch事件的封装实例
2014/06/05 Javascript
js获取input长度并根据页面宽度设置其大小及居中对齐
2014/08/22 Javascript
再分享70+免费的jquery 图片滑块效果插件和教程
2014/12/15 Javascript
JavaScript获取网页中第一个链接ID的方法
2015/04/03 Javascript
JQuery记住用户名密码实现下次自动登录功能
2015/04/27 Javascript
Linux下为Node.js程序配置MySQL或Oracle数据库的方法
2016/03/19 Javascript
JS实现左右无缝轮播图代码
2016/05/01 Javascript
值得分享和收藏的Bootstrap学习教程
2016/05/12 Javascript
jqueryMobile 动态添加元素,展示刷新视图的实现方法
2016/05/28 Javascript
jQuery Mobile漏洞会有跨站脚本攻击风险
2017/02/12 Javascript
angular.js指令中transclude选项及ng-transclude指令详解
2017/05/24 Javascript
jQuery实现节点的追加、替换、删除、复制功能示例
2017/07/11 jQuery
一个有意思的鼠标点击文字特效jquery代码
2017/09/23 jQuery
jQuery基于闭包实现的显示与隐藏div功能示例
2018/06/09 jQuery
[03:37]2015国际邀请赛第四日现场精彩集锦
2015/08/08 DOTA
[01:03:42]VP vs VGJ.S 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
用Python实现KNN分类算法
2017/12/22 Python
Python反射和内置方法重写操作详解
2018/08/27 Python
python 将列表中的字符串连接成一个长路径的方法
2018/10/23 Python
python 实现生成均匀分布的点
2019/12/05 Python
pytorch-神经网络拟合曲线实例
2020/01/15 Python
python使用梯度下降和牛顿法寻找Rosenbrock函数最小值实例
2020/04/02 Python
Jupyter安装链接aconda实现过程图解
2020/11/02 Python
Python 里最强的地图绘制神器
2021/03/01 Python
优秀的计算机专业求职信范文
2013/12/27 职场文书
交通事故协议书范文
2014/04/16 职场文书
运动会搞笑广播稿
2014/10/14 职场文书
实施意见格式范本
2015/06/05 职场文书
从np.random.normal()到正态分布的拟合操作
2021/06/02 Python