Web API学习笔记(四)

最新推荐文章于 2024-03-27 08:30:14 发布
最新推荐文章于 2024-03-27 08:30:14 发布
阅读量247 收藏
点赞数
分类专栏： 前端 文章标签： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Yearingforthefuture/article/details/106500463
版权

1.事件
addEventListener

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <input type="button" value="按钮" id="btn">
  <!-- <script src="user1.js"></script>
  <script src="user2.js"></script> -->

  <script>
    var btn = document.getElementById('btn');

    // 注册事件的第一种方式
    // 无法给同一个对象的同一个事件注册多个事件处理函数
    btn.onclick = function () {

    }

    btn.onclick = function () {

    }

    // 浏览器兼容性问题  IE9以后才支持
    btn.addEventListener('click', function () {
      alert('hello world');
    })

    btn.addEventListener('click', function () {
      alert('hello itheima');
    })

    // 注册事件的第三种方式  attachEvent
    // 浏览器兼容性问题  IE的老版本特有的方法  IE6-10支持
    
  </script>
</body>
</html>

attachEvent

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <input type="button" value="按钮" id="btn">
  <script>
    var btn = document.getElementById('btn');

    // 第一个参数，事件的名称前要加 on
    btn.attachEvent('onclick', function () {
      alert('hello world');
    });

    btn.attachEvent('onclick', function () {
      alert('hello itheima');
    });
  </script>
</body>
</html>

处理兼容性问题

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <input type="button" value="按钮" id="btn">
  <script>
    var btn = document.getElementById('btn');

    addEventListener(btn, 'click', function () {
      alert('hello world');
    });

    addEventListener(btn, 'click', function () {
      alert('hello itheima');
    });


    // 处理注册事件的兼容性问题
    // eventName, 不带on，  click  mouseover  mouseout
    function addEventListener(element, eventName, fn) {
      // 判断当前浏览器是否支持addEventListener 方法
      if (element.addEventListener) {
        element.addEventListener(eventName, fn);  // 第三个参数 默认是false
      } else if (element.attachEvent) {
        element.attachEvent('on' + eventName, fn);
      } else {
        // 相当于 element.onclick = fn;
        element['on' + eventName] = fn;
      }
    }
  </script>
</body>
</html>

移除事件

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <input type="button" value="按钮" id="btn">
  <script>
    var btn = document.getElementById('btn');
    // btn.onclick = function () {
    //   alert('hello world');
    //   // 移除事件
    //   btn.onclick = null;
    // }
    // 
    // 如果想要移除事件，注册事件的时候不能使用匿名函数
    // btn.addEventListener('click', function () {
    //   alert('hello world'); 
    //   // 移除事件
    //   btn.removeEventListener('click', )
    // });
    // 
    // function btnClick () {
    //   alert('hello world');
    //   // 移除事件
    //   btn.removeEventListener('click', btnClick);
    // }
    // btn.addEventListener('click', btnClick);
    // 
    // chrome 中不支持attachEvent。 IE9-10
    function btnClick() {
      alert('hello world');
      // 移除事件
      btn.detachEvent('onclick', btnClick);
    }
    btn.attachEvent('onclick', btnClick);
  </script>
</body>
</html>

处理移除事件兼容性问题

/ 处理注册事件的兼容性问题
// eventName, 不带on，  click  mouseover  mouseout
function addEventListener(element, eventName, fn) {
  // 判断当前浏览器是否支持addEventListener 方法
  if (element.addEventListener) {
    element.addEventListener(eventName, fn);  // 第三个参数 默认是false
  } else if (element.attachEvent) {
    element.attachEvent('on' + eventName, fn);
  } else {
    // 相当于 element.onclick = fn;
    element['on' + eventName] = fn;
  }
}

// 处理移除事件的兼容性处理
function removeEventListener(element, eventName, fn) {
  if (element.removeEventListener) {
    element.removeEventListener(eventName, fn);
  } else if (element.detachEvent) {
    element.detachEvent('on' + eventName, fn);
  } else {
    element['on' + eventName] = null;
  }
}

addEventListener 的第三个参数的作用
addEventListener 的第三个参数为false的时候 ： 事件冒泡
addEventListener 的第三个参数为true的时候 ： 事件捕获
attachEvent只有两个参数， 只有事件冒泡
box.attachEvent(‘onclick’, function () {
});

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    #box1 {
      width: 300px;
      height: 300px;
      background-color: red;
    }

    #box2 {
      width: 200px;
      height: 200px;
      background-color: green;
    }

    #box3 {
      width: 100px;
      height: 100px;
      background-color: blue;
    }
  </style>
