JS代码经典实例集合

document.execCommand()函数可用参数大解析
2D-Position 允许通过拖曳移动绝对定位的对象。
AbsolutePosition 设定元素的 position属性为“absolute”(绝对)。
BackColor 设置或获取当前选中区的背景颜色。
BlockDirLTR 目前尚未支持。
BlockDirRTL 目前尚未支持。
Bold 切换当前选中区的粗体显示与否。
BrowseMode 目前尚未支持。
Copy 将当前选中区复制到剪贴板。
CreateBookmark创建一个书签锚或获取当前选中区或插入点的书签锚的名称。
CreateLink在当前选中区上插入超级链接，或显示一个对话框允许用户指定要为当前选中区插入的超级链接的URL。
Cut 将当前选中区复制到剪贴板并删除之。
Delete 删除当前选中区。
DirLTR 目前尚未支持。
DirRTL 目前尚未支持。
EditMode 目前尚未支持。
FontName 设置或获取当前选中区的字体。
FontSize 设置或获取当前选中区的字体大小。
ForeColor 设置或获取当前选中区的前景(文本)颜色。
FormatBlock 设置当前块格式化标签。
Indent 增加选中文本的缩进。
InlineDirLTR 目前尚未支持。
InlineDirRTL 目前尚未支持。
InsertButton 用按钮控件覆盖当前选中区。
InsertFieldset 用方框覆盖当前选中区。
InsertHorizontalRule 用水平线覆盖当前选中区。
InsertIFrame 用内嵌框架覆盖当前选中区。
InsertImage 用图像覆盖当前选中区。
InsertInputButton 用按钮控件覆盖当前选中区。
InsertInputCheckbox 用复选框控件覆盖当前选中区。
InsertInputFileUpload 用文件上载控件覆盖当前选中区。
InsertInputHidden 插入隐藏控件覆盖当前选中区。
InsertInputImage 用图像控件覆盖当前选中区。
InsertInputPassword 用密码控件覆盖当前选中区。
InsertInputRadio 用单选钮控件覆盖当前选中区。
InsertInputReset 用重置控件覆盖当前选中区。
InsertInputSubmit 用提交控件覆盖当前选中区。
InsertInputText 用文本控件覆盖当前选中区。
InsertMarquee 用空字幕覆盖当前选中区。
InsertOrderedList 切换当前选中区是编号列表还是常规格式化块。
InsertParagraph 用换行覆盖当前选中区。
InsertSelectDropdown 用下拉框控件覆盖当前选中区。
InsertSelectListbox 用列表框控件覆盖当前选中区。
InsertTextArea 用多行文本输入控件覆盖当前选中区。
InsertUnorderedList切换当前选中区是项目符号列表还是常规格式化块。
Italic 切换当前选中区斜体显示与否。
JustifyCenter 将当前选中区在所在格式化块置中。
JustifyFull 目前尚未支持。
JustifyLeft 将当前选中区所在格式化块左对齐。
JustifyNone 目前尚未支持。
JustifyRight 将当前选中区所在格式化块右对齐。
MultipleSelection 允许当用户按住 Shift 或 Ctrl键时一次选中多于一个站点可选元素。
Open 目前尚未支持。
Outdent 减少选中区所在格式化块的缩进。
OverWrite 切换文本状态的插入和覆盖。
Paste 用剪贴板内容覆盖当前选中区。
PlayImage 目前尚未支持。
Print 打开打印对话框以便用户可以打印当前页。
Redo 目前尚未支持。
Refresh 刷新当前文档。
RemoveFormat 从当前选中区中删除格式化标签。
RemoveParaFormat 目前尚未支持。
SaveAs 将当前 Web 页面保存为文件。
SelectAll 选中整个文档。
SizeToControl 目前尚未支持。
SizeToControlHeight 目前尚未支持。
SizeToControlWidth 目前尚未支持。
Stop 目前尚未支持。
StopImage 目前尚未支持。
StrikeThrough 目前尚未支持。
Subscript 目前尚未支持。
Superscript 目前尚未支持。
UnBookmark 从当前选中区中删除全部书签。
Underline 切换当前选中区的下划线显示与否。
Undo 目前尚未支持。
Unlink 从当前选中区中删除全部超级链接。
Unselect 清除当前选中区的选中状态。
漂浮的广告
<div id="ad" style="position:absolute"><a href=" http://www.newtoefl.com.cn/student/online_study.asp"><img src="img/tp.jpg" border="0" /></a></div>
  <script>
  var x = 50,y = 60
  var xin = true, yin = true
  var step = 1
  var delay = 50
  var obj=document.getElementById("ad")
  function floatAD(){
    var L=T=0
    var R= document.body.clientWidth-obj.offsetWidth
    var B = document.body.clientHeight-obj.offsetHeight
    obj.style.left = x + document.body.scrollLeft
    obj.style.top = y + document.body.scrollTop
    x = x + step*(xin?1:-1) 
    if (x < L) { xin = true; x = L}
    if (x > R){ xin = false; x = R}
    y = y + step*(yin?1:-1)
    if (y < T) { yin = true; y = T }
    if (y > B) { yin = false; y = B }
  }
  var itl= setInterval("floatAD()", delay)
 obj.οnmοuseοver=function floatStop(){}
 obj.οnmοuseοut=function(){itl=setInterval("floatAD()",delay)}
  </script>
