文档章节

200多个js技巧代码(3)

一别经年
 一别经年
发布于 2014/06/13 21:59
字数 1518
阅读 10
收藏 0
点赞 0
评论 0
82.event.x,event.clientX,event.offsetX区别:
x:设置或者是得到鼠标相对于目标事件的父元素的外边界在x坐标上的位置。 clientX:相对于客户区域的x坐标位置,不

包括滚动条,就是正文区域。 offsetx:设置或者是得到鼠标相对于目标事件的父元素的内边界在x坐标上的位置。
screenX:相对于用户屏幕。

 
83.显示是鼠标按钮的哪个
<body onMouseDown="alert(event.button)">点Mouse看看//

84.打开C盘
<form action="file:///c|/"><input type="submit" value="c:\ drive"></form>//
 
85.当前屏幕的分辨率
screen.width、screen.height//

86.设置表格中的内容
tbl.rows[0].cells[1].innerText=document.form.text1.value;//

 
87.本地快捷键
<p><a href="file:///::{208D2C60-3AEA-1069-A2D7-08002B30309D}" target="_blank">网上邻居</a></p>
<p><a href="file:///::{20D04FE0-3AEA-1069-A2D8-08002B30309D}\d:\web" target="_blank">我的电脑</a></p>
<p><a href="file:///::{450D8FBA-AD25-11D0-98A8-0800361B1103}" target="_blank">我的文档</a></p>
<p><a href="file:///::{645FF040-5081-101B-9F08-00AA002F954E}" target="_blank">回收站</a></p>
<p><a href="file:///::{20D04FE0-3AEA-1069-A2D8-08002B30309D}\::{21EC2020-3AEA-1069-A2DD-08002B30309D}"

target="_blank">控制面板</a></p>
<p><a href="file:///::{7007ACC7-3202-11D1-AAD2-00805FC1270E}">拨号网络</a>(windows 2000)</p>

 
88.IE菜单
<button onclick="min.Click()"><font face="webdings">0</font></button>//改变按钮上的图片
<input type=button  onclick="document.execCommand('CreateLink','true','true')"> //创建新连接
<input type=button  onclick="document.execCommand('print','true','true')"> //打印
<input type=button  onclick="document.execCommand('saveas','true','网站制作.htm')">//另存为htm
<input type=button  onclick="document.execCommand('saveas','true','网站制作.txt')">//另存为txt
document.execCommand("SaveAs")//保存为
document.execCommand('undo')//撤销上一次操作

89.web对话框
<SCRIPT>
var contents='<style>body,td{font:menu}img{cursor:hand}</style>';
contents+='<title>你要关闭我吗</title>';
contents+='<body bgcolor=menu>';
contents+='<table width=100% height=100% border=0>';
contents+='<tr><td align=center>';
contents+='你要关闭我吗?<br>';
contents+='<img src=dark.gif onclick=self.close() alt="...关闭">';
contents+='<img src=jet.gif onclick=self.close() alt="全是关闭">';
contents+='</td></tr></table>';
showModalDialog("about:"+contents+"","","dialogHeight:50px;dialogWidth:250px;help:no;status:no")
document.write(contents);
</SCRIPT>//

90.取第x,y的值
<button onclick="t1.rows[x].cells[y].innerText='guoguo'"></button>//

91.向新打开的网页上写内容
newwin=window.open('about:blank','','top=10');
newwin.document.write('');//

93.返回
javascript:history.go(-2);//

94.将页面上选中的内容复制到剪贴板
abcdefg
<input type='button'

onclick="window.clipboardData.setData('text',document.selection.createRange().text);" value='复制页面选中

的字符'>//
95.将页面上选中的内容复制到剪贴板
<INPUT TYPE="text" NAME="">kjhkjhkhkj<INPUT TYPE="button" onclick="document.execCommand('Copy', 'false',

null);">////

96.鼠标移到下拉框时自动全部打开
<select onmouseover="javascript:this.size=this.length" onmouseout="javascript:this.size=1"></select>//

97.获得本机的文件
var fso = new ActiveXObject("Scripting.FileSystemObject");
var f1 = fso.GetFile("C:\\bsitcdata\\ejbhome.xml");
alert("File last modified: " + f1.DateLastModified); //