</head>
<body>
  <div id="box1">
    <div id="box2">
      <div id="box3">
      </div>
    </div>
  </div>
  <script>
    // addEventListener 的第三个参数的作用
    var box1 = document.getElementById('box1');
    var box2 = document.getElementById('box2');
    var box3 = document.getElementById('box3');

    var array = [box1, box2, box3];

    // addEventListener 的第三个参数为false的时候 ： 事件冒泡
    // addEventListener 的第三个参数为true的时候 ：  事件捕获
    
    // 事件的三个阶段：
    // 第一个阶段： 捕获阶段
    // 第二个阶段： 执行当前点击的元素
    // 第三个阶段： 冒泡阶段
    // for (var i = 0; i < array.length; i++) {
    //   array[i].addEventListener('click', function () {
    //     console.log(this.id);
    //   }, true);
    // }

    // document.body.addEventListener('click', function () {
    //   console.log('body');
    // }, true);


    // box.onclick  只有事件冒泡
    // box.attachEvent
    // attachEvent只有两个参数， 只有事件冒泡
    // box.attachEvent('onclick', function () {
    // });
    

    for (var i = 0; i < array.length; i++) {
      var box = array[i];
      box.onclick = function () {
        console.log(this.id);
      }
    }
    document.body.onclick = function () {
      console.log('body');
    }

    document.onclick = function () {
      console.log('document');
    }
  </script> 
</body>
</html>

事件委托

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <ul id="ul">
    <li>西施</li>
    <li>貂蝉</li>
    <li>昭君</li>
    <li>凤姐</li>
    <li>芙蓉姐姐</li>
  </ul>
  <script>
    // 事件委托： 原理事件冒泡
    var ul = document.getElementById('ul');
    ul.onclick = function (e) {
      // e 事件参数（事件对象）: 当事件发生的时候，可以获取一些和事件相关的数据
      // 获取到当前点击的li
      // e.target 是真正触发事件的对象
      // console.log(e.target);
      // 让当前点击的li高亮显示
      e.target.style.backgroundColor = 'red';
    }
  </script>
</body>
</html>

事件对象
e就是事件对象
在老版本的IE中获取事件对象的方式 window.event
处理事件对象的浏览器兼容性
e = e || window.event;

e.currentTarget 事件处理函数所属的对象this

e.target 获取真正触发事件的对象 浏览器兼容问题
在老版本的IE中 srcElement
处理兼容性问题
var target = e.target || e.srcElement;

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    #box1 {
      width: 300px;
      height: 300px;
      background-color: red;
    }

    #box2 {
      width: 200px;
      height: 200px;
      background-color: green;
    }

    #box3 {
      width: 100px;
      height: 100px;
      background-color: blue;
    }
  </style>
</head>
<body>
  <input type="button" value="按钮" id="btn">
  <div id="box1">
    <div id="box2">
      <div id="box3">
      </div>
    </div>
  </div>
  <script>
    // 通过事件对象，可以获取到事件发生的时候和事件相关的一些数据
    
    var box1 = document.getElementById('box1');
    var box2 = document.getElementById('box2');
    var box3 = document.getElementById('box3'); 
    var array = [box1, box2, box3];
    for (var i = 0; i < array.length; i++) {
      var box = array[i];
      box.onclick = function (e) {
        e = e || window.event;
        // 事件的阶段
        console.log(e.eventPhase);
        // e.target 获取真正触发事件的对象
        var target = e.target || e.srcElement;
        console.log(target);
        // e.curentTarget   和this一样 获取事件处理函数所属的对象
        console.log(e.currentTarget);
        console.log(this);
      }
    }

     
    
    // var btn = document.getElementById('btn');
    // btn.onclick = function (e) {
    //   // DOM标准中，是给事件处理函数一个参数
    //   // e就是事件对象
    //   // 在老版本的IE中获取事件对象的方式  window.event
    //   // 
    //   // 处理事件对象的浏览器兼容性
    //   e = e || window.event;

    //   // 事件的阶段：1  捕获阶段   2  目标阶段  3 冒泡阶段    了解
    //   // console.log(e.eventPhase);
      
    //   // e.target  获取真正触发事件的对象  浏览器兼容问题
    //   // 在老版本的IE中  srcElement
    //   // 处理兼容性问题
    //   var target = e.target || e.srcElement;
    //   console.log(e.target);

    //   // 
    //   // e.currentTarget  事件处理函数所属的对象this
    //   console.log(e.currentTarget);
    // }
  </script>