防止你的站点被非法连接
有时候一些人会将你网站上的内容直接“frame”到他的一个子页面去，很讨厌（虽然已经老土的像文物了，但偶尔还是有人会用），那么就试试下面的办法吧

<SCRIPT LANGUAGE=JAVASCRIPT>
<!--
if (top.location !== self.location) {
top.location=self.location;
}
-->
</SCRIPT>
 
把这段代码放在你的页面里，再看看？

图片无缝滚动的完美解决
   想 必大家都注意到<marquee>的不循环滚动，所以出现了很多替代脚本，或iframe或JS输出<marquee>，不管怎 么做，都略显麻烦。下面说一下这个相对简单的实现思路：一个设定宽度并且隐藏超出它宽度的内容的容器demo，里面放demo1和demo2，demo1 是滚动内容,demo2为demo1的直接克隆，通过不断改变demo1的scrollTop或者scrollLeft达到滚动的目的，当滚动至 demo1与demo2的交界处时直接跳回初始位置，因为demo1与demo2一样，所以分不出跳动的瞬间，从而达到“无缝”滚动的目的。
先了解一下对象的几个的属性：
innerHTML:设置或获取位于对象起始和结束标签内的 HTML
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop属性指定的父坐标的计算顶端位置
offsetWidth:获取对象相对于版面或由父坐标 offsetParent属性指定的父坐标的宽度

好，先看这个向上滚动的代码：

<div id=demostyle=overflow:hidden;height:100;width:90;background:#214984;color:#ffffff>
<div id=demo1>滚动内容</div>
<div id=demo2></div>
</div>
<script>
   var speed=30
  demo2.innerHTML=demo1.innerHTML file://克隆demo1为demo2
   function Marquee(){
  if(demo2.offsetTop-demo.scrollTop<=0)file://当滚动至demo1与demo2交界时
  demo.scrollTop-=demo1.offsetHeight  file://demo 跳到最顶端
   else{
   demo.scrollTop++
   }
   }
   varMyMar=setInterval(Marquee,speed) file://设置定时器
   demo.οnmοuseοver=function(){clearInterval(MyMar)}//鼠标移上时清除定时器达到滚动停止的目的
   demo.οnmοuseοut=function(){MyMar=setInterval(Marquee,speed)}//鼠标移开时重设定时器
</script>

 

向下滚动：

  <div id=demostyle=overflow:hidden;height:100;width:90;background:#214984;color:#ffffff>
  <div id=demo1>滚动内容</div>
  <div id=demo2></div>
  </div>
  <script>
    varspeed=30
   demo2.innerHTML=demo1.innerHTML
   demo.scrollTop=demo.scrollHeight
    functionMarquee(){
   if(demo1.offsetTop-demo.scrollTop>=0)
   demo.scrollTop+=demo2.offsetHeight
    else{
   demo.scrollTop--
    }
    }
    varMyMar=setInterval(Marquee,speed)
   demo.οnmοuseοver=function() {clearInterval(MyMar)}
   demo.οnmοuseοut=function() {MyMar=setInterval(Marquee,speed)}
  </script>

 

向左滚动：

<div id=demostyle=overflow:hidden;height:33;width:500;background:#214984;color:#ffffff>
  <table align=left cellpadding=0 cellspace=0border=0>
   <tr>
     <td id=demo1 valign=top>滚动内容</td>
     <td id=demo2 valign=top></td>
   </tr>
  </table>
</div>
<script>
  var speed=30
  demo2.innerHTML=demo1.innerHTML
  function Marquee(){
 if(demo2.offsetWidth-demo.scrollLeft<=0)
  demo.scrollLeft-=demo1.offsetWidth
  else{
  demo.scrollLeft++
  }
  }
  var MyMar=setInterval(Marquee,speed)
  demo.οnmοuseοver=function(){clearInterval(MyMar)}
  demo.οnmοuseοut=function(){MyMar=setInterval(Marquee,speed)}
</script>

 

向右滚动：

