可能会取不到。
子组件需要调用父组件传过来的数据，如果这个数据是异步从接口里取的，那这个组件在任何生命周期里都取不到，而应该在接口调取后取到。
节点至少拥有nodeType（节点类型），nodeName（节点名称），nodeValue（节点值）三个基础属性
（1）元素节点---nodeType为1
（2）属性节点---nodeName为2
（3）文本节点---nodeValue为3 （文本节点包含文字、空格、换行等）
2、节点的层级
DOM根据HTML中各节点的不同作用，可将其分别划分为标签节点（元素节点）、文本节点和属性节点
（1）根节点：<html>就是根节点，有且只有一个
（2）父节点：一个节点的上级节点
（3）子节点：一个节点的下级节点
（4）兄弟节点：具有相同父节点的节点
二、节点 *** 作
1、获取父节点
elementparentNode
2、获取子节点
（1）elementchildNodes：获得的是当前元素的所有子节点的集合（所有类型的子节点）
（2）elementchildren：是一个可读的属性，返回所有子元素节点
（3）firstChild：获取第一个子节点
（4）lastChild：获取最后一个子节点
（5）firstElementChild：获取第一个元素子节点
（6）lastElementChild：获取最后一个子元素节点
3、获取兄弟节点
（1）nextSibling：获取下一个兄弟节点
（2）previousSibling：获取上一个兄弟节点
（3）nextElementSibling：获取下一个兄弟元素(标签)节点
（4）previousElementSibling：获取前一个兄弟元素节点
<body>
<div class="demo">
<div class="box">
<h2>一二三四五</h2>
<span class="child">上山打老虎</span>
<p>注意！（保护国家保护动物）</p>
</div>
</div>
<div>
<ul>
<li id="l1">红楼梦</li>
<li>水浒传</li>
<li>三国演义</li>
<li>西游记</li>
</ul>
</div>
<script>
var child = documentquerySelector('child')
consolelog(childparentNode);
var ul = documentquerySelector('ul');
var lis = ulquerySelectorAll('li');
consolelog(lis);
consolelog("通过childNodes获得的子节点",ulchildNodes);
consolelog("children",ulchildren);
consolelog("ul的子节点",ulchildNodes);
consolelog("ul第一个子节点的类型：",ulchildNodes[0]nodeType);
consolelog("ul的第二个字节点类型：",ulchildNodes[1]nodeType);//1是元素，也叫标签
consolelog("ul的第一个子节点",ulfirstChild);
consolelog("ul的最后一个子节点：",ullastChild);
consolelog("ul的第一个子元素节点",ulfirstElementChild)
consolelog("ul的最后一个子元素节点",ullastElementChild)
var span = documentquerySelector('child');
consolelog("span的兄弟节点",spannextSiblingnextSibling)
consolelog("span的前一个兄弟节点",spanpreviousElementSibling)
</script>
</body>
登录后复制