</body>
</html>

e.type点击类型

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    body {
      margin: 0;
    }
    #box {
      margin: 100px;
      width: 200px;
      height: 200px;
      background-color: red;
    }
  </style>
</head>
<body>
  <div id="box">
  </div> 
  <script>
    var box = document.getElementById('box');
    // box.onclick = function (e) {
    //   e = e || window.event;
    //   // 获取事件名称
    //   console.log(e.type);
    // }
    
    box.onclick = fn;
    box.onmouseover = fn;
    box.onmouseout = fn;

    function fn(e) {
      e = e || window.event;
      switch (e.type) {
        case 'click': 
          console.log('点击box');
          break;
        case 'mouseover': 
          console.log('鼠标经过box');
          break;
        case 'mouseout': 
          console.log('鼠标离开box');
          break;
      }
    }

  </script>
</body>
</html>

事件获取坐标

获取的鼠标在浏览器的可视区域的坐标
e.clientX
e.clientY

鼠标在当前页面的位置
e.pageX
e.pageY

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    body {
      margin: 0;
      height: 1000px;
    }
    #box {
      margin: 100px;
      margin-top: 500px;
      width: 200px;
      height: 200px;
      background-color: red;
    }
  </style>
</head>
<body>
  <div id="box">
  </div> 
  <script>
    var box = document.getElementById('box');
    box.onclick = function (e) {
      e = e || window.event;

      // 获取的鼠标在浏览器的可视区域的坐标
      // console.log(e.clientX);
      // console.log(e.clientY);

      // 鼠标在当前页面的位置
      console.log(e.pageX);
      console.log(e.pageY);

    }

  </script>
</body>
</html>

图片跟着鼠标走案例

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    body {
      height: 1000px;
    }
    #ts {
      position: absolute;
    }
  </style>
</head>
<body>
  <img src="images/tianshi.gif" id="ts" alt="">
  <script>
    var ts = document.getElementById('ts');
    document.onmousemove = function (e) { 
      e = e || window.event;
      // ts.style.left = e.clientX - 10 + 'px';
      // ts.style.top = e.clientY - 10 + 'px';

      ts.style.left = e.pageX - 10 + 'px';
      ts.style.top = e.pageY - 10 + 'px';
    }
  </script>
</body>
</html>

获取页面滚动出去的距离
获取页面滚动距离的浏览器兼容性问题

输出页面滚动出去的距离
document.body.scrollLeft
document.body.scrollTop

documentElement 文档的根元素 html标签
document.documentElement

有些浏览器 是使用这两个属性来获取的
document.documentElement.scrollLeft
document.documentElement.scrollTop

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    body {
      height: 1000px;
    }
  </style>
</head>
<body>
  <script>
    // e.clientX/e.clientY   鼠标在可视区域中的位置
    // 
    // e.pageX/e.pageY       鼠标在页面中的位置 有兼容性问题  从IE9以后才支持
    
    // pageY = clientY + 页面滚动出去的距离

    document.onclick = function () {
      // // 输出页面滚动出去的距离
      // console.log(document.body.scrollLeft);
      // console.log(document.body.scrollTop);

      // // documentElement  文档的根元素  html标签
      // // console.log(document.documentElement);
      // // 有些浏览器 是使用这两个属性来获取的
      // console.log(document.documentElement.scrollLeft);
      // console.log(document.documentElement.scrollTop);

    }

    // 获取页面滚动距离的浏览器兼容性问题
    // 获取页面滚动出去的距离
    function getScroll() {
      var scrollLeft = document.body.scrollLeft || document.documentElement.scrollLeft;
      var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
      return {
        scrollLeft: scrollLeft,
        scrollTop: scrollTop
      }
    }

  </script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    body {
      height: 1000px;
    }
  </style>
