资讯专栏INFORMATION COLUMN

JavaScript学习笔记系列(一)

Andrman / 2670人阅读

摘要:只是浏览器只是实现可能的宿主环境之一,其他宿主环境包括和。级别级由两个模块组成核心和。有效不推荐有一点必须注意,即用操作符定义的变量将成为定义该变量的作用域的局部变量。会返回判断相等符认为两者相等。显示因此尽量避免这样运算。

一:JavaScript组成部分

JavaScript是由三个不同部分组成的,核心(ECMAScript) 、文档对象模型(DOM)和浏览器对象模型(BOM)。

1.ECMAScript

ECMAScript与Web浏览器没有依赖关系。只是Web浏览器只是ECMAScript实现可能的宿主环境之一,其他宿主环境包括Node和Adobe Flash。它规定了这门语言的组成部分:
1.语法
2.类型
3.关键字
4.保留字
5.操作符
6.对象

2.文档对象模型(DOM)

文档对象模型(Document Object Model)是针对XML但经过扩张用于HTML的应用程序编程接口(API,Application Programming Interface)。DOM把整个页面映射为一个多层次节点结构。以HTML代码为例子


    
     DOM
         
            

DOM

Hello world

根据 DOM,HTML 文档中的每个成分都是一个节点。DOM 是这样规定的:整个文档是一个文档节点。每个 HTML 标签是一个元素节点。包含在 HTML 元素中的文本是文本节点。每一个 HTML 属性是一个属性节点。注释属于注释节点
每个节点彼此都有等级关系,HTML 文档中的所有节点组成了一个文档树(或节点树)。HTML 文档中的每个元素、属性、文本等都代表着树中的一个节点。树起始于文档节点,并由此继续伸出枝条,直到处于这棵树最低级别的所有文本节点为止。除文档节点之外的每个节点都有父节点。
以上列代码分析, 和 的父节点是 节点,文本节点 "Hello world!" 的父节点是

