1、页面的后退、刷新、前进

function back(){

    history.go(-1); // 后退

}

function forward(){

    history.go(+1); // 前进 1 页

}

function refresh(){

    history.go(0); // 刷新

}

2、保护自己的页面不被第三方页面放入iframe中

if(self != top) {

    top.location = self.location;

}

3、当前页面调用其他页面

也可以使用iframe来加载另一个页面，但有些IE是禁止使用的，所以本例使用object方式实现

<html>

<head>

    <title></title>

</head>

<body>

    <object type="text/x-scriptlet" width="350" height="300" data="http://www.baidu.com"></object>

</body>

</html>

4、倒计时

<html>

<head>

    <meta charset="utf-8">

    <title></title>

</head>

<script type="text/javascript">

    // 获取当前时间

    var startday = new Date();

    var clockStart = startday.getTime();

    function initStopwatch(){

        var myTime = new Date();

        var timeNow = myTime.getTime();

        // 获取间隔时间

        var timeDiff = timeNow - clockStart;

        // 因为时间以毫秒为单位,并且转化为字符串类型才可以使用indexof和subsring

        var diffSecs = "" + timeDiff / 1000;

        // 因为返回的毫秒还是有小数点的，所以要去掉

        diffSecs = diffSecs.substring(0,diffSecs.indexOf("."));

        // 返回间隔秒数

        return diffSecs;

    }

    function getSecs(){

        var mySecs = initStopwatch();

        // 以倒计时的方式显示时间

        mySecs1 = 10 - mySecs + "秒";

        document.form1.timespent.value = mySecs1;

        window.setTimeout('getSecs()',1000);

    }

</script>

<body onload="getSecs()">

<form name=form1>

    <input name="timespent" />

</form>

</body>

</html>

5、在页面中动态添加 Script 脚本

<html>

<head>

    <meta charset="utf-8">

    <title></title>

</head>

<script type="text/javascript">

    o = document.createElement('script');

    o.text = "alert('test!')";

    document.documentElement.childNodes[0].appendChild(o);

    o = document.createElement('script');

    o.src = "index.js";

    document.documentElement.childNodes[0].appendChild(o);

</script>

<body>

</body>

</html>

6、使用 javascript 传递页面参数

<html>

<head>

    <meta charset="utf-8">

    <title></title>

</head>

<script type="text/javascript">

    function GetArgs(parms,parmName) {

        var argIndex = parms.indexOf('?');

        var arg = parms.substring(argIndex + 1);

        var valArg = "";

        var arr_args = arg.split("&");

        for (var i = 0; i < arr_args.length; i++) {

            var str = arr_args[i]

            var arg = str.split("=");

            if(arg.length <= 1) continue;

            if(arg[0] == parmName) valArg = arg[1];

        };

        return valArg;

    }

    function PageParm() {

        var myname = GetArgs(window.location.href,"name");

        alert("参数name的值为：" + myname);

    }

</script>

<body onload = "PageParm()">

</body>

</html>

7、 按 Enter 键调用登录按钮

<html>

<head>

    <meta charset="utf-8">

    <title></title>

</head>

<script type="text/javascript">

    function keyLogin(){

        if(event.keyCode == 13) {

            document.getElementById("input1").click();

        }

    }

</script>

<body onkeydown="keyLogin();">

    <!-- <input type="text"  onkeydown="keyLogin();"> -->

    <input id="input1" value="登录" type="button" onclick="alert('调用成功！')" />

</body>

</html>

