精华内容
下载资源
问答
  • javaScript学习笔记(一)js基础

    万次阅读 多人点赞 2018-09-21 10:07:18
    JavaScript是目前web开发中不可缺少的脚本语言,js不需要编译即可运行,运行在客户端,需要通过浏览器来解析执行JavaScript代码。 诞生于1995年,当时的主要目的是验证表单的数据是否合法。 Java...

     

                                          公众号  关注一波  不定期分享视频资料

     

                                                                   

    一、简介

    1、概述:

    JavaScript是目前web开发中不可缺少的脚本语言,js不需要编译即可运行,运行在客户端,需要通过浏览器来解析执行JavaScript代码。

    诞生于1995年,当时的主要目的是验证表单的数据是否合法

    JavaScript本来应该叫Livescript,但是在发布前夕,想搭上当时超热的java顺风车,临时把名字改为了JavaScript。(也就是说js跟java没有关系,当时只是想借助java的名气)。

    js组成部分:

    (1)核心(ECMAScript):这一部分主要是js的基本语法。

    (2)BOM:Brower Object Model(浏览器对象模型),主要是获取浏览器信息或操作浏览器的,例如:浏览器的前进与后退、浏览器弹出提示框、浏览器地址栏输入网址跳转等操作等。

    (3)DOM:Document Object Model(文档对象模型),此处的文档暂且理解为html,html加载到浏览器的内存中,可以使用js的DOM技术对内存中的html节点进行修改,用户从浏览器看到的是js动态修改后的页面。(增删改查)

    2、特点:

    1. 交互性(它可以做的就是信息的动态交互)
    2. 安全性(不允许直接访问本地硬盘)
    3. 跨平台性(只要是可以解析js的浏览器都可以执行,和平台无关)

    3、和Java区别:

    4、作用

    avaScript 被用来改进设计、验证表单、检测浏览器、创建cookies,等等。JavaScript 是因特网上最流行的脚本语言,并且可在所有主要的浏览器中运行,比如: Internet Explorer、 Maxthon、Mozilla、Firefox、Netscape、Chrome和 Opera等。

    在目前学习阶段只要记住最常用的二个:(1)运态修改html及css代码 (2)验证表单

    5、书写位置

    5.1、内嵌式:

    理论上js可以书写在页面的任意位置。

    <script>

    alert("内嵌式")

    </script>

    5.2、外链式:

    首先新建一个文件类型为.js的文件,然后在该文件中写js语句,通过script标签对引入到html页面中。

    <script src="js文件路径地址">这里不能写js语句</script>

    5.3、行内式:

    直接书写在标签身上,是一个简写的事件,所以又称之为事件属性。     onclick单击事件

    <input type="button" value="点我呀!" onclick="alert('点我干啥!^6^');">
    <button onclick="alert('恭喜你,中 500 万.');">点我呀!</button>
    

    6、注释:

    单行注释:		//	注释语句		快捷键ctrl+/
    多行注释:		/* 注释语句 */    快捷键ctrl+shift+/   
    注意:多行注释相互不能嵌套使用,只能在多行注释里面使用单行注释!
    

    7、数据类型:

    Js中的数据类型:
     

    数值型:number(凡是数字都是数值型,不区分整数和小数)
    字符串:string(凡是引号包裹起来的内容全部都是字符串)
    布尔:boolean(true、false)
    对象类型:object(特殊取值null)
    未定义型:undefined
    

    对比java中的数据类型:

    整数:byte short int long
    小数:float double
    字符:char 
    布尔:boolean
    字符串:String

    8、变量:

    8.1、定义:就是存放数据的、内疗可以存储任意数据

    8.2、声明变量:
     

    var 变量名称 = 存储的数据;   	(variable 变量)

    8.3、变量命名规范:

    1.	只能由字母、数字、_(下划线)、$(美元符号)组成。
    2.	不能以数字开头。
    3.	命名中不能出现-(js会理解成减号进行减法的操作),不能和关键字冲突。
    

    js是弱类型语言,不重视类型的定义,但js会根据为变量赋值的情况自定判断该变量是何种类型:

    数值型:var i = 1;	var d = 2.35;
    字符串:var str = "用心学习";
    布尔型:var b = true;
    

    对比Java:java是强类型的语言,注重类型的定义,Java定义类型如下:

    整型:int i = 1;
    浮点型:double d = 2.35;
    字符串:String str = “用心学习”;
    布尔型:boolean b = true;
    

    总结:js中变量的定义。只要加一个var就行。java则使用什么类型的变量就要定义什么类型的。

    9、检测数据类型:

    typeof(value); 或者typeof value;     返回这个变量的类型. 
    说明 : 同一个变量, 可以进行不同类型的数据赋值.
    
    <script type="text/javascript">
        
        var a;
        alert(typeof a);  // undefined
    
        a = 998;
        alert(typeof a); // number
    
        a = "用心学习";
        alert(typeof a); // string
    
        a = true;
        alert(typeof a); // boolean
        
    </script>
    

    10、算术运算符

    +	-	*	/	%	++	--

    注意:

    1.	由于js中的小数和整数都是number类型,不存在类似整数除以整数还是整数的结论。
    2.	字符串和其他的数据使用+号运算,会连接成一个新的字符串。
    3.	字符串使用除了+以外的运算符:如果字符串本身是一个数字,那么会自动转成number进行运算
    ,否则就会返回一个NaN的结果,表示这不是一个数字。NaN:not a number
    
    <script>
    
        alert(1234 / 1000 * 1000); // 1234
      
        var s = "12";
         s -= 10;
        alert(s);  // 2
     
        var s = "aa";
        s -= 10;
        alert(s);  // NaN       Not a Number 不是一个数字
    
        var s = "12";
        s += 10;
        alert(s);       // 1210 
    
    </script>
    

    11、关系(比较)运算符

    >		>=		<		<=  	!=		
    ==	等于(只比较内容)	===	恒等于(比较内容的同时还要比较数据类型)
    注意:关系运算符返回的结果只有两个:true / false
    
    <script>
    
        // 请问1 : 3 > 5, 结果为 ?
        alert(3 > 5);   // false
    
        // 请问2 : “22” == 22  结果为 ?
        alert("22" == 22); // true  (仅仅判断数值)
    
        // 请问3 : “22” === 22  结果为 ?
        alert("22" === 22);  // false  (恒等于, 数值和类型都要相等)
        
    </script>
    

    12、逻辑运算符

    &&	 	与		true&&false		====>false
    || 		或		true||false			====>true
    ! 		非		!true				====>false
    false(理解):false,  0,  null,  undefined 
    true(理解):true, 非0,  非null,  非undefined
    
    针对 && 顺口溜: 找第一个出现的假值. (一假即假)
    针对 || 顺口溜: 找第一个出现的真值. (一真即真)

    演示一:

    <script>
    
        // 短路与 (一假即假)
        // 口诀 : 找第一个为假的值.
    
        // 请问1 :  8 < 7 && 3 < 4, 结果为 ?
        alert(8 < 7 && 3 < 4);  // false
    
        // 请问2 :  -2 && 6 + 6 && null 结果为 ?
        alert(-2 && 6 + 6 && null); // null
    
        // 请问3 :  1 + 1 && 0 && 5  结果为 ?
        alert(1 + 1 && 0 && 5); // 0
    
    </script>
    

    演示二:

    <script>
    
        // 短路或 : 一真即真.
        // 口诀 : 找第一个为真的值.
    
        // 请问1 :  0 || 23 结果为 ?
        alert(0 || 23); // 23
    
        // 请问2 :  0 || false || true  结果为 ?
        alert(0 || false || true); // true
    
        // 请问3 :  null || 10 < 8 || 10 + 10结果为 ?
        alert(null || 10 < 8 || 10 + 10);  // 20
    
        // 请问4 :  null || 10 < 8 || false结果为 ?
        alert(null || 10 < 8 || false); // false
        
    </script>
    

    13、三元运算符:

    条件?表达式1:表达式2
    如果条件为true,返回表达式1的结果
    如果条件为false,返回表达式2的结果
    

    演示:

    <script>
    
        // 请问1 :  3 ? “aaa” : “bbb” 结果为 ?
        alert(3 ? "aaa" : "bbb");       // aaa
    
        // 请问2 :  0 ? “ccc” : “ddd”  结果为 ?
        alert(0 ? "ccc" : "ddd");       // ddd
        
    </script>
    

    14、if条件语句

    这个和Java中if语句一样。

    演示:

    <script>
    
          var score = 59;
    
          if (score >= 90) {
              alert("优秀");
          } else if (score >= 80) {
              alert("良好");
          } else if (score >= 60) {
              alert("及格");
          } else {
              alert("不及格");
          }
    
      </script>
    

    15、switch分支结构

    这个和java中switch结构一样。只是Java中表达式为:常量 整型(去long)、字符、字符串

    演示:

    <script>
    
          var score = 59;
    
          // 需求 : 将需要一个整型数值, 不想要小数点.
          // window 对象的 parseInt 方法.
          score = window.parseInt(score / 10 + "");
          // alert(score);
    
          switch (score) {
              case 10:
              case 9:
                  alert("优秀!");
                  break;
              case 8:
                  alert("良好!");
                  break;
              case 7:
              case 6:
                  alert("及格!");
                  break;
              default:
                  alert("不及格!");
                  break;
          }
    
      </script>
    

    16、循环结构 while、do-while. for;

    while(循环条件){循环体;}
    do{循环体;}while(循环条件);
    for(循环变量赋初值;循环条件;循环变量增值){循环语句;}
    console.log(...); 以日志的形式在控制台输出结果!
    

    演示:

    <script>
    
        // 需求 : 统计 1~100 之间能够被3和7整除的数字个数
    
        var count = 0;
    
        // 1. 遍历 1~100 之间的所有整型数值
        for (var i = 1; i <= 100; i++) {
    
            // 2. 判断
            if (i % 3 == 0 && i % 7 == 0) {
                // alert(i);
                console.log(i);
                // 3. 累加个数
                count++;
            }
        }
    
        // 4. 查看结果
        // alert(count);
        console.log(count);
    
    

    console.log显示如下:

    17、循环嵌套

    演示案例9*9乘法表

     <style>
            table {
                /* 将 table 表格的线变成了细线 */
                border-collapse: collapse;
                /*color: red;*/
                border-color: red;
            }
        </style>
    
        <script>
    
            // 需求 : 九九乘法口诀表
            document.write("<table border='1px solid red' cellspacing='0' cellpadding='8px'>");
            document.write("<caption>九九乘法口诀表</caption>");
            for (var i = 1; i <= 9; i++) {
                document.write("<tr>");
                for (var j = 1; j <= i; j++) {
                    document.write("<td>");
                    document.write(j + "*" + i + "=" + (j*i) + "&nbsp;&nbsp;&nbsp;&nbsp;");
                    document.write("</td>");
                }
                document.write("</tr>");
            }
            document.write("</table>");
    
        </script>
    
    

    18、自定义函数

    函数是命名的独立的语句段,这个语句段可以被当作一个整体来引用和执行:

    格式:

    function 函数名(形式参数){函数体}
    调用函数:函数名(实际参数);
    

    18.1、函数只有被调用后才会执行

    18.2、如果函数需要返回值、直接使用return 返回、不会像java一样要考虑返回值的类型

    <script type="text/javascript">
    
        // 定义一个函数 : function
        function demo2() {
            return 666;
        }
    
        // 调用函数 :
        alert(demo2());
    
    </script>
    

    18.3、如果函数需要传递参数、不需要指定参数的类型、直接使用变量即可

    <script type="text/javascript">
    
        // 定义一个函数 : function
        function demo3(a, b) {
            return a + b;
        }
    
        // 调用函数 :
        alert(demo3(10, 20));//显示30
    
    </script>
    

    18.4、js中出现二个重名的函数名、后者会把前面的覆盖掉

    对比java、java有重载(同名不同参)、重写(同名同参同返回值类型、方法体不一样)

    演示:

    <script type="text/javascript">
    
        // 定义一个函数 : function
        function demo4(a, b) {
            alert("调用1...");
        }
    
       function demo4() {
           alert("调用2...");
       }
    
        demo4(10, 20);
        demo4();
    
    </script>
    

    会显示二次下面的图片:

    19、匿名函数

    匿名函数是没有名字的函数

    function(形式参数){函数体}
    调用方式:将匿名函数赋值给一个变量,通过变量名调用函数
    定义函数并赋值给变量:var fn = function(形式参数){函数体}
    调用函数:fn(实际参数);
    

    演示:

    <script type="text/javascript">
    
        // 匿名函数 : 没有名称的函数
        var func = function(i, u) {
            alert(i + " love " + u);
        }
    
        // 调用函数 :
       func("柳岩", "小白");//显示柳岩love小白
    
    </script>
    

    20、案例-轮播图

    说明1 : script 标签需要放在 body 标签之后.
    
    说明2 : window.setInterval(“字符串函数名称()”, 时间毫秒数);
    
    说明3 : window.setInterval(函数名称, 时间毫秒数);
    
    说明4 : window.setInterval(匿名函数, 时间毫秒数);            推荐使用
    <head>
        <meta charset="UTF-8">
        <title>轮播图</title>
    
        <style>
    
            div {
                width: 80%;
                margin: 50px auto;
            }
    
            img {
                width: 100%;
            }
    
        </style>
    
    </head>
    <body>
        <div class="container">
            <img src="../img/01.jpg" alt="图片">
        </div>
    </body>
    

    实现一:

    <script>
    
        // 需求 : 动态获取页面中的 img 标签, 然后修改 img 标签的 src 属性.
        // 1. 获取 img 标签
        var img = document.getElementById("img");
        // alert(img);
    
        // 定义一个变量
        var count = 1;
    
        // 1.2 定义一个函数
        function changeImageSrc() {
            count++;
            img.src = "../img/0"+count+".jpg";
    
            // 判断
            if (count == 8) {
                count = 0;
            }
        }
    
        // 2. 循环切换图片
        // window.setInterval(函数, 时间毫秒); 在指定的时间毫秒间隔, 不断调用第一个参数传入的函数.
        // 调用方式一 :
        // window.setInterval("changeImageSrc()", 1000);
        // 调用方式二 :
        window.setInterval(changeImageSrc, 1000);
    
    </script>
    

    实现二:

    <script>
    
        // 需求 : 动态获取页面中的 img 标签, 然后修改 img 标签的 src 属性.
        // 1. 获取 img 标签
        var img = document.getElementById("img");
        // alert(img);
    
        // 定义一个变量
        var count = 1;
    
        // 2. 循环切换图片
        // window.setInterval(匿名函数, 时间毫秒); 在指定的时间毫秒间隔, 不断调用第一个参数传入的匿名函数.
        window.setInterval(function() {
            count++;
            img.src = "../img/0"+count+".jpg";
    
            // 判断
            if (count == 8) {
                count = 0;
            }
        }, 1000);
    
    </script>
    

    21、js事件

    21.1、事件概述:

    事件三要素:
    1.	事件源:被监听的html元素(就是这个事件加给谁),就是某个(某些)html标签
    2.	事件类型:某类动作,例如点击事件,移入移除事件,敲击键盘事件等
    3.	执行指令:事件触发后需要执行的代码,一般使用函数进行封装
    语法格式:事件源.事件类型=执行指令
    

    21.2、常用的事件:

    案例:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>事件</title>
    
        <script>
            // 窗口 : window 对象提供了一个事件类型  onload 页面加载完成事件.
            // 事件源 : window    事件类型 : 页面加载完成事件 (onload)  执行指令: 就是赋值的 function 函数.
            window.onload = function () {
    
                // 获取页面的 btn 按钮
                var btn = document.getElementById("btn");
                // alert(btn);
    
                // 给 btn 按钮绑定一个事件 (单击事件 onclick)
                // 事件源 : btn按钮    事件类型 : 单击事件 (onclick)  执行指令: 就是赋值的 function 函数.
                btn.onclick = function () {
                    alert("恭喜你, 中了 500 万!");
                }
            }
    
        </script>
    
    </head>
    <body>
        <button id="btn">按钮</button>
    </body>
    </html>
    

    到此基础结束。

     

    ==============《轮播图图片路径问题》================

     

                                                           =================================

                        公众号  关注一波  (一叶知秋博客)不定期分享视频资料

                                                           

     

     

    展开全文
  • 事实上,除了名字中都带有Java外,二者并没有任何相同点。 而且,JavaScript比Java更容易学习和使用。 实际上,JavaScript是所有语言中最简单的,且具有令人叹服的强大功能。 JavaScript语言最初出现在Netscape ...

    JavaScript并非Java语言的脚本版。

    事实上,除了名字中都带有Java外,二者并没有任何相同点。

    而且,JavaScript比Java更容易学习和使用。

    实际上,JavaScript是所有语言中最简单的,且具有令人叹服的强大功能。


    JavaScript语言最初出现在Netscape Navigator 2浏览器中。当时它叫LiveScript

    然而,由于当时Java技术如日中天,Netscape公司觉得改为JavaScript这个名字会更吸引人注目(用现在的话说,就是蹭热度,蹭sun java的热度)。

    随着JavaScript的发展,微软公司决定在IE浏览器中加入微软自己品牌的JavaScript,即JScript。

    随后,Netscape(美国的网景公司)、微软和其他公司都发布了更新的JavaScript版本并在各自的最新浏览器中将其纳入....

    展开全文
  • china.js 省份名字居中显示,echarts地图。china.js 省份名字居中显示,echarts地图。china.js 省份名字居中显示,echarts地图。
  • JS名字随机抽奖代码是一款名字抽奖代码,支持手动添加或删除抽奖名字
  • 主要介绍了JavaScript设置名字输入不合法的方法,需要的朋友可以参考下
  • JavaScript库,用于改写乌克兰的姓氏,名字和个人名字/ JavaScript库,用于改写乌克兰的姓氏,中间名和姓氏 文献资料 / 安装 npm install --save shevchenko 使用范例 const anthroponym = { gender : 'male' , //...
  • js名字显示星号 (脱敏)

    千次阅读 2020-12-03 11:56:22
    js名字显示星号 function formatName(name) { var newStr; if (name.length === 2) { newStr = name.substr(0, 1) + '*'; } else if (name.length > 2) { var char = ''; for (var i = 0, len = name....

    js 让名字显示星号

    function formatName(name) {
        var newStr;
        if (name.length === 2) {
            newStr = name.substr(0, 1) + '*';
        } else if (name.length > 2) {
            var char = '';
            for (var i = 0, len = name.length - 2; i < len; i++) {
                char += '*';
            }
            newStr = name.substr(0, 1) + char + name.substr(-1, 1);
        } else {
            newStr = name;
        }
        return newStr;
    }
    
    console.log(formatName('张浩'));    //张*
    console.log(formatName('张浩浩'));    //张*浩
    console.log(formatName('张浩浩浩浩'));    //张***浩
    
    
    展开全文
  • 生成一个名字(男女不限) randomName.getName(); 生成一个名字(男) randomName.getMaleName(); 生成一个名字(女) randomName.getName(); 生成一个昵称 randomName.getNickName(); 生成一个姓 randomName....
  • js名字中间部分替换成星号

    万次阅读 2018-07-26 09:59:14
    js名字中间部分替换成星号 public formatName(name: any): string { let newStr; if (name.length === 2) { newStr = name.substr(0, 1) + '*'; } else if (name.length &amp;amp;gt; 2) { let char = ''...

    js名字中间部分替换成星号

      function formatName(name) {
        let newStr;
        if (name.length === 2) {
        newStr = name.substr(0, 1) + '*';
        } else if (name.length > 2) {
          let char = '';
          for (let i = 0, len = name.length - 2; i < len; i++) {
            char += '*';
          }
          newStr = name.substr(0, 1) + char + name.substr(-1, 1);
        } else {
          newStr = name;
        }
    
        return newStr;
     }
    
    展开全文
  • #1楼 参考:https://stackoom.com/question/SA6c/在Javascript中按名字-按字母顺序-对数组进行排序 #2楼 If compared strings contain unicode characters you can use localeCompare function of String class ...
  • JavaScript名字由来

    千次阅读 2012-03-20 20:30:33
    事实上,除了名字中都带有Java外,二者并没有任何相同点。 而且,JavaScript比Java更容易学习和使用。 实际上,JavaScript是所有语言中最简单的,且具有令人叹服的强大功能。 JavaScript语言最初出现在...
  • * 根据名字提取颜色 * @param name 名字 */ function extractColorByName(name) { var temp = []; temp.push("#"); for (let index = 0; index < name.length; index++) { temp.push(p...
  • Js实现页面按名字搜索功能

    千次阅读 2017-08-25 13:45:08
    在视图中可以创建这样一个空的标签 JS代码:  function search() {  var status = $("#status").val();  var name = $("#name").val();  $.post("控制器的Url", {  name: name,  sta
  • JS截取名字字符串的后面2位

    千次阅读 2021-03-22 14:53:15
    var a='西门吹灰' var b='诸葛' a.slice(-2)//'吹灰' a.slice(a.length-2,a.length)//'吹灰' b.slice(-2)//'诸葛' b.slice(b.length-2,b.length)//'诸葛'
  • js实现一个无聊名字的生成器

    千次阅读 2014-08-15 14:44:20
    在这个示例中,取出0位置上的字符,也就是字符串中的第一个字符(请记住,JavaScript 从0 开始编号),并且返回这个字符的ASCII值。大写字母A的ASCII值为65,Z的ASCII值为90。所 以将返回值减65应该获得0~25的...
  • <!doctype html> <html> <head> <meta charset="urtf-8">...通过js改变class名字改变样式</title> <style> .tao { /*初始样式*/ border-radius:35px; width:100px;...
  • JavaScriptJS Window详解<二>

    千次阅读 2015-12-27 19:00:03
    JavaScriptJS Window详解 定义:JavaScript Window - 浏览器对象模型 浏览器对象模型 (BOM) 浏览器对象模型(Browser Object Model)尚无正式标准。 由于现代浏览器已经(几乎)实现了 JavaScript 交互性方面...
  • 判断输入名字是否合法(js

    千次阅读 2019-03-02 04:48:19
    最近在做一个项目,需要验证用户输入的姓名是否合法,利用正则表达式 代码如下:var reg=/^[][\u4E00-\u9FA5\uf900-\ufa2d·s]{2,20}$/ 支持少数民族同胞输入姓名(中间的点 · 是tab键生成的) ...
  • 我参照的是w3c关于promt的一章:http://www.w3school.com.cn/jsref/met_win_prompt.asp,这个网址上运行也是一直转圈。如果您知道原因,请告诉我,万分感激! 我的代码如下: 输入你的名字 输入名字列表: ...
  • function formatStr(str) { return str.substring(0,1) + new Array(str.length).join('*') } console.log(formatStr('高先生的猫')) // 高****
  • 使用MooTools和Node.js的ServerSide JavaScript 这篇文章是由克里斯托弗·波耶 ( Christoph Pojer )撰写的。 要了解有关Christoph的更多信息, 请单击此处 。 这篇博客文章旨在为使用MooTools开发ServerSide...
  • 请把用户输入的不规范的英文名字,变为首字母大写,其他小写的规范名字 function normalize(arr) { function correct(word){ var list =''; for(i=0;i<word.length;i++){ if(i === 0) list += wor...
  • 简单的 JavaScript 脚本,用于为他的名字获取字体 Awesome unicode char。 ##Install 从下载字体 Awesome 并将“fontawesome-webfont.ttf”复制到项目文件夹。 在项目文件夹中运行命令: git clone ...
  • 微笑.js Exposure.js 有一个不那么狡猾的名字
  • js动态改变class名字

    千次阅读 2018-03-06 11:00:16
    var fenlei = $("#worksheetField140").val(); if(fenlei == 1){ $("#qsType20").removeClass("required"); }else{ $("#qsType20").addClass("required"); }
  • var beforeData = [{ name: "tony", id: "1", age: "20" }, { name: "jack", id: "2", age: "21" }, { ...
  • js中动态标签class名字

    千次阅读 2018-08-04 12:56:26
    /* $(".box dl").append("&lt;dt class='"+i+"'&gt;"+r[i].name+"&... //按照动态名字给大分类下的小分类赋值 for (var j = 0; j &lt; r[i].
  • 醚项目 JavaScript(和TypeScript)中完整的以太坊钱包实现和实用程序。 ...ENS名字是一等公民。 它们可以在任何可以使用以太坊地址的地方使用 小(压缩后约104kb;未压缩后322kb) 模块化包装;
  • "请输入你自己的名字和对方的名字,两个名字之间用空格分开" ; //将输入提示保存在变量中 var str_prompt_default= "自己的名字 对方的名字" ; //将默认值保存在变量中 user_name= prompt ( str_prompt,str_...
  • 我的名字 让我的名字JS

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 384,129
精华内容 153,651
关键字:

关于js的名字