节点。
大部分元素节点都有子节点。比方说, 节点有一个子节点: 节点。<title> 节点也有一个子节点:文本节点 "DOM"。<br>当节点分享同一个父节点时,它们就是同辈(同级节点)。比方说,<h1> 和 <p>是同辈,因为它们的父节点均是 <body> 节点。<br>节点也可以拥有后代,后代指某个节点的所有子节点,或者这些子节点的子节点,以此类推。比方说,所有的文本节点都是 <html>节点的后代,而第一个文本节点是 <head> 节点的后代。<br>节点也可以拥有先辈。先辈是某个节点的父节点,或者父节点的父节点,以此类推。比方说,所有的文本节点都可把 <html> 节点作为先辈节点。</p> <b>2.1DOM级别</b> <p>DOM1级由两个模块组成:DOM核心和DOM HTML。其中,DOM核心规定是如何映射基于基于XML的文档结构,以便简化对文档中任意部分的访问和操作,DOM HTML则在DOM核心的基础上加以扩展,添加了针对HTML文档的对象和方法。<br>DOM2级在DOM的基础上又扩展了鼠标和用户界面事件、范围、遍历(迭代DOM文档的方法)等细分模块,而且通过对象接口增加对CSS的支持。<br>DOM3级则进一步扩展了DOM,引入了以统一方式加载和保存文档方法—在DOM加载和保存模块中定义;新增了验证文档的方法—在DOM验证模块定义。</p> <b>3.浏览器对象模型(BOM)</b> <p>开发人员可以通过BOM来控制浏览器显示的页面以外的部分。从根本上讲,BOM只处理浏览器窗口和框架;但人们习惯也把所有针对浏览器的JavaScript扩展算作BOM一部分。<br>1.弹出新浏览器窗口功能;<br>2.移动、缩放和关闭浏览器窗口的功能;<br>3.提供浏览器详细信息的navigatior对象;<br>4.提供浏览器所加载页面的详细信息的location对象;<br>5.提供用户显示器分辨率详细信息的scree对象<br>6.对cookies的支持<br>7.像XMLHttpRequest和IE的ActiveXObject这样的自定义对象。</p> <b>二:在HTML中使用JavaScript</b> <p>在HTML中插入JavaScript的主要方法,就是使用<script>元素。HTML4.0.1为<script>元素定义下列6个属性。<br>1.async:可选,表示应该立即下载脚本,但不妨碍页面中的其他操作,比如下载其他资源或等待其他脚本。<strong>只对外部脚本有效</strong><br>2.charset:可选,表示通过src属性指定的代码的字符集。(很少人用)<br>3.defer:可选,表示脚本可以延迟到文档完全被解析和显示之后再执行。<strong>只对外部脚本有效</strong><br>4.language:已经废弃。<br>5.src:可选。表示包含要执行代码的外部文件。<br>6.type:可选,浏览器已经默认了。<br><strong><em>一般把<script>元素放在<body>元素后面,为的是避免浏览器在呈现页面时候出现明显的延迟,也让JavaScript更好操作DOM</em></strong></p> <pre><script> function sayHi(){ var i = "wythe"; alert("</script>"); } <script></pre> <p>按照解析嵌入式代码规则,当浏览器遇到字符串</script>时候,就会认为那是结束的标签。而通过转义字符""解决这个问题,例如:</p> <pre><script> function sayHi(){ var i = "wythe"; alert("</script>"); } <script></pre> <b>三:JavaScript 基本概念</b> <p>3.1 区分大小写<br> JavaScript是区分大小写的,也就是说变量、函数、关键字和所有标识符都是区分大小写的。<br> 所谓的标识符,就是指得是变量、函数、属性的名字,或者函数的参数。标识符可以是按照下列格式规则组合起来的一或多个字符:</p> <pre>a.第一个字符必须是一个字母、下划线或一个美元符号($); b.其他字符可以是字母、下划线、美元符号或数字。</pre> <p>3.2 注释<br> JavaScript支持两种注释,包括单行注释和块级注释。<br> 单行注释以//开头,如://单行注释 <br> 多行注释则以一个斜杠和一个星号(/<em>)开头 以一个星号和一个斜杠( /</em>)结尾。<br>3.3保留字和关键字<br>JavaScript把一些标识符拿出来作为自己的关键字。因此,不能再在程序使用这些关键字作为标识符。如break、do、instanceof、typeof、var、case、if、while、function 和for等等...<br>保留字虽然还没有任何特定的用途,但它们将来可能用作关键字。如:int、short、boolean、goto和byte。<br>3.3变量<br>JavaScript的变量是松散类型的,所谓松散类型就是可以用来保存任何类型的数据。换句话说,每个变量仅仅是一个保存值的占位符而已。定义变量时候要使用var操作符,后跟变量名(标识符):var message;初始化的过程就是给变量赋一个值,因此,可以在修改变量值同时修改值的类型。</p> <pre>var message = "hi"; message = 100 //有效不推荐</pre> <p>有一点必须注意,即用var操作符定义的变量将成为定义该变量的作用域的局部变量。也就是说,在函数中使用var定义一个变量,那么这个变量在函数退出后就会销毁,除非定义一个全局变量。</p> <pre>function test(){ var a = "hello,wythe";//局部变量 b = "hello world";//全局变量 } test() console.log(a)//错误,a没有定义。 console.log(b)//hello,world</pre> <p>3.4数据类型<br>JavaScript的数据类型分为两类:原始类型和对象类型。原始类型包括数字(numner)、字符串(string)、布尔值(boolean)、undefined和null。对象类型则有object,object是属性的集合,每个属性都由名/值对(值可以是原始值,比如数字、字符串,也可以是对象)构成。<br>3.4.1typeof操作符<br>由于JavaScript是松散类型,因此需要有一种手段来检测给定变量的数据类型——typeof。对一个变量使用typeof操作符可能返回下列字符串:</p> <p><p>"undefined"—如果这个值未定义;</p></p> <p><p>"boolean"—如果这个值是布尔值;</p></p> <p><p>"string"—如果这个值是字符串;</p></p> <p><p>"number"—如果这个值是数值;</p></p> <p><p>"object"—如果这个值是对象或null <strong>数组也是对象,数组是一种特殊对象,表示带编号的值的有序集合</strong></p></p> <p><p>"function"—如果这个值是函数。<strong>函数是一种特殊对象,函数具有与它相关联的可执行代码的对象。通过调用函数来运行可执行代码,并返回运算结果</strong><br>对于null,typeof返回的是object,那是因为null被认为是一个空对象的引用。</p></p> <p>3.4.1 undefined类型<br>undefined类型只有一个值,那就是undefined。是变量的一种取值,表明值没有初始化。<br>3.4.2 null类型<br>null类型也是只有一个值,那就是null。typeof null 返回的是"object"也就是可以认为是一个特殊的对象值,含义是“非对象”。<br>undefined跟null都是表示值的空缺。null == undefined 会返回true 判断相等符“==” 认为两者相等。这个操作符出于比较的目的会转换其操作数。<br>3.4.3 number类型<br>JavaScript是不区分整数值和浮点数值的。最基本的字面量格式是十进制整数,除了十进制以外,还支持八位制(在严格模式下无效)或十六进制的字面值表示。浮点数值,就是该数值中必须包含一个小数点,并且小数点后面必须至少有一位数字。浮点数值的最高精度是17位小数,但在进行算术计算的时候其精确度远远不如整数。</p> <pre> var a = 0.1, b = 0.2; if(a+b == 0.3){ console.log("bingo"); }else{ console.log("error");//显示error } </pre> <p>因此尽量避免这样运算。NaN,即非数值是个特殊的值,这个数值表示一个本来要返回数值的操作数未返回数值的情况。0除以0会返回NaN,正数除以0返回Infinity,负数除以0返回-Infinity。NaN与任何值都不相等,包括自身。因此JavaScript定义isNaN函数,isNaN接受一个参数,该参数可以是任何类型,函数会判断该参数是否“不是数值”。isNaN接收一个之后,会尝试把这个值转为数值。</p> <pre> isNaN(1); //false isNaN("10");//会转换为数值10,返回false isNaN(true);//转换为数值1,返回false isNaN("blue");//不能转换为数值,返回true isNaN("true");//不能转为数值,返回true isNaN("11blue");//true,不能转为数值 </pre> <p>数值转换有3个函数可以把非数值转换为数值:Number()、parseInt()和parseFloat().第一个函数(Number)可以用于任何数据类型,而另两个函数专门把字符串转换为数值。<br>Number()函数的转换规则如下:</p> <p><p>如果是布尔值true和false,则分别转换为1和0</p></p> <p><p>如果是数字值,则返回该数值</p></p> <p><p>如果是null值,则返回0</p></p> <p><p>如果是undefined,则返回NaN</p></p> <p><p>如果是字符串,如果字符串只包含数字的话,则将其转为十进制数值,即“1”转为1,“123”则是123,“011”转为11(忽略前导的0),“11.1”则为11.1,"0xf"则转为相同大小的十进制整数。如果字符串是空,则将转为0;除此以外其他字符串,则转为NaN(“122blue”,“0a”,"a")。</p></p> <p><p>如果是对象,则调用对象的valueOf()方法,然后按照前面规则转换返回的值。如果转换的结果是NaN,则调用对象toString()方法,再次按照前面的规则转换返回的字符串值。<br>譬如Number({a:2})返回的是NaN,而Number([1])返回的是1</p></p> <p>未完待续...</p> </div> <div class="mt-64 tags-seach" > <div class="tags-info"> <a style="width:120px;" title="GPU云服务器" href="https://www.ucloud.cn/site/product/gpu.html">GPU云服务器</a> <a style="width:120px;" title="云服务器" href="https://www.ucloud.cn/site/active/kuaijiesale.html?ytag=seo">云服务器</a> <a style="width:120px;" title="javascript学习笔记" href="https://www.ucloud.cn/yun/tag/javascriptxuexibiji/">javascript学习笔记</a> <a style="width:120px;" title="学习笔记一" href="https://www.ucloud.cn/yun/tag/xuexibijiyi/">学习笔记一</a> <a style="width:120px;" title="javascript专题系列" href="https://www.ucloud.cn/yun/tag/javascriptzhuantixilie/">javascript专题系列</a> <a style="width:120px;" title="javascript深入系列" href="https://www.ucloud.cn/yun/tag/javascriptshenruxilie/">javascript深入系列</a> </div> </div> <div class="entry-copyright mb-30"> <p class="mb-15"> 文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。</p> <p>转载请注明本文地址:https://www.ucloud.cn/yun/80013.html</p> </div> <ul class="pre-next-page"> <li class="ellipsis"><a class="hpf" href="https://www.ucloud.cn/yun/80012.html">上一篇:TypeScript 初识</a></li> <li class="ellipsis"><a class="hpf" href="https://www.ucloud.cn/yun/80014.html">下一篇:自动化文件目录结构生成工具——filemap.js</a></li> </ul> </div> <div class="about_topicone-mid"> <h3 class="top-com-title mb-0"><span data-id="0">相关文章</span></h3> <ul class="com_white-left-mid atricle-list-box"> <li> <div class="atricle-list-right"> <h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/20067.html"><b>ApacheCN 编程/大数据/数据科学/人工智能<em>学习</em>资源 2019.6</b></a></h2> <p class="ellipsis2 good">摘要:请回复这个帖子并注明组织个人信息来申请加入。权限分配灵活,能者居之。数量超过个,在所有组织中排名前。网站日超过,排名的峰值为。导航归档社区自媒体平台微博知乎专栏公众号博客园简书合作侵权,请联系请抄送一份到赞助我们 Special Sponsors showImg(https://segmentfault.com/img/remote/1460000018907426?w=1760&h=...</p> <div class="com_white-left-info"> <div class="com_white-left-infol"> <a href="https://www.ucloud.cn/yun/u-1271.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/12/small_000001271.jpg" alt=""><span class="layui-hide64">Bmob</span></a> <time datetime="">2019-06-26 19:01</time> <span><i class="fa fa-commenting"></i>评论0</span> <span><i class="fa fa-star"></i>收藏0</span> </div> </div> </div> </li> <li> <div class="atricle-list-right"> <h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/92698.html"><b>JS<em>笔记</em></b></a></h2> <p class="ellipsis2 good">摘要:从最开始的到封装后的都在试图解决异步编程过程中的问题。为了让编程更美好,我们就需要引入来降低异步编程的复杂性。异步编程入门的全称是前端经典面试题从输入到页面加载发生了什么这是一篇开发的科普类文章,涉及到优化等多个方面。 TypeScript 入门教程 从 JavaScript 程序员的角度总结思考,循序渐进的理解 TypeScript。 网络基础知识之 HTTP 协议 详细介绍 HTT...</p> <div class="com_white-left-info"> <div class="com_white-left-infol"> <a href="https://www.ucloud.cn/yun/u-1041.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/10/small_000001041.jpg" alt=""><span class="layui-hide64">rottengeek</span></a> <time datetime="">2019-08-22 13:58</time> <span><i class="fa fa-commenting"></i>评论0</span> <span><i class="fa fa-star"></i>收藏0</span> </div> </div> </div> </li> <li> <div class="atricle-list-right"> <h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/92043.html"><b>CSS技巧</b></a></h2> <p class="ellipsis2 good">摘要:技巧使你的更加专业这是上关于技巧的一篇译文,另外你也可以在本项目看到原文。列举了一些很实用的技巧,比如给空内容的标签添加内容,逗号分隔列表等等。排序算法看源码,把它背下来吧排序算法的封装。主要帮助初学者更好的掌握排序算法的实现。 成为专业程序员路上用到的各种优秀资料、神器及框架 成为一名专业程序员的道路上,需要坚持练习、学习与积累,技术方面既要有一定的广度,更要有自己的深度。 Java...</p> <div class="com_white-left-info"> <div class="com_white-left-infol"> <a href="https://www.ucloud.cn/yun/u-369.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/03/small_000000369.jpg" alt=""><span class="layui-hide64">DangoSky</span></a> <time datetime="">2019-08-22 11:15</time> <span><i class="fa fa-commenting"></i>评论0</span> <span><i class="fa fa-star"></i>收藏0</span> </div> </div> </div> </li> <li> <div class="atricle-list-right"> <h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/112868.html"><b>CSS技巧</b></a></h2> <p class="ellipsis2 good">摘要:技巧使你的更加专业这是上关于技巧的一篇译文,另外你也可以在本项目看到原文。列举了一些很实用的技巧,比如给空内容的标签添加内容,逗号分隔列表等等。排序算法看源码,把它背下来吧排序算法的封装。主要帮助初学者更好的掌握排序算法的实现。 成为专业程序员路上用到的各种优秀资料、神器及框架 成为一名专业程序员的道路上,需要坚持练习、学习与积累,技术方面既要有一定的广度,更要有自己的深度。 Java...</p> <div class="com_white-left-info"> <div class="com_white-left-infol"> <a href="https://www.ucloud.cn/yun/u-466.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/04/small_000000466.jpg" alt=""><span class="layui-hide64">zgbgx</span></a> <time datetime="">2019-08-29 14:01</time> <span><i class="fa fa-commenting"></i>评论0</span> <span><i class="fa fa-star"></i>收藏0</span> </div> </div> </div> </li> <li> <div class="atricle-list-right"> <h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/20006.html"><b>ApacheCN 编程/大数据/数据科学/人工智能<em>学习</em>资源 2019.5</b></a></h2> <p class="ellipsis2 good">摘要:请回复这个帖子并注明组织个人信息来申请加入。版笔记等到中文字幕翻译完毕后再整理。数量超过个,在所有组织中排名前。网站日超过,排名的峰值为。主页归档社区自媒体平台微博知乎专栏公众号博客园简书合作侵权,请联系请抄送一份到赞助我们 Special Sponsors showImg(https://segmentfault.com/img/remote/1460000018907426?w=1...</p> <div class="com_white-left-info"> <div class="com_white-left-infol"> <a href="https://www.ucloud.cn/yun/u-1346.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/13/small_000001346.jpg" alt=""><span class="layui-hide64">zhonghanwen</span></a> <time datetime="">2019-06-26 18:55</time> <span><i class="fa fa-commenting"></i>评论0</span> <span><i class="fa fa-star"></i>收藏0</span> </div> </div> </div> </li> <li> <div class="atricle-list-right"> <h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/111977.html"><b>CSS技巧 - 收藏集 - 掘金</b></a></h2> <p class="ellipsis2 good">摘要:笔者作为一位,将工作以来用到的各种优秀资料神器及框架整理在此,毕竟好记性不如烂键盘,此前端知识点大百科全书前端掘金,,不定期更新技巧前端掘金技巧,偶尔更新。计算数组的极值技巧使你的更加专业前端掘金一个帮你提升技巧的收藏集。 CSS 样式画各种图形 - 前端 - 掘金下面是一些我在 CSS 中经常用到的图案,还有一些是在css-tricks看到的。记录一下,以后会用到。会持续更新… 一、...</p> <div class="com_white-left-info"> <div class="com_white-left-infol"> <a href="https://www.ucloud.cn/yun/u-921.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/09/small_000000921.jpg" alt=""><span class="layui-hide64">Jonathan Shieber</span></a> <time datetime="">2019-08-29 12:33</time> <span><i class="fa fa-commenting"></i>评论0</span> <span><i class="fa fa-star"></i>收藏0</span> </div> </div> </div> </li> </ul> </div> <div class="topicone-box-wangeditor"> <h3 class="top-com-title mb-64"><span>发表评论</span></h3> <div class="xcp-publish-main flex_box_zd"> <div class="unlogin-pinglun-box"> <a href="javascript:login()" class="grad">登陆后可评论</a> </div> </div> </div> <div class="site-box-content"> <div class="site-content-title"> <h3 class="top-com-title mb-64"><span>0条评论</span></h3> </div> <div class="pages"></ul></div> </div> </div> <div class="layui-col-md4 layui-col-lg3 com_white-right site-wrap-right"> <div class=""> <div class="com_layuiright-box user-msgbox"> <a href="https://www.ucloud.cn/yun/u-1485.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/14/small_000001485.jpg" alt=""></a> <h3><a href="https://www.ucloud.cn/yun/u-1485.html" rel="nofollow">Andrman</a></h3> <h6>男<span>|</span>高级讲师</h6> <div class="flex_box_zd user-msgbox-atten"> <a href="javascript:attentto_user(1485)" id="attenttouser_1485" class="grad follow-btn notfollow attention">我要关注</a> <a href="javascript:login()" title="发私信" >我要私信</a> </div> <div class="user-msgbox-list flex_box_zd"> <h3 class="hpf">TA的文章</h3> <a href="https://www.ucloud.cn/yun/ut-1485.html" class="box_hxjz">阅读更多</a> </div> <ul class="user-msgbox-ul"> <li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/130989.html">tensorflow</a></h3> <p>阅读 2500<span>·</span>2023-04-26 02:57</p></li> <li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/130788.html">tensorflow3</a></h3> <p>阅读 1389<span>·</span>2023-04-25 21:40</p></li> <li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/124712.html">头歌平台(EduCoder)————软件测试(测试过程与策略)</a></h3> <p>阅读 2122<span>·</span>2021-11-24 09:39</p></li> <li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/118586.html">BlueHost:美国VPS云主机,2核/2GB内存/20GB固态硬盘/2TB流量,49元/月</a></h3> <p>阅读 3504<span>·</span>2021-08-30 09:49</p></li> <li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/116940.html">[CSS]《CSS揭秘》第七章——结构与布局</a></h3> <p>阅读 714<span>·</span>2019-08-30 15:54</p></li> <li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/116412.html">新手程序员常犯的十个错误</a></h3> <p>阅读 1147<span>·</span>2019-08-30 15:52</p></li> <li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/116352.html">移动端适配之三:使用meta标签设置viewport</a></h3> <p>阅读 2030<span>·</span>2019-08-30 15:44</p></li> <li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/111242.html">我的前端开发准则</a></h3> <p>阅读 1258<span>·</span>2019-08-28 18:27</p></li> </ul> </div> <!-- 文章详情右侧广告--> <div class="com_layuiright-box"> <h6 class="top-com-title"><span>最新活动</span></h6> <div class="com_adbox"> <div class="layui-carousel" id="right-item"> <div carousel-item> <div> <a href="https://www.ucloud.cn/site/active/kuaijiesale.html?ytag=seo" rel="nofollow"> <img src="https://www.ucloud.cn/yun/data/attach/240625/2rTjEHmi.png" alt="云服务器"> </a> </div> <div> <a href="https://www.ucloud.cn/site/product/gpu.html" rel="nofollow"> <img src="https://www.ucloud.cn/yun/data/attach/240807/7NjZjdrd.png" alt="GPU云服务器"> </a> </div> </div> </div> </div> <!-- banner结束 --> <div class="adhtml"> </div> <script> $(function(){ $.ajax({ type: "GET", url:"https://www.ucloud.cn/yun/ad/getad/1.html", cache: false, success: function(text){ $(".adhtml").html(text); } }); }) </script> </div> </div> </div> </div> </div> </section> <!-- wap拉出按钮 --> <div class="site-tree-mobile layui-hide"> <i class="layui-icon layui-icon-spread-left"></i> </div> <!-- wap遮罩层 --> <div class="site-mobile-shade"></div> <!--付费阅读 --> <div id="payread"> <div class="layui-form-item">阅读需要支付1元查看</div> <div class="layui-form-item"><button class="btn-right">支付并查看</button></div> </div> <script> var prei=0; $(".site-seo-depict pre").each(function(){ var html=$(this).html().replace("<code>","").replace("</code>","").replace('<code class="javascript hljs" codemark="1">',''); $(this).attr('data-clipboard-text',html).attr("id","pre"+prei); $(this).html("").append("<code>"+html+"</code>"); prei++; }) $(".site-seo-depict img").each(function(){ if($(this).attr("src").indexOf('data:image/svg+xml')!= -1){ $(this).remove(); } }) $("LINK[href*='style-49037e4d27.css']").remove(); $("LINK[href*='markdown_views-d7a94ec6ab.css']").remove(); layui.use(['jquery', 'layer','code'], function(){ $("pre").attr("class","layui-code"); $("pre").attr("lay-title",""); $("pre").attr("lay-skin",""); layui.code(); $(".layui-code-h3 a").attr("class","copycode").html("复制代码 ").attr("onclick","copycode(this)"); }); function copycode(target){ var id=$(target).parent().parent().attr("id"); var clipboard = new ClipboardJS("#"+id); clipboard.on('success', function(e) { e.clearSelection(); alert("复制成功") }); clipboard.on('error', function(e) { alert("复制失败") }); } //$(".site-seo-depict").html($(".site-seo-depict").html().slice(0, -5)); </script> <link rel="stylesheet" type="text/css" href="https://www.ucloud.cn/yun/static/js/neweditor/code/styles/tomorrow-night-eighties.css"> <script src="https://www.ucloud.cn/yun/static/js/neweditor/code/highlight.pack.js" type="text/javascript"></script> <script src="https://www.ucloud.cn/yun/static/js/clipboard.js"></script> <script>hljs.initHighlightingOnLoad();</script> <script> function setcode(){ var _html=''; document.querySelectorAll('pre code').forEach((block) => { var _tmptext=$.trim($(block).text()); if(_tmptext!=''){ _html=_html+_tmptext; console.log(_html); } }); } </script> <script> function payread(){ layer.open({ type: 1, title:"付费阅读", shadeClose: true, content: $('#payread') }); } // 举报 function jupao_tip(){ layer.open({ type: 1, title:false, shadeClose: true, content: $('#jubao') }); } $(".getcommentlist").click(function(){ var _id=$(this).attr("dataid"); var _tid=$(this).attr("datatid"); $("#articlecommentlist"+_id).toggleClass("hide"); var flag=$("#articlecommentlist"+_id).attr("dataflag"); if(flag==1){ flag=0; }else{ flag=1; //加载评论 loadarticlecommentlist(_id,_tid); } $("#articlecommentlist"+_id).attr("dataflag",flag); }) $(".add-comment-btn").click(function(){ var _id=$(this).attr("dataid"); $(".formcomment"+_id).toggleClass("hide"); }) $(".btn-sendartcomment").click(function(){ var _aid=$(this).attr("dataid"); var _tid=$(this).attr("datatid"); var _content=$.trim($(".commenttext"+_aid).val()); if(_content==''){ alert("评论内容不能为空"); return false; } var touid=$("#btnsendcomment"+_aid).attr("touid"); if(touid==null){ touid=0; } addarticlecomment(_tid,_aid,_content,touid); }) $(".button_agree").click(function(){ var supportobj = $(this); var tid = $(this).attr("id"); $.ajax({ type: "GET", url:"https://www.ucloud.cn/yun/index.php?topic/ajaxhassupport/" + tid, cache: false, success: function(hassupport){ if (hassupport != '1'){ $.ajax({ type: "GET", cache:false, url: "https://www.ucloud.cn/yun/index.php?topic/ajaxaddsupport/" + tid, success: function(comments) { supportobj.find("span").html(comments+"人赞"); } }); }else{ alert("您已经赞过"); } } }); }); function attenquestion(_tid,_rs){ $.ajax({ //提交数据的类型 POST GET type:"POST", //提交的网址 url:"https://www.ucloud.cn/yun/favorite/topicadd.html", //提交的数据 data:{tid:_tid,rs:_rs}, //返回数据的格式 datatype: "json",//"xml", "html", "script", "json", "jsonp", "text". //在请求之前调用的函数 beforeSend:function(){}, //成功返回之后调用的函数 success:function(data){ var data=eval("("+data+")"); console.log(data) if(data.code==2000){ layer.msg(data.msg,function(){ if(data.rs==1){ //取消收藏 $(".layui-layer-tips").attr("data-tips","收藏文章"); $(".layui-layer-tips").html('<i class="fa fa-heart-o"></i>'); } if(data.rs==0){ //收藏成功 $(".layui-layer-tips").attr("data-tips","已收藏文章"); $(".layui-layer-tips").html('<i class="fa fa-heart"></i>') } }) }else{ layer.msg(data.msg) } } , //调用执行后调用的函数 complete: function(XMLHttpRequest, textStatus){ postadopt=true; }, //调用出错执行的函数 error: function(){ //请求出错处理 postadopt=false; } }); } </script> <footer> <div class="layui-container"> <div class="flex_box_zd"> <div class="left-footer"> <h6><a href="https://www.ucloud.cn/"><img src="https://www.ucloud.cn/yun/static/theme/ukd//images/logo.png" alt="UCloud (优刻得科技股份有限公司)"></a></h6> <p>UCloud (优刻得科技股份有限公司)是中立、安全的云计算服务平台,坚持中立,不涉足客户业务领域。公司自主研发IaaS、PaaS、大数据流通平台、AI服务平台等一系列云计算产品,并深入了解互联网、传统企业在不同场景下的业务需求,提供公有云、混合云、私有云、专有云在内的综合性行业解决方案。</p> </div> <div class="right-footer layui-hidemd"> <ul class="flex_box_zd"> <li> <h6>UCloud与云服务</h6> <p><a href="https://www.ucloud.cn/site/about/intro/">公司介绍</a></p> <p><a href="https://zhaopin.ucloud.cn/" >加入我们</a></p> <p><a href="https://www.ucloud.cn/site/ucan/onlineclass/">UCan线上公开课</a></p> <p><a href="https://www.ucloud.cn/site/solutions.html" >行业解决方案</a></p> <p><a href="https://www.ucloud.cn/site/pro-notice/">产品动态</a></p> </li> <li> <h6>友情链接</h6> <p><a href="https://www.compshare.cn/?ytag=seo">GPU算力平台</a></p> <p><a href="https://www.ucloudstack.com/?ytag=seo">UCloud私有云</a></p> <p><a href="https://www.surfercloud.com/">SurferCloud</a></p> <p><a href="https://www.uwin-link.com/">工厂仿真软件</a></p> <p><a href="https://pinex.it/">Pinex</a></p> <p><a href="https://www.picpik.ai/zh">AI绘画</a></p> </li> <li> <h6>社区栏目</h6> <p><a href="https://www.ucloud.cn/yun/column/index.html">专栏文章</a></p> <p><a href="https://www.ucloud.cn/yun/udata/">专题地图</a></p> </li> <li> <h6>常见问题</h6> <p><a href="https://www.ucloud.cn/site/ucsafe/notice.html" >安全中心</a></p> <p><a href="https://www.ucloud.cn/site/about/news/recent/" >新闻动态</a></p> <p><a href="https://www.ucloud.cn/site/about/news/report/">媒体动态</a></p> <p><a href="https://www.ucloud.cn/site/cases.html">客户案例</a></p> <p><a href="https://www.ucloud.cn/site/notice/">公告</a></p> </li> <li> <span><img src="https://static.ucloud.cn/7a4b6983f4b94bcb97380adc5d073865.png" alt="优刻得"></span> <p>扫扫了解更多</p></div> </div> <div class="copyright">Copyright © 2012-2023 UCloud 优刻得科技股份有限公司<i>|</i><a rel="nofollow" href="http://beian.miit.gov.cn/">沪公网安备 31011002000058号</a><i>|</i><a rel="nofollow" href="http://beian.miit.gov.cn/"></a> 沪ICP备12020087号-3</a><i>|</i> <script type="text/javascript" src="https://gyfk12.kuaishang.cn/bs/ks.j?cI=197688&fI=125915" charset="utf-8"></script> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?290c2650b305fc9fff0dbdcafe48b59d"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-DZSMXQ3P9N"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-DZSMXQ3P9N'); </script> <script> (function(){ var el = document.createElement("script"); el.src = "https://lf1-cdn-tos.bytegoofy.com/goofy/ttzz/push.js?99f50ea166557aed914eb4a66a7a70a4709cbb98a54ecb576877d99556fb4bfc3d72cd14f8a76432df3935ab77ec54f830517b3cb210f7fd334f50ccb772134a"; el.id = "ttzz"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(el, s); })(window) </script></div> </div> </footer> </body> <script src="https://www.ucloud.cn/yun/static/theme/ukd/js/common.js"></script> <<script type="text/javascript"> $(".site-seo-depict *,.site-content-answer-body *,.site-body-depict *").css("max-width","100%"); </script> </html>