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 相关文章推荐
jQuery对象和DOM对象的相互转化实现代码
Mar 02 Javascript
jQuery后代选择器用法实例
Dec 23 Javascript
javascript数据类型示例分享
Jan 19 Javascript
JavaScript中常用的六种互动方法示例
Mar 13 Javascript
jfinal与bootstrap的登录跳转实战演习
Sep 22 Javascript
使用HTML5+Boostrap打造简单的音乐播放器
Aug 05 Javascript
AngularJS使用ng-options指令实现下拉框
Aug 23 Javascript
VSCode配置react开发环境的步骤
Dec 27 Javascript
浅谈Node 调试工具入门教程
Mar 20 Javascript
解决Vue在Tomcat8下部署页面不加载的问题
Nov 12 Javascript
Vue的Eslint配置文件eslintrc.js说明与规则介绍
Feb 03 Javascript
jQuery使用hide()、toggle()函数实现相机品牌展示隐藏功能
Jan 29 jQuery
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
thinkphp视图模型查询提示ERR: 1146:Table 'db.pr_order_view' doesn't exist的解决方法
2014/10/30 PHP
PHP面向对象程序设计子类扩展父类(子类重新载入父类)操作详解
2019/06/14 PHP
PHP使用gearman进行异步的邮件或短信发送操作详解
2020/02/27 PHP
Javascript中产生固定结果的函数优化技巧
2013/01/16 Javascript
用javascript替换URL中的参数值示例代码
2014/01/27 Javascript
JS按回车键实现登录的方法
2014/08/25 Javascript
浅谈jQuery中height与width
2015/07/06 Javascript
javascript每日必学之循环
2016/02/19 Javascript
JS生成某个范围的随机数【四种情况详解】
2016/04/20 Javascript
JavaScript必知必会(九)function 说起 闭包问题
2016/06/08 Javascript
AngularJS基础 ng-switch 指令简单示例
2016/08/03 Javascript
原生js编写焦点图效果
2016/12/08 Javascript
详解前端构建工具gulpjs的使用介绍及技巧
2017/01/19 Javascript
JavaScript数据结构之链表的实现
2017/03/19 Javascript
vue组件中watch props根据v-if动态判断并挂载DOM的问题
2019/05/12 Javascript
laypage+SpringMVC实现后端分页
2019/07/27 Javascript
基于Nuxt.js项目的服务端性能优化与错误检测(容错处理)
2019/10/23 Javascript
微信小程序实现倒计时功能
2020/11/19 Javascript
[40:56]2018DOTA2亚洲邀请赛 3.31 小组赛 A组 Liquid vs TNC
2018/04/01 DOTA
[48:05]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 VGJ.T vs VP
2018/03/31 DOTA
用Python操作字符串之rindex()方法的使用
2015/05/19 Python
用 Python 爬了爬自己的微信朋友(实例讲解)
2017/08/25 Python
解决nohup重定向python输出到文件不成功的问题
2018/05/11 Python
Mac在python3环境下安装virtualwrapper遇到的问题及解决方法
2019/07/09 Python
完美解决keras 读取多个hdf5文件进行训练的问题
2020/07/01 Python
Selenium结合BeautifulSoup4编写简单的python爬虫
2020/11/06 Python
澳大利亚便宜的家庭购物网站:CrazySales
2018/02/06 全球购物
美国孩之宝玩具官网:Hasbro Pulse
2019/06/24 全球购物
Clarks其乐鞋荷兰官网:Clarks荷兰
2019/07/05 全球购物
50岁生日感言
2014/01/23 职场文书
网络管理员岗位职责
2014/03/17 职场文书
党支部遵守党的政治纪律情况对照检查材料
2014/09/26 职场文书
2015年收银工作总结范文
2015/04/01 职场文书
2015年高三班主任工作总结
2015/05/21 职场文书
感谢信
2019/04/11 职场文书
MySQL性能指标TPS+QPS+IOPS压测
2022/08/05 MySQL