原生js(一)----js发展史

前言

  • 最近一段时间公司项目刚刚结束,工作量相对来说轻了一点,想起来在刚开始找工作的时候 ,有一部分公司会问你有没有自己的博客,刚好趁这一段时间,来总结一下自己以前在学习的时候学的一些基础知识。一来填充一下自己 的博客 二来也希望我写的这些东西能对刚入行的萌新们有一点小小的帮助。

Web前端发展史

  • 1994年4月,马克.安德森和Silicon Graphics(简称为SGI,中译为“视算科技”或“硅图”)公司的创始人吉姆·克拉克(Jim Clark)在美国加州设立了“Mosaic Communication Corporation”。
    Mosaic公司成立后,由于伊利诺伊大学拥有Mosaic的商标权,且伊利诺伊大学已将技术转让给Spy Glass公司,开发团队必须彻底重新撰写浏览器程式码,且浏览器名称更改为Netscape Navigator,公司名字于1994年11月改名为“Netscape Communication Corporation”,此后沿用至今,中译为“网景”。
    微软的Internet Explorer及Mozilla Firefox等,其早期版本皆以Mosaic为基础而开发。微软随后买下Spy Glass公司的技术开发出Internet Explorer浏览器,而Mozilla Firefox则是网景通讯家开放源代码后所衍生出的版本

jacascript浏览器发展史

  • JavaScript作为Netscape Navigator浏览器的一部分首次出现在1996年。它最初的设计目标是改善网页的用户体验。

  • 期初JavaScript被命名为,LiveScript,后因和Sun公司合作,因市场宣传需要改名JavaScript。后来Sun公司被Oracle收购,JavaScript版权归Oracle所有。

  • Mosaic–马赛克, 是互联网历史上第一个获得普遍使用和能够显示图片的网页浏览器,诞生于1993年

  • 浏览器组成

    • shell部分

    • 内核部分

      • 渲染引擎–语法规则和渲染
      • js引擎
      • 其他模块
    • 2001年IE6问世,首次实现对js引擎的优化和分离。

      2008年Google发布最新浏览器Chrome,采用优化后的JavaScript引擎,代号V8,因能把js代码直接转为机器码来执行,进而以速度快而闻名。而且V8引擎可独立运行,如Node.js就是基于V8引擎的。

      后来Firefox也推出了具备强大功能的js引擎,对频繁执行的代码做了路径优化。

  • 五大主流浏览器及其内核

    • IE--------------- trident

    • Chrome ------ webkit/blink

    • Firefox -------- Gecko

    • Opera --------- presto

    • Safari --------- webkit

  • 编译

    • 比较几种语言的优缺点
    • c/c++
      • 优点:速度快
      • 缺点:移植性差–不可跨平台
    • java
      • java → javac → 编译 → .class → jvm → 解释执行
    • javascript
      • 优点:跨平台
      • 缺点:稍微慢
  • js执行队列
    在这里插入图片描述

  • js特性

    • 解释性脚本语言
    • 基于对象
    • 动态性
    • js引擎单线程:分片交错执行–轮转时间片
    • js组成部分:ECMAScript,DOM,BON
      • 由ECMA国际制定了js标准,称为ECMAscript
  • JavaScript日常用途

    • 1、嵌入动态文本于HTML页面。
    • 2、对浏览器事件做出响应。
    • 3、读写HTML元素。
    • 4、在数据被提交到服务器之前验证数据。
    • 5、检测访客的浏览器信息。
    • 6、控制cookies,包括创建和修改等。
    • 7、基于Node.js技术进行服务器端编程。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
原生JS中的el-table是指element-ui库中的表格组件。它可以通过使用element-ui提供的API来创建和操作表格。在原生JS中,可以使用以下代码来创建el-table组件: ```javascript // 创建el-table组件 var table = document.createElement('el-table'); table.setAttribute('v-loading', 'dataListLoading'); table.setAttribute(':data', 'dataList'); table.setAttribute('border', ''); table.setAttribute('align', 'center'); // 创建el-table-column组件 var column = document.createElement('el-table-column'); column.setAttribute(':label', 'item.propName'); column.setAttribute(':property', 'item.propItem'); column.setAttribute('v-for', 'item in tableColumnList'); column.setAttribute(':key', 'item.prop'); column.setAttribute('align', 'center'); // 创建template和span元素 var template = document.createElement('template'); var span = document.createElement('span'); span.textContent = '{{scope.row\[scope.column.property\]}}'; // 将span元素添加到template中 template.appendChild(span); // 将template元素添加到el-table-column组件中 column.appendChild(template); // 将el-table-column组件添加到el-table组件中 table.appendChild(column); // 将el-table组件添加到页面中的某个元素中 var container = document.getElementById('container'); container.appendChild(table); ``` 以上代码是通过原生JS动态创建el-table组件的示例。你可以根据自己的需求进行修改和扩展。 #### 引用[.reference_title] - *1* [el-table 动态表格实现+原生表格实现代码](https://blog.csdn.net/weixin_50748620/article/details/123419248)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [el-table表格——获取单击的是第几行和第几列 & 表格排序之el-table与sort-change、el-table-column与sort-...](https://blog.csdn.net/weixin_44867717/article/details/125618132)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值