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 相关文章推荐
关于JS控制代码暂停的实现方法分享
Oct 11 Javascript
javascript真的不难-回顾一下基础知识
Jan 15 Javascript
jQuery登陆判断简单实现代码
Apr 21 Javascript
jquery实现文字由下到上循环滚动的实例代码
Aug 09 Javascript
jQuery的live()方法对hover事件的处理示例
Feb 27 Javascript
jQuery setTimeout传递字符串参数报错的解决方法
Jun 09 Javascript
jQuery中的siblings用法实例分析
Dec 24 Javascript
js实现图片左右滚动效果
Feb 27 Javascript
Vue.js2.0中的变化小结
Oct 24 Javascript
JavaScript实现的反序列化json字符串操作示例
Jul 18 Javascript
记录vue做微信自定义分享的一些问题
Sep 12 Javascript
Vue 实例中使用$refs的注意事项
Jan 29 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
thinkphp在php7环境下提示Cannot use ‘String’ as class name as it is reserved的解决方法
2016/09/30 PHP
php提供实现反射的方法和实例代码
2019/09/17 PHP
基于Jquery的$.cookie()实现跨越页面tabs导航实现代码
2011/03/03 Javascript
JS实现商品倒计时实现代码
2013/05/03 Javascript
JS将制定内容复制到剪切板示例代码
2014/02/11 Javascript
jQuery源码分析之jQuery中的循环技巧详解
2014/09/06 Javascript
jquery超简单实现手风琴效果的方法
2015/06/05 Javascript
js图片卷帘门导航菜单特效代码分享
2015/09/10 Javascript
JS中如何实现复选框全选功能
2016/12/19 Javascript
jQuery布局组件EasyUI Layout使用方法详解
2017/02/28 Javascript
深入理解Node中的buffer模块
2017/06/03 Javascript
详解Angular2组件之间如何通信
2017/06/22 Javascript
webpack实现热加载自动刷新的方法
2017/07/30 Javascript
jsonp跨域及实现百度首页联想功能的方法
2018/08/30 Javascript
js使用swiper实现层叠轮播效果实例代码
2018/12/12 Javascript
Vue export import 导入导出的多种方式与区别介绍
2020/02/12 Javascript
vue实现淘宝购物车功能
2020/04/20 Javascript
ptyhon实现sitemap生成示例
2014/03/30 Python
浅谈python import引入不同路径下的模块
2017/07/11 Python
Python编程django实现同一个ip十分钟内只能注册一次
2017/11/03 Python
Python操作远程服务器 paramiko模块详细介绍
2019/08/07 Python
Python实现自动访问网页的例子
2020/02/21 Python
Python入门基础之数字字符串与列表
2021/02/01 Python
获取邓白氏信用报告:Dun & Bradstreet
2019/01/22 全球购物
火山咖啡:Volcanica Coffee
2019/10/29 全球购物
世界上最好的野生海鲜和有机食品:Vital Choice
2020/01/16 全球购物
Optimalprint加拿大:在线打印服务
2020/04/03 全球购物
Ego Shoes官网:英国时髦鞋类品牌
2020/10/19 全球购物
阿尔卡特(中国)的面试题目
2014/08/20 面试题
将一个文本文件的内容按倒序打印出来
2015/01/05 面试题
路由表示做什么用的?在linux环境中怎么来配置一条默认路由?
2013/06/07 面试题
建筑施工实习自我鉴定
2013/09/19 职场文书
企业领导对照检查材料
2014/08/20 职场文书
教师作风整改措施思想汇报
2014/10/12 职场文书
2015纪念九一八事变84周年演讲稿
2015/03/19 职场文书
nginx 反向代理之 proxy_pass的实现
2021/03/31 Servers