JS怎么调用API接口

JavaScript012

JS怎么调用API接口,第1张

需要准备的材料分别是：电脑、html编辑器、浏览器。

1、首先，打开html编辑器，新建html文件，例如：index.html，引入jquery使用。

2、在index.html的<script>标签中，输入js代码：

$.get('请求地址', function(b) {

document.body.innerText = b

})

3、浏览器运行index.html页面，此时通过F12的开发者工具可知API接口被调用了。

Document Object Model文档对象模型（JS用document操作网页）

Application Programming Interface应用程序接口，是一些预先定义的接口（函数，HTTP接口）

Chrome会有显示错误

自身属性：className、id、style等等

第一层 原型 HTMLDivElement.prototype ：这是所有div共有的属性

第二层 原型 HTMLElement.prototype ：这是所有HTML标签共有的属性

第三层 原型 Element.prototype ：这是所有XML、HTML标签共有的属性

第四层 原型 Node.prototype ：这是所有节点共有的属性，包括XML标签文本注释、HTML标签文本注释等等

第五层 原型 EventTarget.prototype ：里面最重要的函数属性是addEventListener

第六层 原型 Object.prototype

MDN中相关知识

创建一个标签节点

创建一个文本节点

标签里插入文本

插入页面中

创建的标签默认处于JS线程中，必须把它插入到head或者body里面才会生效， document.body.appendChild(div) 或者已在页面中的 元素.appendChild(div)

appendChild

假设页面中有div#test1和div#test2

那么div最终会出现在哪里呢？

答案：只在test2中，一个元素不能出现在两个地方，除非复制一份 node.cloneNode

如果一个node被移除页面（DOM树）那么他还可以再次回到页面中吗？

改class

改style

改style的一部分

注意大小写

改date属性

正常/特殊的读属性

（特殊）若使用

需要使用

这两种方法都可，但是值可能稍有不同

改事件处理函数

div.onclick 默认为null，默认点击div不会发生任何事，但是如果把 div.onclick 改为一个函数fn，那么点击div的时候，浏览器就会调用这个函数，并且是这样调用的 fn.call(div,event) ，div会被当做this，event则包含了点击事件的所有信息（如：坐标）

div.addEventListener 是 div.onclick 的升级版，后面会说明

查爸爸

查爷爷

查儿子

查兄弟姐妹

遍历div里面所有的元素

浏览器有渲染引擎和JS引擎

各线程各司其职。JS引擎不能操作页面只能操作JS；渲染引擎只能操作页面。

那么

这句JS是如何改变页面的呢？

跨线程通讯

当浏览器发现JS在body里面加了div1对象，就会通知渲染引擎在页面里也新增一个div元素，新增的div元素所有属性都照抄div1对象

JS线程中的所有属性叫做 div1的property

渲染引擎中div1对应标签的属性叫做 Attribute

区别

在Flex开发中有时候需要调用JS代码，例如关闭浏览器，或者是在某种情况下打开浏览器提示框等等。一般情况下Flex用ExternalInterface类的call()函数来调用JS代码，其中call()函数的参数就是String类型的JS代码段。

你可以调用Html页面中的JavaScript，通过与JavaScript的交互，可以改变Style，调用远程方法。还可以将数据传递给Html页

面，处理后再返回给Flex，完成这样的功能主要有两种方法：ExternalInterface()和navigateToUrl()。

在Flex调用JavaScript最简单的方法是使用ExternalInterface()，可以使用此API调用任意JavaScript，传递参

数，获得返回值，如果调用失败，Flex抛出一个异常。ExternalInterface封装了对浏览器支持的检查，可以用available属性来查

看。ExternalInterface的使用非常简单，语法如下：

flash.external.ExternalInterface.call(function_name:String[,arg1,...]):Object

参数function_name是要调用的JavaScript的函数名，后面的参数是JavaScript需要的参数。

As代码

ExternalInterface.call(FUNCTION_USEREXIT)

ExternalInterface.addCallback("checkExit",checkExit)

privatestaticvarFUNCTION_USEREXIT:String="document.insertScript=function()"+"

{"+"window.onbeforeunload=function()"+"{"+"varflexObj=MarineDataEdit.checkExit()

"+"if(flexObj!="")"+"{"+"returnflexObj"+"}else{"+"return"+"}"+"}"+"}"

publicfunctioncheckExit():String{varuserExitStr:String="你如果现在离开，则您的所有信息将失效！"

returnuserExitStr

ExternalInterface.call(FUNCTION_USEREXIT)

ExternalInterface.addCallback("checkExit",

checkExit)privatestaticvarFUNCTION_USEREXIT:String="document.insertScript=function()"+"

{"+"window.onbeforeunload=function()"+"{"+"varflexObj=MarineDataEdit.checkExit()

"+"if(flexObj!="")"+"{"+"returnflexObj"+"}else{"+"return"+"}"+"}"+"}"

publicfunctioncheckExit():String{varuserExitStr:String="你如果现在离开，则您的所有信息将失效！"

returnuserExitStr

其中ExternalInterface类的addCallback函数是调用AS端的返回值。