代码如下:<!doctype html><html> <head> <title>canvas dClock</title> </head> <body> <canvas id = "clock" width = "500px" height = "200px"> 您的浏览器太古董了，升级吧！ </canvas> <script type = "text/javascript"> var clock = document.getElementById("clock"); var cxt = clock.getContext("2d"); //显示数字时钟 fu...
代码如下:<canvas id="myCanvas" width=”300” height=”200” style="border:1px solid #c3c3c3;"> Your browser does not support the canvas element. </canvas> <script type="text/javascript"> var myCanvas = document.getElementById("myCanvas"); if (!myCanvas.getContext) { alert("你的浏览器不支持Canvas."); } else { alert("你的浏览器支持Canvas."); } </script>
向大家分享一款如何实现js版连连看游戏，如下图所示： 首先看一下html的布局方式在index.html文件中： 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>连连看</title> <link rel="stylesheet" type="text/css" href="css/index.css"/> </hea...
代码如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <SCRIPT LANGUAGE="JavaScript"> <!-- function setfocus() { txt.focus(); // 或者 // document.getElementById("txt").focus(); } //--> </SCRIPT...
开始前的html页面 开始后的html游戏界面 html页面布局，即index.html文件源码如下： 代码如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>弹球游戏</title> <link rel="stylesheet" type="text/css" href="css/index.css"/> </head> <body> <center> <div id="gamePanel" tabin...
js 代码如下:var popupStatus = 0; //loading popup with jQuery magic! function loadPopup(){ //loads popup only if it is disabled if(popupStatus==0){ $("#backgroundPopup").css({ "opacity": "0.7" }); $("#backgroundPopup").fadeIn("slow"); $("#popupContact").fadeIn("slow"); popupStatus = 1; } } //disabling popup with jQuery magic! function disablePopup(){ //disables popup only if it is enabled if(popup...
方法一：用CSS截断字符串：IE,FireFox，Opera ，Safari都兼容 代码如下:.subLongText{ width:150px; height:24px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-overflow: ellipsis;/* IE/Safari */ -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis;/* Opera */ -moz-binding: url("ellipsis.xml#ellipsis");/*FireFox*/ } <span class="subLongText">任意长度文本</span> 方法二：用js截取 代...
代码如下:nav1 = "<div style='width:145px;height:62px;float:left;background:url(login_image/index/on_1.jpg);font-size:18px;color:white;line-height:65px;' id='left_tab" + "</div>" 代码如下: $("#top_1").html(nav1);说明：top_1是body中的一个div的ID！
代码如下:function setContent(str) {str = str.replace(/<\/?[^>]*>/g,); //去除HTML tagstr.value = str.replace(/[ | ]*\n/g,\n); //去除行尾空白//str = str.replace(/\n[\s| | ]*\r/g,\n); //去除多余空行return str;} 测试的时候发现这段代码不能过滤掉网页中空格字符(即： )。于是自己又改造了一下： 代码如下:function removeHTMLTag(str) { str = str.replace(/<\/?[^>]*>/g,); //去除HTML tag str...
第一次用到这个，做个记录，在html页面中调用本地程序： 代码如下:<html> <head> <script language="javascript"> function Run(strPath) { var objShell = new ActiveXObject("wscript.shell"); objShell.exec(strPath); objShell = null; } </script> </head> <body> 请输入要运行的程序路径：<br> <input name=exe type=text size=20 value="D:\\a.doc"> <BUTTON class=button onclick="Run(exe.value)">确定</BUTTON> </body>...
今天研究了一下JS的用setAttribute方法实现一个页面两份样式表的效果，具体方法如下： 第一步：在连接样式表的元素里定义一个id,例如 代码如下:<link href=”1.css” rel=”stylesheet” type=”text/css” id=”css”> 我定义的id是css。 第二步：写一个js函数，代码如下： 代码如下:<script type=”text/javascript”> function change(a){ var css=document.getElementById(“css”); if (a==1) css.setAttribute(“href”,”...
功能： 单击单元格选中，选中过程中使用方向键更换选中的单元格，选中过程中按回车键或者直接双击单元格进入可编辑状态，单元格失去焦点时保存修改的内容。 主要实现思路： 选中，移动选中区域等都是依靠jQuery强大的API进行实现的。而可编辑的单元格实际上是在选中单元格时，在单元格上面添加个input输入域，动态的更新数据源代码： HTML代码： 代码如下:<table class="editableTable"> <thead> <tr> <th>Item1</th> <th>Item2</...
虽然会有这样的错误，但是如果再仔细测试一下，会发现input标type属性设为button时，还是具有checked属性的，而且默认为false 代码如下所示： 代码如下:<script type="text/javascript" src="//www.gxlcms.com/jslib/jquery/jquery.js"></script> <script type="text/javascript"> $(function () { $("#CheckedRev").click(function () { var TrueOrFalse = $(this).attr("checked"); alert(TrueOrFalse); }) }) </script> <input...
代码如下://Html结构转字符串形式显示 支持<br>换行 function ToHtmlString(htmlStr) { return toTXT(htmlStr).replace(/\<\;br[\&ensp\;|\&emsp\;]*[\/]?\>\;|\r\n|\n/g, "<br/>"); } //Html结构转字符串形式显示 function toTXT(str) { var RexStr = /\<|\>|\"|\'|\&| | /g str = str.replace(RexStr, function (MatchStr) { switch (MatchStr) { case "<": return "<"; break; case ">": return ">"; break; case "\"": re...
例子：我们要实现的效果是当用户点击鼠标的时候，就在旧数据上追加若干新数据。 如果使用标准DOM的话，完整代码如下： 代码如下:<html> <head> <title>test</title> </head> <body> <div> <p>data<p> </div> <script> document.onmousedown = function() { for (var i = 0; i < 10; i++) { var p = document.createElement("p"); p.appendChild(document.createTextNode(Math.random())); document.getElementsByTagName(div)...