拖更一个月，抱歉！（露出肚皮）
主要是过年+考研复习，最近没时间写博客
就分享下最近写的项目遇到的问题
观前提示：本篇文章所有内容基于Taro+React+typescript，我会尽量敲一遍ts代码再敲一遍js代码（快夸我贴心！快o(´^｀)o）,并且打包在小程序端，不讨论h5端的所有情况！！
最近碰到一个问题，是关于获取使用Taro来获取小程序中某元素的DOM节点的内容的，我尝试使用js原生的方法来获取
document.getElementsByClassName('demoDOM')
虽然获取的内容很全面
但是，这个方法还是原来的老毛病，太麻烦！而且无法获取其css样式
于是查了下官网，有了以下的新方案
let query = Taro.createSelectorQuery();
query.select('.demoDOM').boundingClientRect((res) => {
console.log(res);
}).exec()
如果写在生命周期函数中的话(vue和react的都要！)，需要添加一个200ms的延时定时器,否则会收获一个寂寞！
setTimeout(() => {
let query = Taro.createSelectorQuery();
query.select('.demoDOM').boundingClientRect((res) => {
console.log(res);
}).exec()
}, 200)
我获取的结果
有人肯定会问，哎这是什么玩玩，获取的就这么点东西，怎么能说是更好的解决方案呢？
且慢
仔细看里面的内容，这些都是无法使用上面的方法获取到的，在style属性中根本找不到！
而且，这些都是获取到的最基本的信息，我们可以也可以根据自己的需求返回我们想要的信息！
let query = Taro.createSelectorQuery();
query.select('.demoDOM').fields({
computedStyle: ['margin', 'backgroundColor']
}, (res) => {
console.log(res);
}).exec()
最后我们就会获得这个元素的外边距和背景颜色，这些都是实打实的样式，就算您把样式和类名或者id绑定，它都可以获取得到。
这里，如果您使用ts书写的话，如果您的属性不符合其要求或者属性名书写不规范的话，都会警告，记得盯紧这些细微的信息！
好了贴完代码了，如果您只是来cv搬砖的，今天的CSDN就看到这里吧！(bushi)接下来我们说下关键代码！
Taro.createSelectorQuery() : 返回一个 SelectorQuery 对象实例,也代表从这里开始寻找节点，建议使用参数来接收一下！
let ele = Taro.createSelectorQuery()
boundingClientRect((result) => void): 里面需要传入一个函数，返回所获取的所有结果，是个回调函数
Taro.createSelectorQuery().select('.demoDOM').boundingClientRect((res) => {
console.log(res, 'ddd');
})
exec(): 此处开始执行寻找DOM
Taro.createSelectorQuery().select('.demoDOM').boundingClientRect((res) => {
console.log(res, 'ddd');
}).exec()
fields(fields): 传入对象，里面填写所有想要搜寻的内容
let query = Taro.createSelectorQuery();
query.select('.demoDOM').fields({
dataset: true,
computedStyle: ['margin', 'backgroundColor', 'left', 'top', 'borderRadius'],
properties: ['scrollX', 'scrollY'],
scrollOffset: true,
size: true,
context: true
}, (res) => {
console.log(res);
}).exec()
所有合法参数见官网 官网–友情链接–直接打开，不要带犹豫，很快的！
如果您正在使用TS的话而且您的英语水平还算不错的话，建议跟着代码提示的脚步走
context( (res) => void): 添加节点的 Context 对象查询请求。目前支持 VideoContext、CanvasContext、LivePlayerContext、EditorContext和 MapContext 的获取。以便执行这些特殊标签的特殊动作！
以一个视频标签为例
Taro.createSelectorQuery().select('.videoDemo').context(function (res) {
console.log(res.context)
}).exec()
node( (res) => void): 获取当前元素的实例（只有canvas标签支持）
Taro.createSelectorQuery().select('.canvas').node(function(res){
console.log(res.node)
}).exec()
selectAll(string) : 搜寻所有符合条件的节点，返回一个数组
Taro.createSelectorQuery().selectAll('.demoDOM').boundingClientRect((res) => {
console.log(res, 'ddd');
}).exec()
selectViewport(string) 获取某个节点的滚动信息（前提是这个节点有滚轮（是ViewScroll组件））
这里不举例了，同上！
英文名很长，记得熟记！切记不要使用原生的方法获取DOM，这样会很消耗性能！这里诚心推荐使用TS，代码提示超级顺畅！