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 相关文章推荐
默认让页面的第一个控件选中的javascript代码
Dec 26 Javascript
juqery 学习之三 选择器 简单 内容
Nov 25 Javascript
jQuery动画animate方法使用介绍
May 06 Javascript
JavaScript获取某年某月的最后一天附截图
Jun 23 Javascript
JavaScript中匿名、命名函数的性能测试
Sep 04 Javascript
jquery获取文档高度和窗口高度汇总
Jan 25 Javascript
jQuery点击导航栏选中更换样式的实现代码
Jan 23 Javascript
详解JS构造函数中this和return
Sep 16 Javascript
利用three.js画一个3D立体的正方体示例代码
Nov 19 Javascript
Auto.js自动收取自己和好友蚂蚁森林能量脚本
Jun 28 Javascript
解决vue-router 切换tab标签关闭时缓存问题
Jul 22 Javascript
关于对TypeScript泛型参数的默认值理解
Jul 15 Javascript
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和XSS跨站攻击的防范
2007/04/17 PHP
php 向访客和爬虫显示不同的内容
2009/11/09 PHP
Base64在线编码解码实现代码 演示与下载
2011/01/08 PHP
基于PHP的简单采集数据入库程序
2014/07/30 PHP
php使用正则表达式去掉html中的注释方法
2016/11/03 PHP
strpos() 函数判断字符串中是否包含某字符串的方法
2019/01/16 PHP
javascript支持firefox,ie7页面布局拖拽效果代码
2007/12/20 Javascript
JavaScript 继承详解 第一篇
2009/08/30 Javascript
通过javascript把图片转化为字符画
2013/10/24 Javascript
jQuery的:parent选择器定义和用法
2014/07/01 Javascript
纯javascript代码实现计算器功能(三种方法)
2015/09/07 Javascript
JS匿名函数类生成方式实例分析
2016/11/26 Javascript
JavaScript使用readAsDataURL读取图像文件
2017/05/10 Javascript
Angular实现较为复杂的表格过滤,删除功能示例
2017/12/23 Javascript
Vue异步组件处理路由组件加载状态的解决方案
2018/09/07 Javascript
React性能优化系列之减少props改变的实现方法
2019/01/17 Javascript
python网络编程学习笔记(四):域名系统
2014/06/09 Python
Python实现拼接多张图片的方法
2014/12/01 Python
Python实现文件复制删除
2016/04/19 Python
python 哈希表实现简单python字典代码实例
2019/09/27 Python
tensorflow实现读取模型中保存的值 tf.train.NewCheckpointReader
2020/02/10 Python
Python统计文本词汇出现次数的实例代码
2020/02/27 Python
python datetime处理时间小结
2020/04/16 Python
HTML5 语音搜索只需一句代码
2013/01/03 HTML / CSS
Airbnb爱彼迎官网:成为爱彼迎房东,赚取收入
2019/03/14 全球购物
工作表现自我评价
2014/02/08 职场文书
博士毕业生自我鉴定范文
2014/04/13 职场文书
师范生求职信
2014/06/14 职场文书
2015年母亲节寄语
2015/03/23 职场文书
胡桃夹子观后感
2015/06/11 职场文书
2015高中教师个人工作总结
2015/07/21 职场文书
会计主管竞聘书
2015/09/15 职场文书
Python制作动态字符画的源码
2021/08/04 Python
浅谈sql_@SelectProvider及使用注意说明
2021/08/04 Java/Android
 Redis 串行生成顺序编码的方法实现
2022/04/03 Redis
python使用shell脚本创建kafka连接器
2022/04/29 Python