<div id=demostyle=overflow:hidden;height:33;width:500;background:#214984;color:#ffffff>
<table align=left cellpadding=0 cellspace=0 border=0>
  <tr>
    <tdid=demo1 valign=top>滚动内容</td>
    <tdid=demo2 valign=top></td>
  </tr>
</table>
</div>
<script>
  var speed=30
  demo2.innerHTML=demo1.innerHTML
  demo.scrollLeft=demo.scrollWidth
  function Marquee(){
  if(demo.scrollLeft<=0)
  demo.scrollLeft+=demo2.offsetWidth
  else{
  demo.scrollLeft--
  }
  }
  var MyMar=setInterval(Marquee,speed)
  demo.οnmοuseοver=function(){clearInterval(MyMar)}
  demo.οnmοuseοut=function(){MyMar=setInterval(Marquee,speed)}
</script>
 
双击自动滚屏
var currentpos,timer;
function initialize()
{
timer=setInterval("scrollwindow()",10);
}
function sc(){
clearInterval(timer);
}
function scrollwindow()
{
currentpos=document.body.scrollTop;
window.scroll(0,++currentpos);
if (currentpos != document.body.scrollTop)
sc();
}
document.οnmοusedοwn=sc
document.οndblclick=initialize

查看网页源代码
<SCRIPT>
function add(src)
{
window.location="view-source:"+src;
}
</SCRIPT>

弹出窗口全参数
【1、最基本的弹出窗口代码】
其实代码非常简单：
<SCRIPT LANGUAGE=javascript>
<!--
  window.open ("page.html")
