Javascript简单示例

最新推荐文章于 2024-06-11 02:06:44 发布
最新推荐文章于 2024-06-11 02:06:44 发布
阅读量2.5k 收藏 1
点赞数 1
分类专栏： JavaScript 文章标签： javascript html date button 浏览器 safari
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/noting_gonna/article/details/7364552
版权

1、Math.random()函数

<html>
         <head>
                <title>Javascript简单示例</title>
                <script language="javascript">
                   <!--
                            scope= prompt("请输入一个正整数：");
                            for(i= 1; i <= 100; i++){
                                     num= Math.floor(Math.random() * scope);//0-(scope-1)之间的随机数
                                     document.write(num,"");
                            }
                   //-->
         	</script>
         </head>
         <body>
         </body>
</html>

2、单击按钮后调用函数

<html>
         <head>
                   <title>Javascript简单示例</title>
                   <script language="javascript">
                   <!--
                            functionfunc1(){
                                     alert("按钮单击后调用的函数1！");
                            }
                            functionfunc2(){
                                     alert("按钮单击后调用的函数2！");
                            }
                   //-->
         </script>
         </head>
         <body>
                   <!--单击后调用两个函数用”,“隔开 -->
                   <inputtype="button" value="单击我"onClick="func1(), func2()" />
         </body>
</html>

3、使用对象：同样使用function。

<html>
         <head>
                   <title>Javascript简单示例</title>
         </head>
         <body>
                   <script language="javascript">
                            <!--
                                     functionStudent(name, school, grade){
                                               this.name= name;//注意这里要用this
                                               this.school=school;
                                               this.grade= grade;
                                     }
                                     hui= new Student("noting_gonna", "XX学校", "小学二年级");
                                     //使用with可以省略对象名
                                     with(hui){
                                               document.write(name+ ": " + school + "," + grade + "<br />");
                                     }
                                     if(window.hui){
                                               document.write("hui这个对象存在");
                                     }
                                     else
                                               document.write("hui这个对象不存在");
                            //-->
                   </script>
         </body>
</html>


4、获取input（text）中的内容 :name.value

<html>
         <head>
                   <title>Javascript简单示例</title>
         </head>
         <body>
                   <script language="javascript">
                            <!--
                                     functiongetLoginMsg(){
                                               //以下也达到了省略对象名称的作用
                                               loginMsg= document.loginForm;
                                               alert("账号：" +loginMsg.userID.value + "\n" + "密码：" +loginMsg.password.value);
                                     }
                                     functionsetLoginMsg(Object){
                                              alert(Object.id);
                                     }
                            //-->
                   </script>
                   <formname="loginForm">
                            账号：<inputtype="text" name="userID" /><br />
                            密码：<inputtype="text" name="password" /><br />
                            <inputtype="button" value="登录"οnclick="getLoginMsg()" />
                            记住密码<inputtype="checkbox" id="这是checkbox的id"οnclick="setLoginMsg(this)" />
                   </form>
         </body>
</html>

5、Javascript获取CSS的类名

<html>
         <head>
                   <title>Javascript简单示例</title>
                   <style type="text/css">
                   <!--
                            .bgcolor{
                                     background-color:#99330;
                            }
                   -->
                   </style>
         </head>
         <body>
                   <inputtype="button" value="点击"id="botton" οnclick=alert("使用的CSS类名："+botton.className)class="bgcolor" />
         </body>
</html>

6、setTimeout()：在指定的时间调用函数

<html>
         <head>
                   <title>Javascript简单示例</title>
         </head>
         <body>
                   <script language="javascript">
                            <!--
                                     functionalarm(){
                                              alert(new Date().toLocaleTimeString());
                                     }
                                     now= new Date().toLocaleTimeString();
                                     document.write("当前的时间："+ now + "<br />" + "2秒后弹出对话框！");
                                     setTimeout(“alarm()”,2000);
                            //-->
                   </script>
         </body>
</html>

7、setInterval()：在指定时间内反复调用函数

<html>
         <head>
                   <title>Javascript简单示例</title>
         </head>
         <body>
                   <script language="javascript">
                            <!--
                                     functionclock(){       
                                               now= new Date().toLocaleTimeString();
                                               time.value= now;
                                     }
                                     setInterval(“clock()”,1000);
                            //-->
                   </script>
                   当前的时间：<inputtype="text" id="time" size = 10/>
         </body>
