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

更新时间：2019年05月13日 08:50:06 作者：SpecYue

这篇文章主要介绍了JavaScript封闭函数及常用内置对象,结合实例形式分析了JavaScript封闭函数及常用内置对象的定义与简单使用相关操作技巧,需要的朋友可以参考下

本文实例讲述了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程序设计有所帮助。

您可能感兴趣的文章:

简单实例处理url特殊符号&处理(2种方法)
url里的参数内容包含&符合，我有两种方法解决一是：在页面用JS转码;二是：在后端处理，另外还有网络分享的一些方法，感兴趣的朋友可以参考下哈
2013-04-04
JavaScript键盘事件响应顺序详解
这篇文章主要为大家详细介绍了JavaScript键盘事件响应顺序，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2019-09-09
JavaScript实现网页版简易计算器功能
这篇文章主要介绍了JavaScript实现网页版简易计算器功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-07-07
webpack中使用iconfont字体图标的方法
下面小编就为大家分享一篇webpack中使用iconfont字体图标的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-02-02
Bootstrap源码学习笔记之bootstrap进度条
本文通过源码给大家解析bootstrap进度条样式，分为条纹进度条，动态条纹进度条，层叠进度条和带Label的进度条，下面通过代码给大家简单介绍下，感兴趣的朋友一起看看吧
2016-12-12
uniapp存储数据到本地文件及读取本地文件数据代码示例
这篇文章主要给大家介绍了关于uniapp存储数据到本地文件及读取本地文件数据的相关资料,在开发uniapp应用时,我们常常需要使用本地存储来保存一些数据,比如用户登录信息、设置项等,本文通过代码介绍的非常详细,需要的朋友可以参考下
2023-09-09
javascript权威指南学习笔记之变量作用域分享
最近一直在看《javascript权威指南第五版》，变量作用域这一章，看得真的有点累。不过，收获还是多多。
2011-09-09
JavaScript声明变量名的语法规则
这篇文章主要给大家简单介绍了JavaScript声明变量名的语法规则，非常有助于大家学习javascript，有需要的小伙伴可以参考下。
2015-07-07
js设置和获取自定义属性的方法
下面小编就为大家带来一篇js设置和获取自定义属性的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-10-10
微信小程序使用setData修改数组中单个对象的方法分析
这篇文章主要介绍了微信小程序使用setData修改数组中单个对象的方法,结合具体实例形式分析了setData进行数组修改的相关操作技巧与注意事项,需要的朋友可以参考下
2018-12-12