• Js菜鸟学习


    ()

    1

    代码如下:


    //页面中写入html内容
    document.write("<h1>Hello World!</h1>")


    2

    代码如下:


    //为了防止不支持 JavaScript 的浏览器把js当作为页面的内容来显示
    //注释行末尾的两个正斜杠是 JavaScript 的注释符号,它会阻止 JavaScript 编译器对这一行的编译。
    <script type="text/javascript">
    <!--
    document.write("Hello World!");
    //-->
    </script>


    3

    代码如下:


    //onload事件的多种写法
    //第一种通过body标签加入onload事件
    <script type="text/javascript">
    function message(){ alert("该提示框是通过 onload 事件调用的。");}
    </script>
    <body onload="message()">
    //第二种直接用window函数调用onload事件
    <script type="text/javascript" language="javascript">
    window.onload=message;
    function message(){ alert("该提示框是通过 onload 事件调用的。"); }
    </script>


    4
    //JavaScript 放置的位置
    当页面载入时,会执行位于 body 部分的 JavaScript。(直接执行)
    当被调用时,位于 head 部分的 JavaScript 才会被执行。
    head 部分
    包含函数的脚本位于文档的 head 部分。这样我们就可以确保在调用函数前,脚本已经载入了。

    5.
    //分号的作用
    //分号是可选的(根据 JavaScript 标准),浏览器把行末作为语句的结尾,通过使用分号,可以在一行中写多条语句。

    6。
    //JavaScript 变量名称的规则:
    变量对大小写敏感(y 和 Y 是两个不同的变量)
    变量必须以字母或下划线开始

    7。
    //变量的声明
    如果您所赋值的变量还未进行过声明,该变量会自动声明。
    例:
    x=5; carname="Volvo";
    与后面的这些语句的效果相同:var x=5; var carname="Volvo";

    8。
    //比较运算符
    运算符 描述 例子
    === 全等(值和类型) x===5 为 true; x==="5" 为 false

    9。
    //条件运算符(三目运算符)
    JavaScript 还包含了基于某些条件对变量进行赋值的条件运算符。
    name=("liuhuan"=="LH")?"刘欢":"歌星";


    10。
    //获得当前系统时间(小时数)
    var d = new Date()
    var time = d.getHours()

    11。
    //随机数
    var num=Math.random();
    产生的伪随机数介于 0 和 1 之间(含 0,不含 1),也就是,返回值可能为0,但总是小于1。在第一次加载 JScript 时随机数发

    生器自动产生 。

    12。
    //获取今天的星期数(星期日为0,星期1-6为1-6)
    var d = new Date()
    theDay=d.getDay()

    13。
    //按钮的触发事件
    <input type="button" onclick="disp_alert()" value="显示警告框" />

    14。
    //弹出框内容换行
    alert("再次向您问好!在这里,我们向您演示" + ' ' + "如何向警告框添加折行。")

    15.
    //确认框(删除方法)
    //confirm("文本")
    <script type="text/javascript">
    function show_confirm()
    {
    var r=confirm("确认删除?");
    if (r==true) {
    alert("删除成功!");
    }
    else{
    alert("删除失败!");
    }
    }
    </script>

    16.
    //于用户交互的弹出框(可输入文字的提示框)
    //prompt("文本","默认值")
    <script type="text/javascript">
    function disp_prompt()
    {
    var name=prompt("请输入您的名字","Bill Gates")
    if (name!=null && name!=""){
    document.write("你好!" + name + " 今天过得怎么样?")
    }
    }
    </script>

    17。
    //带有参数并返回值的函数
    <head>
    <script type="text/javascript">
    function product(a,b)
    {
    return a*b;
    }
    </script>
    </head>
    <body>
    <script type="text/javascript">
    document.write(product(6,5))
    </script>
    </body>

    18。
    //for循环 (本例中动态生成html中的h标签)
    <body>
    <script type="text/javascript">
    for (i = 1; i <= 6; i++){
    document.write("<h" + i + ">这是标题 " + i)
    document.write("</h" + i + ">")
    }
    </script>
    </body>

    19。
    //break跳出语句
    <script type="text/javascript">
    var i=0
    for (i=0;i<=10;i++){
    if (i==3){break}
    document.write("数字是 " + i)
    document.write("<br />")
    }
    </script>
    <p>解释:循环会在 i=3 时中断。</p>


    20。
    //continue跳出语句
    <script type="text/javascript">
    var i=0
    for (i=0;i<=10;i++){
    if (i==3){continue}
    document.write("数字是 " + i)
    document.write("<br />")
    }
    </script>
    <p>解释:当 i=3 时,会中断循环,并从下一个值开始继续循环。</p>
    值为:01245678910

    21。
    //for in循环(相当于.net中的foreach循环)
    <html>
    <body>
    <script type="text/javascript">
    var x
    var mycars = new Array()
    mycars[0] = "宝马"
    mycars[1] = "奔驰"
    mycars[2] = "宾利"

    for (x in mycars)
    {
    document.write("x的值为"+x+ "<br />");
    document.write(mycars[x] + "<br />")
    }
    </script>
    </body>
    </html>


    22。
    //javascript事件
    onload 某个页面或图像被完成加载 //页面加载
    onunload 用户退出页面

    onfocus 元素获得焦点
    onblur 元素失去焦点 //表单验证
    onchange 用户改变域的内容
    onreset 重置按钮被点击
    onsubmit 提交按钮被点击 //用于在提交表单之前验证所有的表单域。
    例如:
    (当用户单击表单中的确认按钮时,checkForm() 函数就会被调用。checkForm() 函数的返回值是 bool类型,如果返回值为true,则

    提交表单,反之取消提交。)
    <form method="post" action="xxx.htm" onsubmit="return checkForm()">

    onkeydown 某个键盘的键被按下
    onkeypress 某个键盘的键被按下或按住 //键盘操作
    onkeyup 某个键盘的键被松开

    onclick 鼠标点击某个对象
    ondblclick 鼠标双击某个对象
    onmousedown 某个鼠标按键被按下 //鼠标操作
    onmousemove 鼠标被移动
    onmouseout 鼠标从某元素移开
    onmouseover 鼠标被移到某元素之上
    onmouseup 某个鼠标按键被松开

    onabort 图像加载被中断
    onerror 当加载文档或图像时发生某个错误

    onresize 窗口或框架被调整尺寸
    onselect 文本被选定

    23。
    //js中的错误提示 err.description及其try...catch 语句
    例如:
    <script type="text/javascript">
    var txt=""
    function message(){
    try{
    adddlert("Welcome guest!")
    }
    catch(err){
    txt="本页中存在错误。 "
    txt+="错误描述:" + err.description + " "
    txt+="点击“确定”继续。 "
    alert(txt);
    }
    }
    </script>

    24。
    //带有确认框的 try...catch 语句
    <head>
    <script type="text/javascript">
    var txt=""
    function message(){
    try{
    adddlert("Welcome guest!")
    }
    catch(err){
    txt="本页中存在错误。 "
    txt+="点击“确定”继续查看本页, "
    txt+="点击“取消”返回首页。 "
    if(!confirm(txt))
    {
    document.location.href="../index.html"
    }
    }
    }
    </script>
    </head>
    <body>
    <input type="button" value="查看消息" onclick="message()" />
    </body>


    25。
    //创建 exception(异常或错误)。(配合try...catch语句使用)
    例如:
    <script type="text/javascript">
    var x=prompt("请输入 0 至 10 之间的数:","")
    try{
    if(x>10)
    throw "Err1"
    else if(x<0)
    throw "Err2"
    else if(isNaN(x))
    throw "Err3"
    }
    catch(er){
    if(er=="Err1")
    alert("错误!该值太大!")
    if(er == "Err2")
    alert("错误!该值太小!")
    if(er == "Err3")
    alert("错误!该值不是数字!")
    }
    </script>


    26。
    //return true和return true的用法
    (它可以返回一个bool型的参数,继续用于判断)
    function jiance(msg,url,l){
    alert("你确定吗?")
    return true
    }
    function jieguo(){
    if(jiance()){
    alert("是");
    }
    else{
    alert("否");
    }
    }

    27.
    //onerror 事件
    <html><head>
    <script type="text/javascript">
    //当出现错误时触发onerror事件
    onerror=handleErr;
    var txt=""
    function handleErr(msg,url,l){
    txt="本页中存在错误。 "
    txt+="错误:" + msg + " "
    txt+="URL: " + url + " "
    txt+="行:" + l + " "
    txt+="点击“确定”继续。 "
    alert(txt)
    return true
    }
    function message(){
    adddlert("确定吗?")
    }
    </script>
    </head><body>
    <input type="button" value="查看消息" onclick="message()" />
    </body></html>


    28。
    //JavaScript 中使用反斜杠来向文本字符串添加特殊字符。
    例如:
    var txt="We are the so-called "Vikings" from the north."
    document.write(txt)

    29。
    //javascript注意事项
    1。JavaScript 对大小写敏感
    2。JavaScript 会忽略多余的空格
    3。在编写代码时可以使用反斜杠进行换行
    例:
    document.write("Hello

    World!");

    (二)

    1.  
    //使用变量的属性
    <script type="text/javascript">
    var txt="Hello World!"
    document.write(txt.length)
    </script>


    2。
    //把字符串中的所有字母都被转化为大写字母。
    <script type="text/javascript">
    var str="Hello world!"
    document.write(str.toUpperCase())
    </script>


    3。
    //js中个变量添加超链接
    <script type="text/javascript">
    var txt="Hello World!"
    document.write("<p>超链接为: " + txt.link("http://www.w3school.com.cn") + "</p>")
    </script>

    4。
    //indexOf方法(定位字符串中某一个指定的字符首次出现的位置。如果没有查到返回-1,区分大小写)
    <script type="text/javascript">
    var str="Hello world!"
    document.write(str.indexOf("Hello") + "<br />") //1
    document.write(str.indexOf("World") + "<br />") //-1
    document.write(str.indexOf("world")) //6
    </script>

    5。
    //match() 方法
    //使用 match() 来查找字符串中特定的字符,并且如果找到的话,则返回这个字符。
    <script type="text/javascript">
    var str="Hello world!"
    document.write(str.match("world") + "<br />") //world
    document.write(str.match("World") + "<br />") //null
    document.write(str.match("worlld") + "<br />") //null
    document.write(str.match("world!")) //world!
    </script>


    6。
    //replace() 方法在字符串中用某些字符替换另一些字符。
    var str="Visit Microsoft!"
    document.write(str.replace("Microsoft","W3School"))


    7.
    //合并两个数组
    <script type="text/javascript">
    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    var arr2 = new Array(3)
    arr2[0] = "James"
    arr2[1] = "Adrew"
    arr2[2] = "Martin"
    document.write(arr.concat(arr2))
    </script>

    ()

    1.js正则表达式(RegExp对象)
    RegExp 对象有 3 个方法:test()、exec() 以及 compile()。
    ①test()方法
    //test() 方法检索字符串中的指定值。返回值是 true 或 false。
    var patt1=new RegExp("e");
    document.write(patt1.test("The best things in life are free"));
    ②exec()方法
    //exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配,则返回 null。
    var patt1=new RegExp("e");
    document.write(patt1.exec("The best things in life are free"));

  • 相关阅读:
    .netcore3.1添加swagger及JWT Authorize 验证
    Quartz.Net实现简单定时任务调度
    基于.Net Framework进行配置Swagger
    升级anaconda的python版本命令
    使用jmeter自带的html查看测试报告
    软件质量模型的6大特性和27个子特性
    PyQt5基础教程及官方文档
    使用jmeter进行下载并发测试
    selenium官方入门文档
    web driver 驱动配置位置
  • 原文地址:https://www.cnblogs.com/lgx5/p/5827941.html
Copyright © 2020-2023  润新知