随笔分类 -  DOM

Web Api
摘要：所有的 web api，供以后查阅使用 获取 web api 的代码 <script> let names = Object.getOwnPropertyNames(window); function filterOut(names, props) { let set = new Set(); pr 阅读全文
posted @ 2020-07-10 16:17 jaiodfjiaodf 阅读(210) 评论(0) 推荐(0)
DOM viewport
摘要：今天学到了一个新的技巧，用鼠标点击 chrome dev tools 的 Elements 中的标签以后 ，使用 $0 就可以获取到鼠标所点击的 DOM 节点 然后总结一下 Dom Scroll 的 api。 常用的就是这几个。 $0.scrollBy(30, 30); $0.scrollTo(0, 阅读全文
posted @ 2020-07-10 14:16 jaiodfjiaodf 阅读(136) 评论(0) 推荐(0)
CSS OM
摘要：虽然放在 DOM 分类里面，但是 CSS OM 并不属于 DOM，而是并行的。仅为方便查找。 document.styleSheets <style title="hello"> a { color: red; } </style> <link rel="stylesheet" title="x" 阅读全文
posted @ 2020-07-10 12:31 jaiodfjiaodf 阅读(196) 评论(0) 推荐(0)
DOM Range Api
摘要：Range Api 1 （必要的 api） var range = new Range(); range.setStart(element, 9); range.setEnd(element, 4); var range = document.getSelection().getRangeAt(0) 阅读全文
posted @ 2020-07-10 11:33 jaiodfjiaodf 阅读(365) 评论(0) 推荐(0)
DOM 操作 2
摘要：题目 从一道面试题说起，给定下面的 html，如何把该 html 中 DOM 的 Children 逆序。 <div id="a"> <span>1</span> <p>2</p> <a>3</a> <div>4</div> </div> 解答一 该方法比较原始笨重，但是可以实现功能。思路大概就是获 阅读全文
posted @ 2020-07-10 09:43 jaiodfjiaodf 阅读(128) 评论(0) 推荐(0)
DOM Event
摘要：具体有很多的细节，网址在https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener react 的合成时间之前我也写过，翻翻博客就能看到。 Syntax // 仔细看，这个东西有三个参数 target.a 阅读全文
posted @ 2020-07-09 16:44 jaiodfjiaodf 阅读(148) 评论(0) 推荐(0)
DOM 操作
摘要：要知道一点，所有的 DOM 元素，都只能有一个父元素，它不能被两次插入到DOM 树中 如果我们把一个 DOM 节点插入到 document 的 a 位置，然后又把 DOM 节点插入到 document 的 b 位置，那么，它会默认把 a 位置的 DOM 节点 remove，再插入到 b 位置。 我们 阅读全文
posted @ 2020-07-09 15:22 jaiodfjiaodf 阅读(160) 评论(0) 推荐(0)
DOM 总览 （Browser Api）
摘要：![](https://img2020.cnblogs.com/blog/1735070/202007/1735070-20200709125102145-801700493.png) 阅读全文
posted @ 2020-07-09 12:51 jaiodfjiaodf 阅读(169) 评论(0) 推荐(0)
DOM Node 概览
摘要：![](https://img2020.cnblogs.com/blog/1735070/202007/1735070-20200709120435958-1367460797.png) 阅读全文
posted @ 2020-07-09 12:05 jaiodfjiaodf 阅读(95) 评论(0) 推荐(0)