javaScirpt_01（基础入门）

最新推荐文章于 2023-01-18 11:54:41 发布

Bugxiu_fu

最新推荐文章于 2023-01-18 11:54:41 发布

阅读量428

点赞数

文章标签： javascript html 前端

本文链接：https://blog.csdn.net/Bugxiu_fu/article/details/123240119

版权

javaScirpt_01（基础入门）

1.js的历史（网景通信公司）

布兰登10天时间开发liveScirpt 后面与Sun合作---javascript

2.同时期微软和 Nombas公司开发的jscript|scriptEase语言

3.欧洲计算机协会上三者制定了一套标准ECMAScript核心语法

4.js的组成

ECMAScript--核心语法（变量，选择结构，循环结构，数组等等操作） DOM：文档对象模型---通过DOM可以获取HTML文件中的任意标签，实现增删改查 BOM：浏览器对象模型，通过BOM可以对“数据的结果”进行输入输出以及获取浏览器上的地址并且可以设置，历史记录，屏幕的宽度和高度以及浏览器的版本和引擎

5.js如何引入html中

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        /*js的嵌入式*/
         <script type="text/javascript ">
             alert("好好学习，天天向上");
        </scripy>
    </head>
    <body>
            
 /*行内式js编写*/
<button onclick="alert(123)" onmouseover="this.style.backgroundColor='rad'"> 按钮</button>
      
/*嵌入式 借助script标签 */
alert();
    </body>
</html>

6.js中的输出语句:

alert(); 普通弹窗

confirm(); 确认弹窗,返回值是boolean类型

prompt(); 弹窗输入语句,类似Scanner

document.write("内容"); 向页面输出内容

终极输出

console.log(); 日志信息输出

console.info(); 普通信息输出

var f=confirm("你确定要和我分手吗?");

var name=prompt("请输入你的名字",”张三“)；默认张三

alert(name);

document.write("我爱学习");

console.log("好好学习");
console.info("天天摸鱼");

7.js中的运算符：

算数运算符：+ - * / % ++ --

赋值运算符 += = -= *= /= %=

关系运算符 > < >= <= != == ===

逻辑运算符 && || !

三元运算符表达式? 结果1:结果2

"===" 判断内容以及判断内容的类型

var a = 1;

var b = "1";

console.log(a==b);//true

console.log(a===b);//false

8.js的循环结构：

while循环

/*计算1到100的和*/
var num=1;
var sum=1;
while(num<=100){
    document.write(num+"<br/>");
    num++;
}
/*数组的基本使用*/
var names = ["张三","里斯","wangwu"];
for(var 1=0；i<names.length;i++){
    document.write(names[i]+"<br>");
}

js函数入门：

函数：就是方法，封装代码，方便调用

语法：

function 函数名称(){

结果集；

}

注意：需要手动调用，否则无效

function add(){
    var a=1;
    var b=1;
    alert(a+b);
}
/*直接调用*/
add();
/*间接调用*/
<button onclick="add();">按钮<button>

函数的调用有以下方式：

直接调用：

直接借助标签自带的事件属性

间接借助标签自带的事件属性

间接调用：

script标签中首先得到标签对象，然后在调用属性。

js组成：ECMAScript,BOM,DOM

DOM:文档对象模型，通过DOM编程可以实现动态获取html文件的任意标签进行CURD（增删查改）

根据标签的id属性可以得到标签本身。

/*根据标签的id属性可以得到标签本身。*/
document.getElementById(id);

/*输入项中的内容最终会保存在input中的value属性*/
    <input id="ywg" type="text" value="杨文广">
<button onclick = "sb();">点击获取输入项中的内容</button>

<script type="text/javascript">

        function sb(){
            // 根据标签的id属性获取标签
            var bb = document.getElementById("ywg");
            alert(bb.value);
        }
    </script>
/*实现9*9乘法表：*/

    <script type="text/javascript">
        document.write("<table border = '0' width = '100%'>");
        for(var i = 1;i<=9;i++){
            document.write("<tr>");
            for(var j = 1;j<=i;j++){
                document.write("<td>");
                document.write(j + " * " + i + " = " + ( i * j ));
                document.write("</td>");
            }
            document.write("</tr>");
        }
        document.write("</table>");

    </script>

Bugxiu_fu

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javaScirpt_01（基础入门）

javaScirpt_01（基础入门）1.js的历史（网景通信公司）布兰登10天时间开发liveScirpt 后面与Sun合作---javascript2.同时期微软和 Nombas公司开发的jscript|scriptEase语言3.欧洲计算机协会上三者制定了一套标准ECMAScript核心语法4.js的组成ECMAScript--核心语法（变量，选择结构，循环结构，数组等等操作） DOM：文档对象模型---通过DOM可以获取HTML文件中的任意标签，实现增删改查 BOM：浏览器对
复制链接

扫一扫