</html>

8、显示在页面的停留时间

<html>
         <head>
                   <title>Javascript简单示例</title>
         </head>
         <body>
                   <script language="javascript">
                            <!--
                                     old= new Date();
                                     functionfunc(){        
                                               now= new Date();
                                               diff= (now.getTime() - old.getTime())/1000    //获取相隔的毫秒数
                                               diff= Math.round(diff);//返回x最接近的整数，对小数部分进行四舍五入
                                               second= diff % 60;
                                               minute= Math.round((diff-30)/60);//注意这里显示减去30，再除60，最后四舍五入
                                              
                                               second = (second < 10) ?"0" + second : second;
                                               minute= (minute < 10) ? "0" + minute : minute;
                                              
                                               time.value= minute + ":" + second;
                                     }
                                     setInterval("func()",1000);
                            //-->
                   </script>
                   你在本页面停留的时间：<inputtype="text" id="time" size = 10/>
         </body>
</html>

9、navigator.userAgent获取浏览器的名称及其版本、和所使用的操作等

<html>
         <head>
                   <title>Javascript简单示例</title>
         </head>
         <body>
         <script type="text/javascript">
       		<!--
                            varSys = {};
                            varua = navigator.userAgent.toLowerCase();
                            document.write(ua+"<br/>");
                            if(window.ActiveXObject)
                                     Sys.ie= ua.match(/msie ([\d.]+)/)[1]
                            elseif (document.getBoxObjectFor)
                                     Sys.firefox= ua.match(/firefox\/([\d.]+)/)[1]
                            elseif (window.MessageEvent && !document.getBoxObjectFor)
                                     Sys.chrome= ua.match(/chrome\/([\d.]+)/)[1]
                            elseif (window.opera)
                                     Sys.opera= ua.match(/opera.([\d.]+)/)[1]
                            elseif (window.openDatabase)
                                     Sys.safari= ua.match(/version\/([\d.]+)/)[1];
                           
                            if(Sys.ie)document.write('IE: '+Sys.ie);
                            if(Sys.firefox)document.write('Firefox: '+Sys.firefox);
                            if(Sys.chrome)document.write('Chrome: '+Sys.chrome);
                            if(Sys.opera)document.write('Opera: '+Sys.opera);
                            if(Sys.safari)document.write('Safari: '+Sys.safari);
                   //>
  	 </script>
         </body>
</html>

10、查看浏览器上所安装的插件：

<html>
         <head>
                   <title>Javascript简单示例</title>
         </head>
         <body>
         <script type="text/javascript">
       		<!--
                            num= navigator.plugins.length;
                            document.write("你浏览器上安装的插件有：<br/>");
                            for(i= 0; i <= num; i++){
                                     name= navigator.plugins[i].name;
                                     filename= navigator.plugins[i].filename;
                                     document.write(name+"-------------------------------->" + filename + "<br/>");
                            }
                   //>
   	</script>
         </body>
</html>



noting_gonna
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaScript 实例
z_once的博客
02-25 1355
JavaScript 是属于 HTML 和 Web 的编程语言。 编程令计算机完成您需要它们做的工作。 JavaScript 很容易学习。 本教程涵盖 JavaScript 基础和高级教程。
Javascript示例
weixin_30840573的博客
08-31 63
-------android培训、java培训、期待与您交流！ ---------- 1.1 Tip：DOM编程： 1．定义界面： 通过html的标签将数据进行封装 2．定义一些静态的样式： 通过css 3．需要动态的完成和用户的交互 A 先明确事件源 B 明确事件将时间注册到事件源上 ...
Web前端：JavaScript最强总结 附详细代码 （带常用案例！）_javascript在前端的应用
最新发布
2401_85122999的博客
06-11 544
/199.99//1024//128console.log(parseFloat(“10年”));//10console.log(parseFloat(“今天是8号”));//NaN//66//199//1024//128console.log(parseInt(“10年”));//10console.log(parseInt(“今天是8号”));
JavaScript简单实例
热门推荐
Linda的博客
07-24 2万+
JavaScript (JS)是属于网络的脚本语言，目前被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies，以及更多的应用。 初学JS，将自己学习过程中的简单实例代码放在这里，由于以前写过html，所以初次接触JS并不陌生，方便以后的学习和工作，现将简单实例在此列出： 一、简单实例： 1、通过指定的id来访问HTML元素并修改其内容(按钮触发)： (1)代码<!DOCTY
JavaScript简单使用实例
小不点的博客
01-07 302
        首先，我所认识理解的JavaScript是给我们固有的网页添加一些功能，是这些网页面向用户体验更加完美。所以要使用JavaScript，必须是在HTML+CSS的基础上实现的。说白了JavaScript就是给网页中的某些按钮、文本框中加入特效。        编写JavaScript的流程：         1.要有基础的页面布局HTML+CSS         2.要确定修...