Javascript - demo 与 捷径的更多相关文章

  1. 【JavaScript Demo】回到顶部功能实现

    随着网站的不断发展,需要展示的内容也越来越丰富,这导致网页上能展示的内容越来越多.当内容堆积影响了用户体验,就需考虑如何提升用户体验.在这一系列的改动中,“回到顶部”的功能成为了一个经典. 1.页面布 ...

  2. 【Javascript Demo】移动端访问PC端网页时跳转到对应的移动端网页

    不想通过CSS自适应在PC端和移动端分别显示不同的样式,那么只能通过在移动端访问PC端网页时跳转到对应的移动端网页了,那么怎么跳转呢,网上也有很多文章说明,下面是本人测试有效的方式. 1.效果图 PC ...

  3. 【Javascript Demo】JS获取当前对象大小以及屏幕分辨率等

    效果如下: 代码如下: <html> <head> <title>获取当前对象大小以及屏幕分辨率等</title> <body> <d ...

  4. 【Javascript Demo】遮罩层和百度地图弹出层简单实现

    其实想做的就是显示百度地图的弹出层,现在已经简单实现了.示例和代码如下,点击按钮可以看到效果: 1.示例:   2.代码: <!DOCTYPE html PUBLIC "-//W3C/ ...

  5. 【Javascript Demo】无刷新预览所选择的图片

    1.效果如下,可测试 2.代码如下 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  6. 【Javascript Demo】防止按钮在短时间内被多次点击

    如果一个按钮可以在短时间内多次点击,那么有可能会被用户恶意点击,为防止这种情况,可以设定一定时间内只能点击一次,其他时间禁止点击按钮. 1.效果如下:     2.代码如下:   <div> ...

  7. 【Javascript Demo】遮罩层和弹出层简单实现

    最近纠结于遮罩层和弹出层的实现,终于搞定了个简单的版本.示例和代码如下,点击按钮可以看到效果: 1.示例: 2.代码: <!DOCTYPE html PUBLIC "-//W3C//D ...

  8. javascript Demo

    var vm=(function(){ var name="jasper"; var changename=function(v){ name=v; }; return { nam ...

  9. 【Javascript Demo】图片瀑布流实现

    瀑布流就是像瀑布一样的网站——丰富的网站内容,特别是绚美的图片会让你流连忘返.你在浏览网站的时候只需要轻轻滑动一下鼠标滚轮,一切的美妙的图片精彩便可呈现在你面前.瀑布流网站是新兴的一种网站模式——她的 ...

随机推荐

  1. NOIP2018提高组模拟题（六）

    购物(shop) Description 小林来到商店中进行购物.商店里一共有 n 件物品,第 i 件物品的价格为 a[i] 元.小林总共需要购买 m 件物品,他希望他所花费的钱最少,请你计算出最小 ...

  2. ASP.NET Core 2.2 基础知识(四) URL重写中间件

    说到URL重写就不得不提URL重定向. URL重定向 URL重定向是客户端操作,指示客户端访问另一个地址的资源.这需要往返服务器,并且当客户端对资源发出请求时,返回客户端的重定向URL会出现在浏览器的 ...

  3. codeforces 314E Sereja and Squares

    discription Sereja painted n points on the plane, point number i (1 ≤ i ≤ n) has coordinates (i, 0). ...

  4. 【bzoj2142】【礼物】拓展Lucas定理+孙子定理

    (上不了p站我要死了,侵权度娘背锅) Description 一年一度的圣诞节快要来到了.每年的圣诞节小E都会收到许多礼物,当然他也会送出许多礼物.不同的人物在小E 心目中的重要性不同,在小E心中分量 ...

  5. （转）unity web 缓存解决方案

    unity web 缓存解决方案 官方发布 web版限制五十M缓存,根据自己的经验绕了过去,解决了缓存的问题.带工程,带源代码.由于本人的水平也有限,是用JS来解决的,如果你还是没有头绪,可以购买来试 ...

  6. Asp.Net MVC part1

    路由简介在Global中注册了路由数据包括:默认Controller,默认Action,请求地址匹配路由规则 约定大于配置为了尽量少的配置,于是将常用的配置作为默认约定,如果不同则进行少量配置主要从存 ...

  7. jQuery--样式

    Jquery(一)——样式篇1.$(document).ready 的作用是等页面的文档(document)中的节点都加载完毕后,再执行后续的代码, 因为我们在执行代码的时候,可能会依赖页面的某一个元 ...

  8. C#基础之 派生类

    1: 当创建派生类的实例时,会自动调用基类的默认构造函数 namespace parentTest { public class Reader { public Reader() { Console. ...

  9. javascript快速入门9--引用类型

    引用类型通常叫做类(class),也就是说,遇到引用值,所处理的就是对象. 注意:从传统意义上来说,ECMAScript 并不真正具有类.事实上,除了说明不存在类,在 ECMA-262 中根本没有出现 ...

  10. [Python爬虫] 之二十四：Selenium +phantomjs 利用 pyquery抓取中广互联网数据

    一.介绍 本例子用Selenium +phantomjs爬取中广互联网(http://www.tvoao.com/select.html)的资讯信息,输入给定关键字抓取资讯信息. 给定关键字:数字:融 ...