-->
</SCRIPT>

   因 为这是一段javascripts代码，所以它们应该放在<SCRIPTLANGUAGE=javascript >标签和</script>之间。<!-- 和-->是对一些版本低的浏览器起作用，在这些老浏览器中不会将标签中的代码作为文本显示出来。要养成这个好习惯啊。window.open (page.html)用于控制弹出新的窗口page.html，如果page.html不与主窗口在同一路径下，前面应写明路径，绝对路径 (http://和相对路径(../)均可。用单引号和双引号都可以，只是不要混用。这一段代码可以加入HTML的任意位置，<head> 和</head>之间可以，<body>间</body>也可以，越前越早执行，尤其是页面代码长，又想使页面早点 弹出就尽量往前放。

【2、经过设置后的弹出窗口】
   下面再说一说弹出窗口的设置。只要再往上面的代码中加一点东西就可以了。我们来定制这个弹出的窗口的外观，尺寸大小，弹出的位置以适应页面的具体情况。
<SCRIPT LANGUAGE=javascript>
<!--
 window.open("page.html","newwindow","height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no")// 写成一行
-->
</SCRIPT>

参数解释：
<SCRIPT LANGUAGE=javascript> js脚本开始；
window.open 弹出新窗口的命令；
page.html 弹出窗口的文件名；
newwindow 弹出窗口的名字（不是文件名），非必须，可用空代替；
height=100 窗口高度；
width=400 窗口宽度；
top=0 窗口距离屏幕上方的象素值；
left=0 窗口距离屏幕左侧的象素值；
toolbar=no 是否显示工具栏，yes为显示；
menubar，scrollbars 表示菜单栏和滚动栏；
resizable=no 是否允许改变窗口大小，yes为允许；
location=no 是否显示地址栏，yes为允许；
status=no是否显示状态栏内的信息（通常是文件已经打开），yes为允许；
</SCRIPT> js脚本结束

【3、用函数控制弹出窗口】
下面是一个完整的代码。
<html>
<head>
<script LANGUAGE=JavaScript>
<!--
  function openwin(){
   window.open("page.html","newwindow","height=100,width=400,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no")// 写成一行
  }
//-->
</script>
</head>
<body οnlοad=openwin()>
...任意的页面内容...
</body>
</html>

   这里定义了一个函数openwin(),函数内容就是打开一个窗口。在调用它之前没有任何用途。怎么调用呢？

方法一：<body οnlοad=openwin()>浏览器读页面时弹出窗口；
方法二：<body οnunlοad=openwin()>浏览器离开页面时弹出窗口；
方法三：用一个连接调用： <a href=#onClick=openwin()>打开一个窗口</a>注意：使用的“#”是虚连接。
方法四：用一个按钮调用： <input type=button οnclick=openwin()value=打开窗口>

【4、同时弹出2个窗口】
对源代码稍微改动一下：
<script LANGUAGE=JavaScript>
<!--
  function openwin(){
   window.open("page.html","newwindow","height=100,width=100,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no")// 写成一行
   window.open("page2.html","newwindow2","height=100,width=100,top=100,left=100,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no")// 写成一行
  }
//-->
</script>

   为避免弹出的2个窗口覆盖，用top和left控制一下弹出的位置不要相互覆盖即可。
   最后用上面说过的四种方法调用即可。注意：2个窗口的name(newwindows和newwindow2)不要相同，或者干脆全部为空。OK？

【5、主窗口打开文件1.htm，同时弹出小窗口page.html】
如下代码加入主窗口<head>区：
<script language=javascript>
<!--
  function openwin(){
   window.open("page.html","","width=200,height=200")
  }
//-->
</script>
加入<body>区：open即可。

【6、弹出的窗口之定时关闭控制】
下 面我们再对弹出的窗口进行一些控制，效果就更好了。如果我们再将一小段代码加入弹出的页面(注意是加入到page.html的HTML中，可不是主页面 中，否则...)，让它10秒后自动关闭是不是更酷了？首先，将如下代码加入page.html文件的<head>区：
<script language=JavaScript>
<!--
  function closeit(){
   setTimeout(self.close(),10000) //毫秒
  }
</script>
然后，再用<bodyοnlοad=closeit()>这一句话代替page.html中原有的<BODY>这一句就可以了。(这一句话千万不要忘记写啊！这一句的作用是调用关闭窗口的代码，10秒钟后就自行关闭该窗口。)

【7、在弹出窗口中加上一个关闭按钮】
<FORM>
<INPUT TYPE=BUTTON VALUE=关闭 onClick=window.close()>
</FORM>
呵呵，现在更加完美了！

【8、内包含的弹出窗口-一个页面两个窗口】
上面的例子都包含两个窗口，一个是主窗口，另一个是弹出的小窗口。通过下面的例子，你可以在一个页面内完成上面的效果。
<html>
<head>
<SCRIPT LANGUAGE=JavaScript>
  function openwin(){
   OpenWindow=window.open("","newwin","height=250,width=250,toolbar=no,scrollbars=+scroll+,menubar=no");//写成一行
   OpenWindow.document.write("<TITLE>例子</TITLE>")
   OpenWindow.document.write("<BODY BGCOLOR=#ffffff>")
   OpenWindow.document.write("<h1>Hello!</h1>")
   OpenWindow.document.write("New window opened!")
   OpenWindow.document.write("</BODY>")
   OpenWindow.document.write("</HTML>")
   OpenWindow.document.close()
  }
</SCRIPT>
</head>
<body>
打开一个窗口 <input type=button οnclick=openwin()value=打开窗口>
</body>
</html>
看看OpenWindow.document.write()里面的代码不就是标准的HTML吗？只要按照格式写更多的行即可。千万注意多一个标签或少一个标签就会出现错误。记得用OpenWindow.document.close()结束啊。

【9、终极应用--弹出的窗口之Cookie控制】
   回 想一下，上面的弹出窗口虽然酷，但是有一点小毛病(沉浸在喜悦之中，一定没有发现吧？)比如你将上面的脚本放在一个需要频繁经过的页面里(例如首页)，那 么每次刷新这个页面，窗口都会弹出一次，是不是非常烦人？:-(有解决的办法吗？Yes! ;-) Follow me.我们使用cookie来控制一下就可以了。
   首先，将如下代码加入主页面HTML的<HEAD>区：
<script>
  function openwin(){
   window.open("page.html","","width=200,height=200")
  }
  function get_cookie(Name){
    var search =Name + = var returnvalue = ;
    if(document.cookie.length > 0){
     offset = document.cookie.indexOf(search)
     if (offset != -1){
       offset += search.length
       end = document.cookie.indexOf(;, offset);
       if (end == -1) end = document.cookie.length;
       returnvalue=unescape(document.cookie.substring(offset, end))
     }
    }
    returnreturnvalue;
  }
  function loadpopup(){
   if(get_cookie(popped)==){
     openwin()
     document.cookie=popped=yes
    }
  }
</script>
然 后，用<bodyοnlοad=loadpopup()>（注意不是openwin而是loadpop啊！）替换主页面中原有的< BODY>这一句即可。你可以试着刷新一下这个页面或重新进入该页面，窗口再也不会弹出了。真正的Pop-Only-Once！写到这里弹出窗口的 制作和应用技巧基本上算是完成了

禁止复制代码
function click() {
alert('禁止你的左键复制！') }
function click1() {
if (event.button==2) {alert('禁止右键点击~！') }}
function CtrlKeyDown(){
if (event.ctrlKey) {alert('不当的拷贝将损害您的系统！') }}
document.οnkeydοwn=CtrlKeyDown;
document.onselectstart=click;
document.οnmοusedοwn=click1;
 
禁止浏览器报错
function killErrors() {
  return true;
}

window.onerror = killErrors;