</head>
<body>
  <script src="common.js"></script>
  <script>
    // e.clientX/e.clientY   鼠标在可视区域中的位置
    // 
    // e.pageX/e.pageY       鼠标在页面中的位置 有兼容性问题  从IE9以后才支持
    
    // pageY = clientY + 页面滚动出去的距离

    document.onclick = function (e) {
      e = e || window.event;
      console.log(getPage(e).pageX);
      console.log(getPage(e).pageY);

    }

    // 获取鼠标在页面的位置，处理浏览器兼容性
    function getPage(e) {
      var pageX = e.pageX || e.clientX + getScroll().scrollLeft;
      var pageY = e.pageY || e.clientY + getScroll().scrollTop;
      return {
        pageX: pageX,
        pageY: pageY
      }
    }



  </script>
</body>
</html>

获取盒子在页面上的位置
this.offsetLeft
this.offsetTop

获取鼠标在盒子中的位置案例

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    body {
      margin: 0;
    }

    #box {
      width: 300px;
      height: 300px;
      border: 1px solid red;
      margin: 100px 10px 10px 100px;
    }
  </style>
</head>
<body>
  <div id="box">
    
  </div>
  <script src="common.js"></script>
  <script>
    var box = document.getElementById('box');
    box.onclick = function (e) {
      // 获取盒子在页面上的位置
      // console.log(this.offsetLeft);
      // console.log(this.offsetTop);

      e = e || window.event;
      // 获取鼠标在盒子中的位置 = 鼠标的坐标 - 盒子的坐标
      // var x = e.pageX
      var x = getPage(e).pageX - this.offsetLeft;
      var y = getPage(e).pageY - this.offsetTop;
      console.log(x);
      console.log(y);

    }
  </script>
</body>
</html>

取消默认行为的执行

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <a id="link" href="http://www.baidu.com">baidu</a>
  <script>
    var link = document.getElementById('link');
    link.onclick = function (e) {
      alert('hello');

      // 取消默认行为执行
      // return false;   
      
      // DOM标准方法
      // e.preventDefault();

      // IE的老版本，非标准方式
      // e.returnValue = false;
    }
  </script>
</body>
</html>

阻止冒泡
取消冒泡 非标准的方式 老版本的IE支持
e.cancelBubble = true;

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    #box1 {
      width: 300px;
      height: 300px;
      background-color: red;
    }

    #box2 {
      width: 200px;
      height: 200px;
      background-color: green;
    }

    #box3 {
      width: 100px;
      height: 100px;
      background-color: blue;
    }
  </style>
</head>
<body>
  <div id="box1">
    <div id="box2">
      <div id="box3">
      </div>
    </div>
  </div>
  <script>
    // 事件冒泡
    var box1 = document.getElementById('box1');
    var box2 = document.getElementById('box2');
    var box3 = document.getElementById('box3');

    var array = [box1, box2, box3];

    for (var i = 0; i < array.length; i++) {
      var box = array[i];
      box.onclick = function (e) {
        console.log(this.id);

        // Propagation 传播
        // 停止事件传播  取消冒泡
        // 标准的DOM方法
        // e.stopPropagation();
        
        // 取消冒泡  非标准的方式 老版本的IE支持
        e.cancelBubble = true;
      }
    }
   

  </script> 
</body>
</html>

键盘事件
keydown 键盘按下的时候
keyup 键盘弹起的时候

keydown 和 keyup的区别
keydown的时候我们所按的键还没有落入文本框
keyup键盘弹起的时候按的键已经落入文本框

e.keyCode 键盘码
按下后退键 8，删除一个字符
e.keyCode == 8

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script>
    
  </script>
</head>
<body>
  <input id="txt" type="text">
  <script>
    // 键盘事件
    // keydown 键盘按下的时候
    // keyup   键盘弹起的时候
    // keydown 和 keyup的区别  keydown的时候我们所按的键还没有落入文本框
    // keyup键盘弹起的时候按的键已经落入文本框
    var txt = document.getElementById('txt');
    txt.onkeydown = function (e) {
      // 判断当前用户按下的键是否是数字
      e = e || window.event;

      // 如果e.keyCode 的值在 48-57 是数字
      // e.keyCode  键盘码
      // console.log(e.keyCode);
      // 按下后退键  8，删除一个字符 
      if ((e.keyCode < 48 || e.keyCode > 57) && e.keyCode !== 8) {
        // 非数字
        // 取消默认行为
        e.preventDefault();
        // return false;
      }


    }
  </script>
