• JS经典代码


    JS经典代码



    1. 将彻底屏蔽鼠标右键,无右键菜单

    <body oncontextmenu="window.event.returnvalue=false">

    也可以用于网页中Table框架中

    <table border oncontextmenu=return(false)><td>no</table>

    2.取消选取、防止复制

    <body onselectstart="return false">

    3.不准粘贴
    <body onpaste="return false">

    4.防止复制
    <body oncopy="return false;" oncut="return false;">

    5.IE地址栏前换成自己的图标
    <link rel="Shortcut Icon" href="favicon.ico">
    说明:关于favicon.ico文件的制作。你可以先在FW中做一个图片,属于你自己站点一个小图标。然后在ACD see将文件属性改为*.ico,然后将你做的*.ICO文件传到你的服务器目录中,然后就可以使用以上代码来实现,当别人登陆你的站点时,地址栏里使用 的就是你自定义的图标了。

    6.可以在收藏夹中显示出你的图标
    <link rel="Bookmark" href="favicon.ico">
    说明:制作方法和上面的一样。只是显示的方式不同,这个是在别人收藏你的网页地址时显示的个性图标。也很PP.

    7.关闭输入法
    <input style="ime-mode:disabled">
    说明:这段代码是在表格提交时用到的。也就是在输入数据时不可以使用其他输入法模式。

    8.永远都会带着框架
    <script language="javascript"><!--
    if (window == top)top.location.href = "frames.htm";// --></script>
    说明:frames.htm为你的网页,这也是保护页面的一种方法

    9.防止被人frame
    <SCRIPT LANGUAGE=javascript><!--
    if (top.location != self.location)top.location=self.location;
    // --></SCRIPT>

    10.网页将不能被另存为
    <noscript><iframe src=*.html></iframe></noscript>
    说明:<noscirpt>的用法很广,其中一条就是可以使JS广告失效。

    11.查源文件
    <input type=button value=查看网页源代码
    onclick="window.location = 'view-source:'+ http://www.wuchongyuan.com';"> 

    12.COOKIE脚本记录,有很大的用处哦
    function get_cookie(Name) {
    var search = Name + "="
    var returnvalue = "";
    if (documents.cookie.length > 0) {
    offset = documents.cookie.indexOf(search)
    if (offset != -1) { // if cookie exists
    offset += search.length
    // set index of beginning of value
    end = documents.cookie.indexOf(";", offset);
    // set index of end of cookie value
    if (end == -1)
    end = documents.cookie.length;
    returnvalue=unescape(documents.cookie.substring(offset, end))
    }
    }
    return returnvalue;
    }
    function loadpopup(){
    if (get_cookie('popped')==''){
    openpopup()
    documents.cookie="popped=yes"
    }
    }
    说明:以上是JS代码,请自己加起始符和结束符 

    13.内框架<IFRAME>使用
    Iframe标记的使用格式是:  
    <iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"
    name="main"></iframe>
    src:文件的路径,既可是HTML文件,也可以是文本、ASP等;   width、height:"内部框架"区域的宽与高; 
    scrolling:当SRC的指定的HTML文件在指定的区域不显不完时,滚动选项,如果设置为NO,则不出现滚动条;如为Auto:则自动出现滚动 条;如为Yes,则显示;  FrameBorder:区域边框的宽度,为了让“内部框架“与邻近的内容相融合,常设置为0。
    name:框架的名字,用来进行识别。
    比如:  当你想用父框架控制内部框架时,可以使用: target="框架的名字"来控制。
    例子:<iframe name="mm" src="http://www.wuchongyuan.com";; width="100%" height="100%" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no"></iframe> 

    14.自动跳转
    在源代码中的<head>…</head>加入如下代码:
    <meta http-equiv="refresh"content="3;URL=http://www.wuchongyuan.com; charset=gb2312">
    说明:content="3 表示3秒刷新到URL

    15.如何改变链接的鼠标形状
    只需在链接上加上这一代码就行的了
    或者跟上面的用CSS写也行
    style="cursor:hand"       style="cursor:crosshair"
    style="cursor:text"       style="cursor:wait"
    style="cursor:move"       style="cursor:help"
    style="cursor:e-resize"     style="cursor:n-resize"
    style="cursor:nw-resize"     style="cursor:w-resize"
    style="cursor:s-resize"     style="cursor:se-resize"
    style="cursor:sw-resize"
    以上代码你只需要加到连接或是页面的style区里就可以实现鼠标多样化。 

    16.全屏显示
    <form>
    <div align="center">
    <input type="BUTTON" name="FullScreen" value="全屏显示" onClick="window.open(document.location, 'big', 'fullscreen=yes')">
    </div>
    </form>
    把它放到<body>区中。

    17.设为首页
    <script language="javascript">
    <!--
    function defaul_home(){
    this.home.style.behavior='url(#default#homepage)';this.home.setHomePage(http://myok.bokee.com/';);
    }
    var focusok=false;
    if (navigator.appName == "Netscape"){
    focusok=true;
    }
    vers=navigator.appVersion;
    if (navigator.appName == "Microsoft Internet Explorer"){
    pos=vers.lastIndexOf('.');
    vers=vers.substring(pos-1,vers.length);
    }
    proper_version=parseFloat(vers);
    if(proper_version>=5){
    focusok=true;
    }
    function launchstock1(htmlurl){
    var stock=window.open(htmlurl,"stock","top=2,left=2,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,
    resizable=no,width=700,height=510");
    if(focusok){
    stock.focus();
    }
    return true;
    }
    function launchstock(){
    var stock=window.open("","stock","top=2,left=2,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,
    resizable=no,width=700,height=510");
    if(focusok){
    stock.focus();
    }
    return true;
    }
    // -->
    </script>
    <a href="#" name="home" onClick="defaul_home();" title="==吴崇源市场营销网站==">设为首页</a>

    18.这里是加入收藏夹的代码
    <a href="#" onClick="window.external.addFavorite(http://www.wuchongyuan.com';.'-=吴崇源 市场营销网站=-')" target="_self" title="-=吴崇源市场营销=-">加入收藏夹</a> 

    19.flash图片效果
    以下代码加入<head>区域
    <SCRIPT language="javascript">
    <!--
    function makevisible(cur,which){
    if (which==0)
    cur.filters.alpha.opacity=100
    else
    cur.filters.alpha.opacity=20
    }
    //-->
    </SCRIPT>
    以下代码加入<body>区域
    <img src="http://www.wuchongyuan.com/images/logo.gif";; style="filter:alpha(opacity=20)" onMouseOver="makevisible(this,0)" onMouseOut="makevisible(this,1)" width="63" height="56"> //图片地址请自己改

    20.背景图片滚动
    <body scroll="no" background="images/bg.jpg" link="#00FF00" alink="#FF0000" vlink="#00FF00" bgcolor="#000080" topmargin="8">
    <script language="javascript">
    var backgroundOffset = 0;
    var bgObject = eval_r('document.body');
    function scrollBG(maxSize) {backgroundOffset = backgroundOffset + 1;
    if (backgroundOffset > maxSize) backgroundOffset = 0;
    bgObject.style.backgroundPosition = "0 " + backgroundOffset;}
    var ScrollTimer = window.setInterval("scrollBG(410)", 20)
    </script>

    21.滚动特效
    <marquee onMouseOver="this.stop()" onMouseOut="this.start()" scrollamount="2" scrolldelay="0" direction="up" width="330" height="120" border="0" align="center" id="MARQUEE1">
    欢迎光临吴崇源市场营销网站
    我们地址http://www.wuchongyuan.com
    </marquee>

    22.让背景图不滚动

    IE浏览器支持一个 Body 属性 bgproperties,它可以让背景不滚动:
    〈Body Background="图片文件" bgproperties="fixed"〉

    23.让你的网页无法另存为

    <noscript><iframe src=*></iframe></noscript>

    24.让IFRAME框架内的文档的背景透明

    <iframe src="about :<body style='background:transparent'>" allowtransparency></iframe>

    25.禁止右键:

    <body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return false"onmouseup="document.selection.empty()">

    26.进入页面后立即自动刷新?
    <meta http-equiv="refresh" content="120;url=http://www.wuchongyuan.com">
    http://www.wuchongyuan.com,这是你自己的网址。

    27.隐藏IFRAME的滚动条三种方法:

    1. 设置iframe scrolling="no"
    2. 被包含页body应用overflow:hidden
    3. 被包含页的body标签加scroll="no"

    28.加入背景音乐
    <bgsound src="mid/min1.mid" loop="-1"> 只适用于IE
    <embed src="music.mid" loop="true" hidden="true"> 对Netscape ,IE 都适用

    29.滚动
    <MARQUEE direction=up height=146 onmouseout=start() onmouseover=stop() scrollAmount=4></marquee>

    30.细线分隔线
    <hr noshade size=0 color=#C0C0C0>

    31.过度方式
    <meta http-equiv="Page-Exit" content="revealTrans(Duration=3,Transition=5)">
    Duration的值为网页动态过渡的时间,单位为秒。
    Transition是过渡方式,它的值为0到23,分别对应24种过渡方式。如下表:
    0 盒状收缩 1 盒状放射
    2 圆形收缩 3 圆形放射
    4 由下往上 5 由上往下
    6 从左至右 7 从右至左
    8 垂直百叶窗 9 水平百叶窗
    10 水平格状百叶窗 11垂直格状百叶窗
    12 随意溶解 13从左右两端向中间展开
    14从中间向左右两端展开 15从上下两端向中间展开
    16从中间向上下两端展开 17 从右上角向左下角展开
    18 从右下角向左上角展开 19 从左上角向右下角展开
    20 从左下角向右上角展开 21 水平线状展开
    22 垂直线状展开 23 随机产生一种过渡方式

    32.如何控制横向和纵向滚动条的显隐?
    <body style="overflow-y:hidden"> 去掉x轴
    <body style="overflow-x:hidden"> 去掉y轴
    <body scroll="no">不显

    33.加入注释的格式是:  
    〈!-[注释内容…]--〉

    34.怎样在网页中加入 E-mail 链接并显示预定的主题?
    〈A href="wuchongyuan@126.com?subject=主题"〉……〈/a〉

    35.定义本网页关键字,可以在〈Head〉〈/Head〉中加入如下代码:  
    〈meta name="Keywords" content="吴崇源市场营销网站"〉
    Content 中所包含的就是关键字,你可以自行设置。
    这里有个技巧,你可以重复某一个单词,这样可以提高自己网站的排行位置,如:
    〈meta name="Keywords" content="吴崇源市场营销"〉

    36.添加到收藏夹:
    〈a href="java script:window.external.addFavorite(http://www.wuchongyuan.com','http: //www.wuchongyuan.com');"〉添加到收藏夹〈/a〉

    37.设为首页:
    〈a href=# onclick=this.style.behavior='url(#default#homepage)'; this.setHomePage(http://www.wuchongyuan.com);〉设为首页〈/a〉

    38.定制浏览器地址栏前的小图标:
    A:在网页的〈head〉〈/head〉间加入以下语句:
    〈link rel="shortcuticon" href="http://…/icon.ico"〉
    即可。其中 icon.ico 为 16x16 的图标文件,颜色不要超过 16 色。

    39.表格的分隔线可以隐藏
    <table border rules=cols cellspacing=0 align=left> 可以隐藏横向的分隔线
    <table border rules=rows cellspacing=0 align=right>可以隐藏纵向的分隔线

    <table border rules=none cellspacing=0 align=center>可以隐藏横向和纵向的分隔线

    40.表格的边框不断在闪

    以下方法可以令表格的边框不断在闪,很实用的

    在BODY区加上

    <table border="0" width="280" id="myexample"
    style="border:5px solid yellow">

    <tr>

    <td>加入任意的物件.加入任意的物件.

    <br>加入任意的物件.加入任意的物件.

    <br>加入任意的物件.加入任意的物件.</td>

    </tr>

    </table>

    <script language="JavaScript1.2">

    <!--

    function flashit(){

    if (!document.all)

    return

    if (myexample.style.borderColor=="yellow")

    myexample.style.borderColor="lime"

    else

    myexample.style.borderColor="yellow"

    }

    setInterval("flashit()", 500)

    //-->

    </script>

    41.普通表格

    <table border="1" width="220" style="position: absolute; left:
    11; top: 11" height="26" >

    来源:(http://blog.sina.com.cn/s/blog_5cd9e1790100bgtv.html) - 经典代码_优值互联_新浪博客

    <tr>

    <td width="100%">普通表格</td>

    </tr>

    </table>

    42.正立方表格

    <table border="1" width="220" bordercolorlight="#eeeeee"
    bordercolordark="#000000" style="position: absolute; left: 10; top:
    49" height="26">

    <tr>

    <td width="100%">正立方表格</td>

    </tr>

    </table>

    43.细表格

    <table border="0" frame=vsides width="219"
    bgcolor="#000000" cellspacing="1" cellpadding="0"
    height="22" style="position: absolute; left: 11; top: 86">

    <tr bgcolor="#FFFFFF">

    <td width="100%" height="2">细表格</td>

    </tr>

    </table>

    44.立体表格

    <table border="1" width="220" bordercolorlight="#ffffff"
    bordercolordark="#ffffff" style="position: absolute; left: 10; top:
    112" height="34">

    <tr>

    <td width="100%" bgcolor="#B7B7B7"
    bordercolorlight="#000000" bordercolordark="#eeeeee" >立体表格</td>

    </tr>

    </table>

    45.无名表格

    <table width="220" align="center" style="position: absolute;
    left: 246; top: 12" height="51">

    <tr>

    <td><fieldset style="220" align="center">
    <legend> 无名表格 </legend>  <p align="right"> </fieldset>
    <br>

    </td>

    </tr>

    </table>

    46.表中表效果Ⅱ

    <table width="220" align="center" style="position:
    absolute; left: 245; top: 89" height="110">
    <tr>
    <td height="75"><fieldset style="220"
    align="center"> <legend> 表中表效果Ⅱ </legend> <table
    frame="hsides" border="1"
    bordercolorlight="#000000" bordercolordark="#ffffff"
    width="100%" cellspacing="1" cellpadding="0" height="78">
    <tr bgcolor="#ffffff">
    <td width="100%" height="76"></fieldset></td>
    </tr>
    </table>

    47.表中表效果Ⅰ

    <table width="220" align="center" style="position: absolute;
    left: 10; top: 120" height="138" cellspacing="1"
    cellpadding="0">

    <tr>

    <td height="126"><fieldset style=" 220; color: #B7B7B7;
    border-style: groove" align="center"> <legend style="color:
    #FFFFFF; border: 1 solid #808080" > <font color="#000000">表中表效果Ⅰ</font>
    </legend>  <p align="right"> </fieldset>

    </td>

    </tr>

    </table>

    48.表格中边框的显示

    只显示上边框 <table frame=above>
    只显示下边框 <table frame=below>
    只显示左、右边框 <table frame=vsides>
    只显示上、下边框 <table frame=hsides>
    只显示左边框 <table frame=lhs>
    只显示右边框 <table frame=rhs>
    不显示任何边框 <table frame=void>
    </body>
    </html></body>
    </html></body>
    </html>

    制作移动文字,特此说明一点就是把代码中的*去掉就可以了

    <*i><*font size=3 color=Red><*b>今天<*/b><*font size=4 color=Blue>天气<*/font><*font size=5 color=Fuchsia>真好!<*/font> <*/font><*/i>
    今天天气真好!

    今天天气真好!

    <*/marquee><*marquee directio=left>啦啦啦,我从右向左移!<*/marquee>

    啦啦啦,我从右向左移!

    <*marquee direction=right>啦啦啦,我从左向右移!<*/marquee>
    啦啦啦,我从左向右移!

    <*marquee direction=up>啦啦啦,我从下向上移!<*/marquee>

    啦啦啦,我从下向上移!

    <*marquee direction=down>啦啦啦,我从上向下移!<*/marquee>

    啦啦啦,我从上向下移!

    #=scroll, slide, alternate<*marquee behavior=scroll>啦啦啦,我一圈一圈绕着走!
    啦啦啦,我一圈一圈绕着走!

    #=scroll, slide, alternate 啦啦啦,我一圈一圈绕着走!
    啦啦啦,我一圈一圈绕着走!

    <*marquee behavior=slide>啦啦啦,我只走一次就歇了!<*/marquee>

    啦啦啦,我只走一次就歇了!

    <*marquee behavior=alternate>啦啦啦,我来回走耶!<*/marquee>

    啦啦啦,我来回走耶!

    <*loop=#> #=次数;若未指定则循环不止(infinite)<*marquee loop=3 behavior=scroll>啦啦啦,我只走 3 趟哟!<*/marquee>

    #=次数;若未指定则循环不止(infinite) 啦啦啦,我只走 3 趟哟!

    <*scrollamount=#><*marquee scrollamount=20>改变scrollamount=的数值看看我的速度变化<*/marquee>

    改变scrollamount=的数值看看我的速度变化

    改变scrollamount=的数值看看我的速度变化

    <*scrolldelay=#><*marquee scrolldelay=500 scrollamount=100>我走一步,停一停!改变数值看看变化<*/marquee>
    我走一步,停一停!改变数值看看变化

    我走一步,停一停!改变数值看看变化

    <*align=#> #=top, middle, bottom
    <*font size=6><*marquee align=# width=400>啦啦啦,我会移动耶!<*/font> 底色 #=rrggbb 16 进制数码,或者是预定义色彩:<*marquee bgcolor=Aqua>啦啦啦,我会移动耶!<*/marquee>

    #=top, middle, bottom
    啦啦啦,我会移动耶! 底色 #=rrggbb 16 进制数码,或者是预定义色彩: 啦啦啦,我会移动耶!

    什么是网站 ICO 图标?
    打开微软、百度等网站后看到浏览器的标题栏、地址栏,多浏览器的标签上都显示了一个小图标,如 ,这里说的就是这个东东。如果用户收藏了网站,这个图标还 会出现在用户收藏夹里。

      如何制作 ICO 图标?

      这里使用最简单的办法。因为 ico 格式图片比较特殊,一般软件(如 Windows 自带的画图、Adobe Photoshop 等)都制作不了,我们就分两步做。

      第一步是用 Windows 自带的画图或 Adobe Photoshop 制作一个 ico 的原图,格式可以是 jpg / jpeg / gif / png 等,大小大概在 32×32 像素差不多,最好是 16px×16px 的,因为浏览器标题栏和地址栏上显示的就是这个尺寸。

      第二步是将制作好的 ico 原图转换为 ico 格式,制作好后去一个可以在线转换 ico 格式的网站(百度一下会有不少,也可以下载一个转换软件进行处理)。这里推荐 http://www.bitbug.net/ ,打开该网站后界面很清晰明了,经数秒简单的处理即可转换为我们要的 ico 格式图标文件,文件被自动命名为 favicon.ico。

      这样 ico 图标就制作完成了。

      如何让 ICO 图标在网站上显示?

      在需要显示该图标的页面模板头部(<head> 与 </head> 之间)插入以下代码:

    <link rel="Shortcut Icon" href="/bbs/favicon.ico">

  • 相关阅读:
    Linux查看CPU信息
    sed总结
    angularjs学习笔记--service、$http、$scope、angularjs指令、事件、api
    angularjs学习笔记--ng-model、controller、DI、$scope、$provide
    angularjs学习笔记--$http、数据渲染到表格、路由、依赖注入、provider
    angularjs学习笔记--主html&template html&module&template js、模块、控制器、双向数据绑定、过滤器
    angularjs学习笔记--视图、模板、组件、$http、$q、module
    angular学习笔记---下载并运行nicefish项目
    angular学习笔记---通过angular/cli建一个新的项目
    json模拟数据交互
  • 原文地址:https://www.cnblogs.com/nianshi/p/1760364.html
Copyright © 2020-2023  润新知