98.判断客户端是否是IE浏览器
因为 document.all 是 IE 的特有属性,所以通常用这个方法来判断客户端是否是IE浏览器 ,document.all?1:0;

99.创建新的下拉框选项
new Option(text,value)这样的函数//

100.在页面上画柱状图
<STYLE>
td{font-size:12px}
body{font-size:12px}
v\:*{behavior:url(#default#VML);} //这里声明了v作为VML公用变量
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
mathstr=12;
document.write ("<v:rect fillcolor='red'

style='width:20;color:navy;height:"+5000/(1000/mathstr)+"'><br> %"+mathstr+"<br>4人<v:Extrusion

backdepth='15pt' on='true'/></v:rect>")
</SCRIPT>
<v:rect fillcolor='red' style='width:20;color:navy;height:200'><br>%12<br>4人<v:Extrusion

backdepth='15pt' on='true'/></v:rect>
<v:rect fillcolor='yellow' style='width:20;color:navy;height:100'><br>%12<br>4人<v:Extrusion

backdepth='15pt' on='true'/></v:rect>//

 

101.饼图
<style>
v\:*     { behavior: url(#default#VML) }
o\:*     { behavior: url(#default#VML) }
.shape    { behavior: url(#default#VML) }
</style>
<script language="javascript">
function show(pie)
{
pie.strokecolor=pie.fillcolor;
pie.strokeweight=10;
div1.innerHTML="<font size=2 color=red> " + pie.id +"</font> <font size=2>" + pie.title + "</font>";
}
function hide(pie)
{
pie.strokecolor="white";
pie.strokeweight=1;
div1.innerHTML="";
}
</script>
</head>
<body>
<v:group style='width: 5cm; height: 5cm' coordorigin='0,0' coordsize='250,250'>
<v:shape id='asp技术' style='width:10;height:10;top:10;left:0' title='得票数:6 比例:40.00%'

onmouseover='javascript:show(this);' onmouseout='javascript:hide(this);' href='http://www.cnADO.com'

CoordSize='10,10' strokecolor='white' fillcolor='#ffff33'><v:path v='m 300,200 ae

300,200,200,150,0,9437184 xe'/></v:shape>
<v:shape id='php' style='width:10;height:10;top:10;left:0' title='得票数:1 比例:6.67%'

onmouseover='javascript:show(this);' onmouseout='javascript:hide(this);' href='http://www.cnADO.com'

CoordSize='10,10' strokecolor='white' fillcolor='#ff9933'><v:path v='m 300,200 ae

300,200,200,150,9437184,1572864 xe'/></v:shape>
<v:shape id='jsp' style='width:10;height:10;top:10;left:0' title='得票数:2 比例:13.33%'

onmouseover='javascript:show(this);' onmouseout='javascript:hide(this);' href='http://www.cnADO.com'

CoordSize='10,10' strokecolor='white' fillcolor='#3399ff'><v:path v='m 300,200 ae

300,200,200,150,11010048,3145728 xe'/></v:shape>
<v:shape id='c#写的.netWEB程序' style='width:10;height:10;top:10;left:0' title='得票数:3 比例:20.00%'

onmouseover='javascript:show(this);' onmouseout='javascript:hide(this);' href='http://www.cnADO.com'

CoordSize='10,10' strokecolor='white' fillcolor='#99ff33'><v:path v='m 300,200 ae

300,200,200,150,14155776,4718592 xe'/></v:shape>
<v:shape id='vb.net写的.netWEB程序' style='width:10;height:10;top:10;left:0' title='得票数:2 比例:13.33%'

onmouseover='javascript:show(this);' onmouseout='javascript:hide(this);' href='http://www.cnADO.com'

CoordSize='10,10' strokecolor='white' fillcolor='#ff6600'><v:path v='m 300,200 ae

300,200,200,150,18874368,3145728 xe'/></v:shape>
<v:shape id='xml技术' style='width:10;height:10;top:10;left:0' title='得票数:1 比例:6.67%'

onmouseover='javascript:show(this);' onmouseout='javascript:hide(this);' href='http://www.cnADO.com'

CoordSize='10,10' strokecolor='white' fillcolor='#ff99ff'><v:path v='m 300,200 ae

300,200,200,150,22020096,1572864 xe'/></v:shape>
</v:group>

<v:group style='width: 6cm; height: 6cm' coordorigin='0,0' coordsize='250,250'>
<v:rect style='height:10;width:15;top:0;left:10' fillcolor='#ffff33'/>
<v:rect style='height:28;width:100;top:0;left:30' stroked='false'><v:textbox

style='fontsize:2'>asp技术</v:textbox/></v:rect>
<v:rect style='height:10;width:15;top:30;left:10' fillcolor='#ff9933'/>
<v:rect style='height:28;width:100;top:30;left:30' stroked='false'><v:textbox

style='fontsize:2'>php</v:textbox/></v:rect>
<v:rect style='height:10;width:15;top:60;left:10' fillcolor='#3399ff'/>
<v:rect style='height:28;width:100;top:60;left:30' stroked='false'><v:textbox

style='fontsize:2'>jsp</v:textbox/></v:rect>
<v:rect style='height:10;width:15;top:90;left:10' fillcolor='#99ff33'/>
<v:rect style='height:28;width:100;top:90;left:30' stroked='false'><v:textbox

style='fontsize:2'>c#写的.netWEB程序</v:textbox/></v:rect>
<v:rect style='height:10;width:15;top:120;left:10' fillcolor='#ff6600'/>
<v:rect style='height:28;width:100;top:120;left:30' stroked='false'><v:textbox style='fontsize:2'>vb.net

写的.netWEB程序</v:textbox/></v:rect>
<v:rect style='height:10;width:15;top:150;left:10' fillcolor='#ff99ff'/>
<v:rect style='height:28;width:100;top:150;left:30' stroked='false'><v:textbox style='fontsize:2'>xml技术

</v:textbox/></v:rect>
</v:group>

<div style="position: absolute; left: 10; top: 10; width: 760; height:16">
 <table border="1" cellpadding="2" cellspacing="2" cellpadding="0" cellspacing="0"

style="border-collapse: collapse" bordercolor="#CCCCCC" width="100%" ID="Table1">
  <tr>
   <td width="100%" id=div1> </td>
  </tr>
 </table>
</div>//

102.是一个特殊的容器,想装个网页都行
<button><iframe src="http://www.google.com/"></iframe></button>//button

103.外部的html代码
event.srcElement.outerHTML//

104.标识当前的IE事件的触发器
event.srcElement和event.keyCode//

105.事件类型
event.type//


本文转载自:http://bbs.csdn.net/topics/370171173

共有 人打赏支持
一别经年
粉丝 17
博文 173
码字总数 58546
作品 0
西安
程序员
5分钟,掌握9个风骚又简洁的JavaScript技巧

5分钟,掌握9个风骚又简洁的JavaScript技巧 编辑于 2018-05-08

优达学城(Udacity)
05/16
0
0
dwz使用过程中疑问(求大神帮忙看下如何解决)

一.简介 1、概述 DWZ富客户端框架(jQuery RIA framework), 是中国人自己开发的基于jQuery实现的Ajax RIA开源框架。 DWZ富客户端框架设计目标是简单实用、扩展方便、快速开发、RIA思路、轻量...

谢思华
2014/05/12
0
2
5 分钟掌握 JavaScript 实用窍门

简评:一开始 JavaScript 只是为网页增添一些实时动画效果,现在 JS 已经能做到前后端通吃了,而且还是年度流行语言。本文分享几则 JS 小窍门,可以让你事半功倍 ~ 1. 删除数组尾部元素 一个...

06/07
0
0
javascript实用技巧--数组.

数组和字符串类型对象的方法我特容易搞混淆,所以把他列出来,免得每次取查。 1、concat方法 [作用] 将多个数组联合起来,这个方法不会改变现存的数组,它只返回了所结合数组的一份拷贝。 [语...

晨曦之光
2012/03/09
0
0
JavaScript DOM编程艺术(读后感一)

1.平稳退化 网站访问者完全有可能使用的是不支持javascript的浏览器,或者是用户已经禁用。如果没有考虑这种情况,人们在访问网站时就有可能遇到麻烦,并因此不再来访问网站。如果正确的使用...

董广明
2014/02/25
0
0
四月前端知识集锦(每月不可错过的文章集锦)

目前自己组建的一个团队正在写一份面试图谱,将会在七月中旬开源。内容十分丰富,第一版会开源前端方面知识和程序员必备知识,后期会逐步写入后端方面知识。因为工程所涉及内容太多(目前已经...

夕阳
05/02
0
0
5分钟掌握JavaScript小技巧

译者按: 技巧虽好、重在掌握并使用起来! 原文: Learn these neat JavaScript tricks in less than 5 minutes 译者: Fundebug 为了保证可读性,本文采用意译而非直译。另外,本文版权归原作...

Fundebug
05/22
0
0
分享50个使你成为高级javascript开发者的jQuery的代码开发技巧

翻译:Terry li - GBin1.com 英文: 50 jQuery Snippets That Will Help You Become A Better JavaScript Developer 1. 创建一个嵌套的过滤器 .filter(":not(:has(.selected))") //去掉所有不......

gbin1
2011/07/05
0
0
编写更好的jQuery代码的建议

讨论jQuery和javascript性能的文章并不罕见。然而,本文我计划总结一些速度方面的技巧和我本人的一些建议,来提升你的jQuery和javascript代码。好的代码会带来速度的提升。快速渲染和响应意味...

MLeo
2014/02/07
0
0
编写更好的jQuery代码的建议及优化方法

讨论jQuery和javascript性能的文章并不罕见。然而,本文我计划总结一些速度方面的技巧和我本人的一些建议,来提升你的jQuery和javascript代码。好的代码会带来速度的提升。快速渲染和响应意味...

乐派电影
2014/04/12
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

Postfix命令行说明

Postfix tips and Troubleshooting Commands Here's a list of stuff I user everyday and other email admins will also be using, Let me know if I missed anything List/Print current m......

mingle
12分钟前
0
0
是时候使用Helm了:Helm, Kubernetes的包管理工具

目前我们的一个产品共有4套环境:dev环境、test环境、staging环境、production环境。 其中dev, test, staging环境在一个Kubernetes集群上以不同namespace部署,production环境部署在另一个Kub...

xiaomin0322
19分钟前
0
0
常见的redis的序列化方式

概括 一般redis的序列化方式主要有:字符串序列化、json序列化、xml序列化、jdk序列化,具体可查阅org.springframework.data.redis.serializer.RedisSerializer 的实现类,其中对于json序列化...

菜蚜
34分钟前
1
0
Linux bash入门

一、Linux Bash介绍 Bash是UNIX系统下的一个命令解析器,全称为Bourne-Again Shell是一个为GNU开源项目编写的Unix shell。bash功能强大,尤其是在处理自动循环或者耗时大的任务方面可以节省大...

老韭菜
37分钟前
0
0
Xamarin Essentials教程检查网络连通性Connectivity

Xamarin Essentials教程检查网络连通性Connectivity 网络连通性其实就是检测当前设备有没有连接网络。网络连通性在很多与网络相关的应用程序中会使用到。在Xamarin中如果要使用网络连通性,需...

大学霸
42分钟前
0
0
Redis的安装及创建节点、部署群集

Redis简介 Redis是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库,并提供多种语言的API。 Redis有着更为复杂的数据结构并且提供对他们的原子性操...

Java填坑之路
45分钟前
2
0
什么是Redux,为什么使用Redux,怎么使用Redux

1、什么是Redux 官方解释:Redux is a predictable state container for JavaScript apps. 意思就是Redux是js应用的 一种可预测的状态容器 2、为什么使用Redux 下面的图是不使用Redux和使用R...

kimyeongnam
48分钟前
0
0
与女儿谈商业模式之6:我要办电力公司

分类:与女儿谈商业模式 2007-10-11 10:12阅读(10149)评论(24) 与女儿谈商业模式之6:我要办电力公司 陈志武 刊登于2007年8月《创富志》 美国式商业模式的最大诀窍其实很简单,专门找人们每天...

祖冲之
48分钟前
1
0
Java-Map的遍历

package collection;/** * 遍历map的4种方法 */import java.util.HashMap;import java.util.Iterator;import java.util.Map;public class ErgodicMap {public static void main(S......

游人未归
58分钟前
1
0
RadioGroup 自动换行且保留点击事件

相信用过RadioGroup的同学都踩过很多坑,其中之一就是这个控件设计的不是很合理,不能设置里面的radiobutton的 排列方式(几行几列),导致我们开发的时候要调整里面的布局很是麻烦。 另外一...

丁佳辉
今天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部