4、创建节点
（1）doumentwrite():若页面加载完毕,再次调用该方法导致页面重绘
（2）elementinnerHTML：将节点加入到元素中,导致页面部分重绘
（3）documentcreateElement()：创建节点结构清晰、效率不高
5、添加和删除节点
（1）appendChild()：将节点添加到指定父节点的已有子节点的末尾
（2）insertBefore()：将节点添加到指定父节点的已有子节点的前面
（3）removeChild(child)：删除一个指定的节点。返回值为删除的节点
6、克隆节点
cloneNode(true/false)：复制节点
（1）true：深拷贝,复制节点本身和所有子节点
（2）false(或空)：浅拷贝,只复制节点本身
DOM： Document Object Model，文档对象模型；js提供了丰富的api来 *** 作文档内容。
DOM树： html文档中的内容是以树形结构排布，html是DOM树根，html下只有两个子标签head、body
节点： DOM将所有的分支端都成为节点。节点有很多类型，常见的节点类型有：文本节点、元素节点。
可以通过 nodeType查看节点类型 ： 1元素节点、3文本节点
特殊的元素节点：
1、html元素
2、body元素
3、head元素
节点 *** 作的api（属性和方法）
1、nodeName：只读属性，可以读取节点名称
2、nodeType：只读属性，读取节点类型
3、 hasChildNodes()：判断调用方法的节点是否存在子节点，存在返回true，不存在返回false。
主流浏览器会将换行符、制表符、空格当做文本节点处理，IE9以下会忽略它们。
4、childNodes：只读属性，获得节点的子节点集合，子节点集合是一个类数组结构，有数组特点无数组方法
5、firstChild：获得节点的第一个子节点
6、lastChild：获得节点的最后一个子节点
7、querySelector()：
参数：string类型，css选择器
作用：获得文档中第一个符合选择器条件的节点
兼容：在IE9以下不支持
8、 querySelectorAll()： // 获得的都是静态集合
参数：string类型，css选择器
作用：获得文档中所有符合选择器条件的节点集合（类数组结构）
兼容：在IE9以下不支持
注意： querySelector() 和 querySelectorAll() 得到的都是元素节点。
9、previousSibling：获取节点的前一个兄弟节点
10、nextSibling：获取节点的后一个兄弟节点
11、parentNode：获得节点的父节点（父节点一定是元素节点）
12、removeChild()：节点删除它的指定子节点
DOM *** 作元素：暂时不用的隐藏、一定不用的删除。
13、cloneNode()：克隆一个节点
参数：boolean类型，true深克隆，false浅克隆，默认浅克隆
深克隆：不仅克隆节点和节点的属性，还会克隆节点的子节点
浅克隆：只克隆节点和节点的属性，不会克隆节点的子节点
14、areplaceChild(b,c)：用b替换c
其中a是c的父节点，c是文档上已经存在的节点，b可以是节点也可以是已存在节点，被替换的节点会从文档结构中删除。
15、areplaceWith(b)：用b替换a
a已存在的节点，b可以是新节点也可以是已存在节点，被替换的节点从DOM树删除。
16、ainsertBefore(b,c)：在c前面插入b
其中，a是c的父节点，c是已经存在的节点，b是新节点
17、aappendChild(b)：在a末尾追加b
a是父节点，b是a的子节点, c是子节点
元素节点的相关api
1、getElementsByTagName()：根据标签名获得元素集合（类数组结构）
区别：HTMLCollection 是动态集合，NodeList 是静态集合。
2、createElement()：根据标签名创建新元素
3、id：读写属性，可以读取或设置元素的id值
4、className：读写属性，可以读取或设置元素的class值
5、classList：读取标签的类名集合（类数组结构）
add()：为元素新增类名，如果类名已存在不会重复添加
remove()：删除元素指定类名，如果类名不存在不会执行 *** 作
元素的属性分为两类：
一类是元素本里就拥有的属性，例如：id、class、style、src、herf、target、alt、title、type、value等等，这些属性可以在js中直接通过语法读取或设置。
再一类是我们为了解决问题给元素添加的自定义属性，这些属性在js中无法直接通过语法读取，需要通过 *** 作方法访问。
6、setAttribute(name,value)
参数：name表示要设置的属性名，value要为属性设置的值
无返回值
7、getAttribute(name)
参数：name表示要读取的属性名
返回值：返回属性的值，如果属性不存在会返回null
8、removeAttribute(name)
参数：name表示要删除的属性名
无返回值
说明：setAttribute()、getAttribute()、removeAttribute()都可以 *** 作元素的本地属性和自定义属性。
element拓展：
兼容：以下属性、方法在IE9以下不支持。
1、children：读取元素的所有元素子节点集合（类数组）
2、parentElement：读取元素的父元素节点
3、previousElementSibling：读取前一个元素兄弟节点
4、nextElementSibling：读取后一个元素兄弟节点
5、firstElementChild：读取第一个元素子节点
6、lastElementChild：读取最后一个元素子节点
7、remove(): 将调用方法的元素从DOM结构中删除
$('#id')siblings() 当前元素所有的兄弟节点
$('#id')prev() 当前元素前一个兄弟节点
$('#id')prevaAll() 当前元素之前所有的兄弟节点
$('#id')next() 当前元素之后第一个兄弟节点
$('#id')nextAll() 当前元素之后所有的兄弟节点
这三个方法都可以添加选择器，给出选择条件，就能找到你指定的兄弟节点了。
扩展资料
1、jquery 获取元素(父节点,子节点,兄弟节点)
$("#test1")parent(); // 父节点
$("#test1")parents(); // 全部父节点
$("#test1")parents("mui-content");
$("#test")children(); // 全部子节点
$("#test")children("#test1");
$("#test")contents(); // 返回#test里面的所有内容，包括节点和文本
$("#test")contents("#test1");
$("#test1")prev(); // 上一个兄弟节点
$("#test1")prevAll(); // 之前所有兄弟节点
$("#test1")next(); // 下一个兄弟节点
$("#test1")nextAll(); // 之后所有兄弟节点
$("#test1")siblings(); // 所有兄弟节点
$("#test1")siblings("#test2");
$("#test")find("#test1");
2、元素筛选
// 以下方法都返回一个新的jQuery对象，他们包含筛选到的元素
$("ul li")eq(1); // 选取ul li中匹配的索引顺序为1的元素(也就是第2个li元素)
$("ul li")first(); // 选取ul li中匹配的第一个元素
$("ul li")last(); // 选取ul li中匹配的最后一个元素
$("ul li")slice(1, 4); // 选取第2 ~ 4个元素
$("ul li")filter(":even"); // 选取ul li中所有奇数顺序的元素
xpath_input_exp_mark = '//label[contains(text(), "文本内容")]//following-sibling::div[1]//input'
browserfind_element_by_xpath(xpath_input_exp_mark)
表示当前节点的父节点
following-sibling::div[1] 表示当前节点的 兄弟节点 中的 第 1 个 div 标签
目前发现的化学元素虽然有上下位关系，如惰性元素包括,金属元素包括镧系元素包括锕系元素包括重元素包括轻元素包括
但是元素之间无法构成上下代关系。
而，唯一的例外可以是放射性元素，从一种物质衰变为另一种物质。类似于生物的传宗接代。当前元素的父元素是放射行为起点的元素。
还有一个例外是恒星的核聚变过程，轻元素吸收能量变成重元素。轻元素与重元素之间构成了上下代关系。重元素的父元素是轻元素。
至于你问的当前元素的父元素的父元素，即当前元素的祖元素，目前尚无例子支持你的提法。
以上就是关于子组件用父组件route.query获取到的数据,有什么影响全部的内容，包括:子组件用父组件route.query获取到的数据,有什么影响、javascript如何表示根节点、JS之DOM *** 作等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）