</body>
</html>
Java追求者
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
前端JS学习笔记——Web API简介
zerocean_的博客
03-11 1525
JS的组成 Web APIs是W3C的标准，属于JS独有的部分，这部分内容主要学习页面的交互 那么Web API和APi又有什么不同呢？ APl（Application Programming Interface，.应用程序程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。 Web API是浏览器提供的一套操作浏览器功能和页面元素的API（BOM和DOM）。 Web API很多都是方法（函数），一般都有
Asp.NETCore WebAPI学习笔记汇总.rar
04-07
ASP.NET Core Web API 学习笔记汇总.pdf 是一个聚焦于使用ASP.NET Core构建Web API的资源集合。ASP.NET Core是一个由微软开发的现代化、高性能、开源的框架，它旨在为开发者提供构建各种类型的应用程序的能力，包括...
Web API 学习笔记 - fetch
灵台方寸山斜月三星洞
08-03 1319
Web API 接口 - 学习笔记【fetch】取 json取 text参考资料 取 json fetch('https://voice.baidu.com/act/newpneumonia/newpneumonia/') .then(response=>response.json()) .then(json=> console.log(json)); 取 text Body.text() fetch('https://voice.baidu.com/act/newpneumonia/newp
Web API学习笔记（二）—— 基本WebApi架构配置详解
weixin_45724919的博客
09-02 1254
Host 提供了使用预先配置的默认值创建 IHostBuilder 实例的方便方法。
Restful和WeBAPI学习笔记
liudanyang_21的博客
06-24 1489
1、restful是基于无状态的,所谓无状态就是说客户端和服务端的每次通话都是独立的,不存在session和cookie之类的保存状态的机制,基于该协议可实现简单的curd操作, 其操作分为get\post\delete\add等，说白了restful指的是一组架构约束条件和原则对安全性要求不高,如果实现较复杂的逻辑推荐使用web service.数据通信默认采用json格式传输,通信方式可以基于ajax,webform,当然服务端取值方式也会不一样. 2asp.net mvc中的webapi也是基于res
Web API学习笔记（四）——添加一个控制器类(Controller class)
weixin_45724919的博客
09-05 1476
也就是说这个请求匹配了多个端点（endpoint）,他分不清请求的这个端，是Get方法还是Get1方法，每个端只能对应一个方法。HTTP 500错误，全称为HTTP 500 Internal Server Error，即HTTP 500内部服务器错误。ContrllerBsse 类中we提供了很多方法和属性去处理HTTP请求。3.多部分（Multipart）/表单数据（form-data）请求推断。还可以直接使用方法名称来获取端点，请求Http。如果再添加一个Get1方法，如下代码所示。
WebAPI学习开发总结
Draco_1989的博客
08-25 1020
webapi、VS2019、接口调用
Web API学习笔记（六）——路由（Routing）
weixin_45724919的博客
09-05 1632
1.路由是将传入http请求（URL）映射到特定资源的过程（a action method）。2.我们可以使用唯一的URL访问任何的资源。3.一个资源可以有多个唯一的URL。4.多个资源不能具有相同的URL。
接口开发笔记-WebApi
weixin_63658665的博客
03-27 2057
记录了weiapi学习过程中的一些基本操作
【学习笔记】WebAPI
weixin_45305844的博客
07-31 987
文章目录导读什么是 API？什么是 DOM?DOM 树DOM操作获取页面元素根据ID获取根据标签名获取通过HTML5新增的方法获取特殊元素获取改变元素内容密码显示隐藏案例标签属性操作获取属性更改属性移除属性修改类名classList 类名操作修改元素样式自定义属性节点操作节点概述：获取父节点获取子节点获取兄弟节点创建和添加元素节点document.writeinnerHTML和createElement()效率对比：事件事件三要素执行事件的步骤排他思想鼠标事件鼠标焦点事件鼠标经过和离开事件mouseente
.Net 6.0学习笔记：WebApi配置跨域
uMson_n的博客
03-05 4258
.Net 6.0 WebApi跨域配置
Web Service学习笔记
03-01
在本学习笔记中，我们将深入探讨Web服务的核心概念、技术栈以及实际案例。 一、Web服务的核心概念 1. **SOAP (Simple Object Access Protocol)**：SOAP是一种基于XML的协议，用于交换结构化信息，是Web服务的基础...
web前端学习笔记以及代码
02-24
本压缩包“web前端学习笔记以及代码”显然包含了一套完整的前端学习资源，包括理论知识和实践代码，这对于初学者或者希望提升技能的开发者来说非常有价值。 首先，前端开发通常涵盖以下关键知识点： 1. HTML...
JAVA WEB学习笔记
08-02
【JAVA WEB学习笔记】 Java Web是Java技术在Web开发领域中的应用，涵盖了从服务器端编程到客户端交互的各种技术。这份学习笔记将带你深入理解Java Web的核心概念和实践技巧。 1. **Servlet与JSP** - Servlet是...
Asp.NET Core WebAPI 入门学习笔记，超详细
04-07
WebAPI 是一种传统的方式，用于构建和暴露 RESTUI风格的Web服务。它提供了丰富的功能和灵活性，可以处理各种HTTP请求，并支持各种数据格式，如JSON、XML等。 WebAPI使用控制器(Controllers)和动作方法(ActionMethods...
2024年东南亚二硫代氨基甲酸酯类杀菌剂市场深度研究及预测报告.pdf
最新发布
07-08
东南亚位于我国倡导推进的“一带一路”海陆交汇地带，作为当今全球发展最为迅速的地区之一，近年来区域内生产总值实现了显著且稳定的增长。根据东盟主要经济体公布的最新数据，印度尼西亚2023年国内生产总值（GDP）增长5.05%；越南2023年经济增长5.05%；马来西亚2023年经济增速为3.7%；泰国2023年经济增长1.9%；新加坡2023年经济增长1.1%；柬埔寨2023年经济增速预计为5.6%。 东盟国家在“一带一路”沿线国家中的总体GDP经济规模、贸易总额与国外直接投资均为最大，因此有着举足轻重的地位和作用。当前，东盟与中国已互相成为双方最大的交易伙伴。中国-东盟贸易总额已从2013年的443亿元增长至 2023年合计超逾6.4万亿元，占中国外贸总值的15.4％。在过去20余年中，东盟国家不断在全球多变的格局里面临挑战并寻求机遇。2023东盟国家主要经济体受到国内消费、国外投资、货币政策、旅游业复苏、和大宗商品出口价企稳等方面的提振，经济显现出稳步增长态势和强韧性的潜能。 本调研报告旨在深度挖掘东南亚市场的增长潜力与发展机会，分析东南亚市场竞争态势、销售模式、客户偏好、整体市场营商环境，为国内企业出海开展业务提供客观参考意见。 本文核心内容： 市场空间：全球行业市场空间、东南亚市场发展空间。 竞争态势：全球份额，东南亚市场企业份额。 销售模式：东南亚市场销售模式、本地代理商 客户情况：东南亚本地客户及偏好分析 营商环境：东南亚营商环境分析 本文纳入的企业包括国外及印尼本土企业，以及相关上下游企业等，部分名单 QYResearch是全球知名的大型咨询公司，行业涵盖各高科技行业产业链细分市场，横跨如半导体产业链（半导体设备及零部件、半导体材料、集成电路、制造、封测、分立器件、传感器、光电器件）、光伏产业链（设备、硅料/硅片、电池片、组件、辅料支架、逆变器、电站终端）、新能源汽车产业链（动力电池及材料、电驱电控、汽车半导体/电子、整车、充电桩）、通信产业链（通信系统设备、终端设备、电子元器件、射频前端、光模块、4G/5G/6G、宽带、IoT、数字经济、AI）、先进材料产业链（金属材料、高分子材料、陶瓷材料、纳米材料等）、机械制造产业链（数控机床、工程机械、电气机械、3C自动化、工业机器人、激光、工控、无人机）、食品药品、医疗器械、农业等。邮箱：market@qyresearch.com
04N50C3-VB TO252一款N-Channel沟道TO252的MOSFET晶体管参数介绍与应用说明
07-08
04N50C3-VB TO252；Package：TO252；Configuration：Single-N-Channel；VDS：650V；VGS：30（±V）；Vth：3.5V；RDS(ON)=1000mΩ@VGS=10V；ID：5A；Technology：SJ_Multi-EPI；
体积阵波束形成-赵海朝.pdf
07-08
体积阵波束形成-赵海朝.pdf
python读取csv文件.txt
07-08
python数据分析与可视化

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值