JavaScript自学代码--（四）
//JavaScript Window - 浏览器对象模型
window.document.getElementById("header");
//等价于
document.getElementById("header");
/*
Window 尺寸
有三种方法能够确定浏览器窗口的尺寸（浏览器的视口，不包括工具栏和滚动条）。
对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari：
window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
对于 Internet Explorer 8、7、6、5：
document.documentElement.clientHeight
document.documentElement.clientWidth
或者
document.body.clientHeight
document.body.clientWidth
实用的 JavaScript 方案（涵盖所有浏览器）：
* */
function get_Browser(){
var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth; var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight; x=document.getElementById("demo");
x.innerHTML="Browser inner window width: " + w + ", height: " + h + "."
}
/*
其他 Window 方法
一些其他方法：
window.open() - 打开新窗口
window.close() - 关闭当前窗口
window.moveTo() - 移动当前窗口
window.resizeTo() - 调整当前窗口的尺寸
* */
function Screen(){
//可用宽度
document.write("Available Width: " + screen.availWidth);
//可用高度
document.write("Available Height: " + screen.availHeight);
// Window Location Pathname
//location.pathname 属性返回 URL 的路径名。
document.write(location.pathname);
//location.assign() 方法加载新的文档。
function newDoc()
{
window.location.assign("www.baidu.com");
//window.history 对象包含浏览器的历史。
window.history.back(); //返回
/*
<html>
<head>
<script>
function goBack()
{
window.history.back()
}
</script>
</head>
<body> <input type="button" value="Back" onclick="goBack()"> </body>
</html>
*/ window.history.forward();//前进
/*
<html>
<head>
<script>
function goForward()
{
window.history.forward()
}
</script>
</head>
<body> <input type="button" value="Forward" onclick="goForward()"> </body>
</html>
*/
//window.navigator 对象包含有关访问者浏览器的信息。
function Get_Browser(){
txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>";
txt+= "<p>Browser Name: " + navigator.appName + "</p>";
txt+= "<p>Browser Version: " + navigator.appVersion + "</p>";
txt+= "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
txt+= "<p>Platform: " + navigator.platform + "</p>";
txt+= "<p>User-agent header: " + navigator.userAgent + "</p>";
txt+= "<p>User-agent language: " + navigator.systemLanguage + "</p>";
document.getElementById("example").innerHTML=txt;
/*
来自 navigator 对象的信息具有误导性，不应该被用于检测浏览器版本，这是因为：
navigator 数据可被浏览器使用者更改
一些浏览器对测试站点会识别错误
浏览器无法报告晚于浏览器发布的新操作系统
*/
//JavaScript 弹窗
//警告框
//警告框经常用于确保用户可以得到某些信息。
//当警告框出现后，用户需要点击确定按钮才能继续进行操作。
function myFunction(){
alert("Confirm!");
}
/*
确认框
确认框通常用于验证是否接受用户操作。
当确认卡弹出时，用户可以点击 "确认" 或者 "取消" 来确定用户操作。
当你点击 "确认", 确认框返回 true， 如果点击 "取消", 确认框返回 false。
*/
function myFunction()
{
var x;
var r=confirm("Press a button!");
if (r==true)
{
x="You pressed OK!";
}
else
{
x="You pressed Cancel!";
}
document.getElementById("demo").innerHTML=x;
}
/*
提示框
提示框经常用于提示用户在进入页面前输入某个值。
当提示框出现后，用户需要输入某个值，然后点击确认或取消按钮才能继续操纵。
如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为 null。
*/
function myFunction()
{
var x;
var person=prompt("请输入你的名字","Harry Potter");
if (person!=null)
{
x="你好 " + person + "! 今天感觉如何?";
document.getElementById("demo").innerHTML=x;
}
}
/*
JavaScript 计时事件
通过使用 JavaScript，我们有能力作到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。 在 JavaScritp 中使用计时事件是很容易的，两个关键方法是: setInterval() - 间隔指定的毫秒数不停地执行指定的代码。
setTimeout() - 暂停指定的毫秒数后执行指定的代码
Note: setInterval() 和 setTimeout() 是 HTML DOM Window对象的两个方法。
*/
//每三秒弹出 "hello" ：
setInterval(function(){alert("Hello")},3000); //动态时钟显示
var myVar=setInterval(function(){myTimer()},1000);
function myTimer()
{
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById("demo").innerHTML=t;
} }
} } //clearInterval() 方法用于停止 setInterval() 方法执行的函数代码。
function StopTime(){
var myVar=setInterval(function(){myTimer()},1000);
function myTimer()
{
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById("demo").innerHTML=t;
}
function myStopFunction()
{
clearInterval(myVar);
}
}
//JavaScript 可以使用 document.cookie 属性来创建 、读取、及删除 cookies。
//创建cookies
document.cookie = "userName = Jone";
//您还可以为 cookie 添加一个过期时间（以 UTC 或 GMT 时间）。默认情况下，cookie 在浏览器关闭时删除：
document.cookie = "username = jone;expres = Thu,18,Dec 2013 12:00:00 GMT";
//您可以使用 path 参数告诉浏览器 cookie 的路径。默认情况下，cookie 属于当前页面。
document.cookie="username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/"; //使用 JavaScript 读取 Cookie
var x = document.cookie;
//document.cookie 将以字符串的方式返回所有的 cookies，类型格式： cookie1=value; cookie2=value; cookie3=value; //使用 JavaScript 修改 Cookie
//在 JavaScript 中，修改 cookies 类似于创建 cookies，如下所示：
document.cookie="username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/";
//旧的 cookie 将被覆盖。
//使用 JavaScript 删除 Cookie
//删除 cookie 非常简单。您只需要设置 expires 参数为以前的时间即可，如下所示，设置为 Thu, 01 Jan 1970 00:00:00 GMT:
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";
//注意，当您删除时不必指定 cookie 的值。 //Cookies操作函数
function setCookie(cname,cvalue,exdays)
{
var d = new Date();
d.setTime(d.getTime()+(exdays*24*60*60*1000));
var expires = "expires="+d.toGMTString();
document.cookie = cname + "=" + cvalue + "; " + expires;
} function getCookie(cname)
{
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++)
{
var c = ca[i].trim();
if (c.indexOf(name)==0) return c.substring(name.length,c.length);
}
return "";
} function checkCookie()
{
var user=getCookie("username");
if (user!="")
{
alert("Welcome again " + user);
}
else
{
user = prompt("Please enter your name:","");
if (user!="" && user!=null)
{
setCookie("username",user,365);
}
}
}
JavaScript自学代码--（四）的更多相关文章
- JavaScript自学代码--（三）
//通过 id 查找 HTML 元素 var x = document.getElementById("demo"); //通过标签名查找 HTML 元素 //本例查找 id=&q ...
- JavaScript框架设计(四) 字符串选择器(选择器模块结束)
JavaScript框架设计(四) 字符串选择器(选择器模块结束) 经过前面JavaScript框架设计(三) push兼容性和选择器上下文的铺垫,实现了在某一元素下寻找,现在终于进入了字符串选择器 ...
- javascript常用代码大全
http://caibaojian.com/288.html 原文链接 jquery选中radio //如果之前有选中的,则把选中radio取消掉 $("#tj_cat .pro_ca ...
- Javascript多线程引擎(四)
Javascript多线程引擎(四)--之C语言单继承 因为使用C语言做为开发语言, 而C语言在类的支持方面几乎为零, 而Javascript语言的Object类型是一个非常明显的类支持对象,所以这里 ...
- 32、可以拿来用的JavaScript实用功能代码
可以拿来用的JavaScript实用功能代码(可能会有些bug,用时稍微修改下,我用了几个还可以) 转载自 1.原生JavaScript实现字符串长度截取 function cutstr(str, l ...
- JavaScript standard 代码规范的全文
这是 JavaScript standard 代码规范的全文. 掌握本规范的最好方法是安装并在自己的代码中使用它. 细则 使用两个空格进行缩进. eslint: indent function hel ...
- Javascript特效代码大全(420个)（转）
转载自:Javascript特效代码大全(420个) 收集资料,以便使用+面试+学习 ├ Cookie脚本 ├ 随访问次数变提示 ├ 集成Cookies ├ 使窗口仅弹出一次 ├ 签名提示程序 ├ ...
- JavaScript学习记录四
title: JavaScript学习记录四 toc: true date: 2018-09-16 20:31:22 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...
- How Javascript works (Javascript工作原理) (四) 事件循环及异步编程的出现和 5 种更好的 async/await 编程方式
个人总结: 1.讲解了JS引擎,webAPI与event loop合作的机制. 2.setTimeout是把事件推送给Web API去处理,当时间到了之后才把setTimeout中的事件推入调用栈. ...
随机推荐
- Android5.0之Toobar的使用
总体上来说,Toolbar的使用可以分为两个方面,一方面是将ToolBar当作ActionBar来用,另一方面就是将Toolbar当成一个单独的控件来用,不过到目前为止我见到的大部分情况都是把Tool ...
- asp.net分页控件库
AspNetPager分页控件 AspNetPager分页控件解决了分页中的很多问题,直接采用该控件进行分页处理,会将繁琐的分页工作变得简单化,下面是我如何使用AspNetPager控件进行分页处理的 ...
- Magento 使用心得
Modules->模块 Controller->控制器 Model->模型 Magento是这个星球上最强大的购物车网店平台.当然,你应该已经对此毫无疑问了.不过,你可能还不知道,M ...
- xml中使用foreach遍历对象
如果是一个带数据的List对象 <select id="selectProductMSTList" resultType="java.util.Map" ...
- VS2015 Cordova Ionic移动开发（一）
一.Windows环境配置 1.如果已经安装VS2015,打开[工具]-[选项]找到Cordova选项: 运行依赖关系查看器,用来检测开发环境是否完整. 如果检测显示: 那么就是环境配置完成了.可以直 ...
- MVC小系列（十八）【给checkbox和radiobutton添加集合的重载】
mvc对DropDownListFor的重载很多,但对checkbox和radiobutton没有对集合的重载 所以该讲主要针对集合的扩展: #region 复选框扩展 /// <summary ...
- 转载--SQL Server 2005的XQuery介绍
原文地址: http://bbs.51cto.com/thread-458009-1-1.html 引用: 摘要 本文介绍了SQL Server 2005能够支持的XQuery的各方面特性如FLW ...
- 【JAVA错误笔记】 - Unable add facets project AnnotationWebService CXF 2-x Web Services
错误描述: 创建webservice接口服务时候提示: Unable add facets project AnnotationWebService CXF 2-x Web Services Unab ...
- js判断手机浏览器操作系统和微信浏览器的方法
做手机端的前端开发,少不了对手机平台的判断.如,对于app下载,就要判断在Android平台下就显示Android下载提示:在iOS平台下就显示iOS下载提示. 今天就为大家介绍一下用js判断手机客户 ...
- iOS 多张图片保存到相册问题（add multiple images to photo album）
不知道朋友们有木有做过多图保存到系统的相册这个需求,我在用`UIImageWriteToSavedPhotosAlbum`保存图片时候,在代理回调方`didFinishSavingWithError` ...