JavaScript 示例
weixin_30621711的博客
02-22 89
JavaScript 示例 <html lang="en"> <head> <meta charset="UTF-8"> </head> <body> <div id="i1">泥瓦匠疯狂当上了飞机了看电视</div> <script> /...
简单的javascript变量示例
02-11
简单的javascript变量示例
JavaScript 示例源码
07-06
8. **JavaScript库和框架**：如jQuery简化DOM操作，React、Vue、Angular等前端框架的简单示例。 9. **Web存储**：localStorage和sessionStorage的使用，以及现代的IndexedDB。 10. **错误处理与调试**：try......
javascript事件冒泡简单示例
01-19
本文实例讲述了javascript事件冒泡的定义与用法。分享给大家供大家参考，具体如下： <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>...
JavaScript伸缩的菜单简单示例
10-26
伸缩的菜单，想必大家都有见到过吧，实现方法也是很多的，在接下来的文章中为大家介绍下使用js是如何实现的，需要的朋友可以参考下
简单的javascript年龄变量示例
02-11
简单的javascript年龄变量示例
JavaScript实例大全
11-09
一个非常好的JS实例大全，适用于各种JS人群，学习必备，包含各种JS实例，由浅入深，
JavaScript示例大全,JavaScript,JavaScript示例
05-31
JavaScript示例大全,JavaScript,JavaScript示例
50个js经典案例
12-19
50个常用的js的案例，便于初学者更好的学习js
javascript示例一
weixin_34324081的博客
07-02 73
开发工具介绍 前端常用开发工具：sublime、visual Studio Code、HBuilder、Webstorm。 那么大家使用的PCharm跟WebStorm是JetBrains公司推出的编辑工具，开发阶段建议使用。 我的第一个javascript实例 <!DOCTYPE html> <html> <head> <met...
JavaScript 经典实例盘点（收藏向）
Silvia
07-03 1万+
快捷目录一、跨 浏 览 器 事 件跨浏览器添加事件跨浏览器移除事件跨浏览器阻止默认行为跨浏览器获取目标对象跨浏览器获取滚动条位置跨浏览器获取可视窗口大小二、js 对 象 冒 充三、js异步加载和同步加载四、js获取屏幕坐标五、PageX和clientX六、js 拖 拽 效 果七、js获取图片原始大小尺寸八、js循环遍历数组九、阻止表单重复提交十、字 符 串 部 分十一、Number和Math部分十二、数 组 部 分十三、Date日期时间部分十四、正 则 部 分十五、js判断传入参数是否为质数十六、js判断字
JavaScript简单案例
芋泥啵啵月亮的博客
07-14 463
案例一 计算年龄，要求在页面弹出一个输入框，当输入出生年份后，计算出年龄。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initi
JavaScript简单示例--外部js
山楂的博客
09-28 505
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> #a{ text-align: center; margin-left: 400px; ...
JavaScript教程示例
qq_44744829的博客
10-04 235
注意事项： // 所有在双斜线之后的内容都属于注释 // 仔细阅读这里的注释：它们对JavaScript代码做了解释 // 变量是表示值的一个符号名字 // 变量是通过var关键字声明的var x; // 声明一个变量x // 值可以通过等号赋值给变量x = 0; // 现在变量x的值为0x // => 0:通过变量获取其值 // JavaScript支持多种数据类型x = 1; // 数字x = 0.01; // 整数和实数共用一种数据类型x = “hello wo
从零开始学Javascript：简单示例与入门教程
<head><title>一个最简单的Javascript示例(仅使用了document.write)</title></head> <script type="text/javascript"> document.write("你好，世界！"); ``` 在这个例子中，`<script>`标签用于包含JavaScript...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值