javascript

使用 HTML5 拖放 拖拽 drag drop API

HTML5 拖放 (DnD) API 意味着页面上的几乎任何元素都可以变为可拖动。在本文中,我们将介绍拖放的基础知识。

创建可拖动的内容 #

值得注意的是,在大多数浏览器中,文本选择、图像和链接是默认可拖动的。例如,如果拖动谷歌搜索上的谷歌标志,您将看到重影图像。随后可以将该图像拖放到地址栏、 <input type="file" /> 元素,甚至桌面上。要使其他类型的内容可拖动,您需要使用 HTML5 DnD API。

要使对象可拖动,请对该元素设置 draggable=true。几乎任何元素都可以支持拖动,包括图像、文件、链接、文件或页面上的任何标记。

在我们的示例中,我们将创建一个界面来重新排列一些列,它们已通过 CSS Grid 进行布局。这些列的基本标记如下所示,每个列的 draggable 属性均设置为 true 。…

js 调用 angularJs 的方法

方法一:通过controller来获取

var appElement = document.querySelector('[ng-controller=mainController]');

// 获取$scope变量:
var $scope = angular.element(appElement).scope(); 

// 如果先调用 Controller 里面的方法的话

$scope.somefunc('xxx');

// 改变了值之后还需要调用一下下面的方法, 才可以刷新最新改变的内容

$scope.$apply()

方法二:通过DOM操作获取

//通过DOM操作获取app对象
var element = angular.element($document.getElementById("app")); // app 是ng-app所在的DOM元素的id的值
//得到app对象,可以获取app的controller
var controller = element.controller();
//得到app对象,可以获取app的$scope
var scope = element.scope();
//调用$scope中的方法

html5 javascript 网页响应式设计方案,网页适配方案

网页的设计的样式都由css控制,  我们的css大小单位,一般用 px,或rem,或vw,vh.

由px控制的大小是固定的,不具有响度式的.

响应式设计一般由两种方案实现.

一.rem方案.

实现方法 :

1.head中加 

<meta name="viewport" content="width=device-width, initial-scale=1.0" />
2.引入flexible.js
内容如下
(function flexible(window, document) {
  function resetFontSize() {
    const size = (document.documentElement.clientWidth / 1920) * 37.5;//1920为设计稿宽度 
    document.documentElement.style.fontSize = size + 'px';
  }

  // reset root 
                

使用 Multi-Screen Window Placement API 管理多个显示器

Multi-Screen Window Placement API 允许您枚举连接到您的机器的显示器并将窗口放置在特定的屏幕上。

建议用例 #

可能使用此 API 的网站示例包括:

  • à la Gimp 多窗口图形编辑器可以在精确定位的窗口中放置各种编辑工具。
  • 虚拟交易台可以在多个窗口中显示市场趋势,其中任何一个都可以在全屏模式下查看。
  • 幻灯片应用可以在内部主屏幕上显示演讲者备注,在外部投影仪上显示演示文稿。

javascript 异步操作的6种方法

异步操作的模式:

1 回调函数:callback
2 事件监听:onXxxx,addEventListener.
3 发布/订阅(设计模式)

4 Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了Promise对象

5 Generator 函数是 ES6 提供的一种异步编程解决方案,语法行为与传统函数完全不同,Generator 函数将 JavaScript 异步编程带入了一个全新的阶段。

6 async 函数:ES2017 标准引入了 async 函数,使得异步操作变得更加方便。 async 函数是什么?一句话,它就是 Generator 函数的语法糖。

 

当然 .定时器和ajax也可以看作是.

更多请查看

https://www.php.cn/website-design-ask-488572.html

https://blog.csdn.net/ZYS10000/article/details/104601839/

他来了!性能吊打 Node.js 和 Deno 的新一代 javaScript 运行时!

今天跟大家介绍一个最新开源的 javaScript 运行时:Bun.js

他来了!性能吊打 Node.js 和 Deno 的新一代 javaScript 运行时!_第1张图片

刚开源不到一个月就获得了 19.5k star!看起来马上就会成为 Node.js 和 Deno 的一大竞争对手了!

和传统的 Node.js 这种传统的 javaScript 运行时不同,Bun.js 直接内置了打包器、转译器、任务运行器和 npm 客户端,这意味着你不再需要 Webpack/Rollup/esbuild/Snowpack/Parcel/Rome/swc/babel 就可以直接运行 TypeScript、JSX!…