parentNode,parentElement 区别

最新推荐文章于 2023-05-05 15:00:24 发布
最新推荐文章于 2023-05-05 15:00:24 发布
阅读量2w 收藏 5
点赞数 2
分类专栏： JavaScript 文章标签： javascript generator function html input table

 offsetParent，parentNode,parentElement 区别
offsetParent
指与位置有关的上级元素
parentNode
指与位置无关的上级元素
parentElement 和 parentNode一样,但parentNode是W3C标准的parentElement 只在IE中可用.

第一种方法
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<SCRIPT LANGUAGE="JavaScript">
<!--
var row = -1;
function showEdit(obj){
var cell2 = obj.parentNode.parentNode.childNodes[1];
var rowIndex = obj.parentNode.parentNode.rowIndex;
cell2.innerHTML = "<input type='text' value='"+ cell2.innerHTML +"'>";
if(row != -1){
  var oldCell2 = document.getElementById("tb").rows[row].cells[1];
  oldCell2.innerHTML = oldCell2.childNodes[0].value;
}
row = rowIndex;
}
//-->
</SCRIPT>
</HEAD>

<BODY>
<TABLE id="tb">
<TR>
<TD><input type="radio" οnclick="showEdit(this)" name="rad"></TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD><input type="radio" οnclick="showEdit(this)" name="rad"></TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD><input type="radio" οnclick="showEdit(this)" name="rad"></TD>
<TD></TD>
<TD></TD>
</TR>
</TABLE>
</BODY>
</HTML>

第二种方法

<table border=1 width=100%>
  <tr>
    <td><input name=m type=checkbox οnclick="mm(this)"></td>
    <td>1111</td>
    <td><input name=aaa value="222" disabled></td>
    <td><input name=bbb value="333" disabled></td>
  </tr>
  <tr>
    <td><input name=m type=checkbox οnclick="mm(this)"></td>
    <td>1111</td>
    <td><input name=aaa value="222" disabled></td>
    <td><input name=bbb value="333" disabled></td>
  </tr>
  <tr>
    <td><input name=m type=checkbox οnclick="mm(this)"></td>
    <td>1111</td>
    <td><input name=aaa value="222" disabled></td>
    <td><input name=bbb value="333" disabled></td>
  </tr>
</table>

<SCRIPT LANGUAGE="JavaScript">

function mm(e)
{
  var currentTr=e.parentElement.parentElement;
  var inputObjs=currentTr.getElementsByTagName("input");
  for(var i=0;i<inputObjs.length;i++)
  {
   if(inputObjs[i]==e) continue;
    inputObjs[i].disabled=!e.checked;
  }

}
</SCRIPT>

ws_hgo
关注
  • 2
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue中使用自定义指令实现按钮权限展示问题
蜗牛~~
04-28 1724
一、在src下新建directive文件夹 二、定义index.js文件，在vue上注入自定义指令 import hasBtn from './permission/hasBtn' const install = function (Vue) { Vue.directive('hasBtn', hasBtn) } if (window.Vue) { window['hasBtn'] = hasBtn Vue.use(install); // eslint-d
Vue自定义指令
me_never的博客
10-03 539
// 注册一个全局自定义指令 `v-focus` Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { // 聚焦元素 el.focus() } }) 如果想注册局部指令，组件中也接受一个 directives 的选项： directives: { focus: { ...
parentNode和parentElement的区别
最新发布
05-05 1248
在DOM文档结构中，HTML页面每一部分都是由节点组成的，节点的类型一共有3种，元素节点，文本节点，属性节点，从图中可以看出属性节点属于元素节点的分支，一般不常考虑。两者在通常情况下都是一样的，因为包含元素的节点只有可能是元素节点，这里可能会有一个误区，有些人可能会想文本节点是否可以包含元素节点，来作为父节点，这里是不行的，文本节点只是文本本身，自身算一个节点，文本节点的父节点直接是元素节点。那下面我们就说一下，parentNode,parentElement,的特例。
vue 自定义指令
sinat_39598192的博客
05-04 180
为什么要自定义指令 //创建方式1：全局 vue.directive('directName',{}) //创建方式2：组件内 directives: { directName: { // 钩子 } } //使用方式1：在模板中使用 <div v-directName></div> //使用方式2：jsx语法中 export default{ name:'app', render(){ return ( <div id="app">
Vue组件中的通信(parent,root,children,el)
最爱喝怡宝的博客
12-08 870
父子组件的通信（通讯） （组件的通信 是vue核心之一） 组件是vue的核心，组件的通信是vue的核心的核心 通信：数据的“动态的实时的”传递 通信（访问）--- 一定是 能 拿到 对方的 东西（数据中心的数据，方法中心的方法，计算属性等等） 父子组件访问 子访问父 parent和root 父访问子 children和refs 父组件 和 子组件 （父子之间 数据访问） 父子组件数据互相访问 vue中 $parent 以及 ref 和 $refs 子实例（子组件） $pare...
vue基础学习（1）
ASD1314OK的博客
04-04 181
v-model修饰符： .number：转换成数字型 .trim：去掉前后空格 .lazy：把input事件切换为change事件 当前已学指令： v-cloak 防止页面加载时出现vuejs的变量名 v-text 解决差值表达式闪烁问题 v-html 渲染HTML v-pre 不渲染直接显示 v-once 渲染一次 v-model 双向数据绑定 v-on ...
Js中parentNode,parentElement,childNodes,children之间的区别
10-26
本文将详细解析`parentNode`、`parentElement`、`childNodes`和`children`之间的区别。 首先，`parentNode`和`parentElement`都是用于获取一个元素的父级节点。它们的主要区别在于兼容性。`parentNode`是W3C标准的...
parentElement,srcElement的使用小结
09-04
这里，`event.srcElement.parentElement.rowIndex` 也被注释掉作为备选方案，但通常情况下，`parentNode` 应该指向单元格的直接父元素，即`<td>`元素的`<tr>`元素。 总的来说，`parentElement` 和 `srcElement` 在...
js parentElement和offsetParent之间的区别
12-11
另外，`parentNode`属性与`parentElement`作用相同，只是`parentElement`是IE浏览器特有，而`parentNode`被其他主流浏览器支持。类似地，`children`属性返回元素的子元素列表，是IE特有；`childNodes`返回元素的所有...
javascript中parentNode,childNodes,children的应用详解
10-26
在IE中，parentElement属性可以用来获取父元素，与标准的parentNode属性有些类似，但不是所有浏览器都支持它。因此，对于需要兼容多浏览器的情况，我们更推荐使用符合W3C标准的parentNode。 关于childNodes属性，它...
children和childNodes的区别
qq_45830543的博客
09-12 1280
在我写东西的过程中用到了childNodes,当我用这个childNodes来获取我想要的ul下的li集合时，总是会报错；于是我试着把它打印出来看看它里面装的是什么，原本是应该得到的是ul下的四个li，但是当我打印的时候，发现它得到了一个长度为9的数组; 于是我发现用childrenNodes来获取时它会把父节点下的空格也当做一个文本键获取到。 如图： 于是我尝试使用children来获取到我想要的li集合；它成功获取到ul下的li集合。 我们此时可以发现children它返回的只是HTML元素节
parentNode 与 parentElement
kfepiza的博客
04-27 654
html元素的 parentNode   是 document。html元素的 parentElement 是 null。
Js-parentNode、parentElement，childNodes、children 它们有什么区别呢？
weixin_30536513的博客
10-03 163
原文：http://www.it130.cn/Article/FAQ/Web-kaifa/JavaScript/2007-3-20/2007032017013900.html 所属分类：Web 开发 JavaScript ---------------------------------------------------------------------- parentNode、pa...
parentNode和parentElement区别
EmotionComputer
08-07 953
parentNode和parentElement，childNodes和children的区别
Javascript中parentElement和parentNode的区别
weixin_42950333的博客
04-09 2848
parentNode和parentElement的区别 第一点：parentNode跟parentElement，前者是w3c标准，后者只ie支持。 parentElement是ie专用的，就是说在firefox(ff)浏览器里是不能使用的，一般情况parentNode可以取代parentElement的所有功能。 第二点： parentElement匹配的是parent为element的情况，而parentNode匹配的则是parent为node的情况。element是包含在node里的，它的nodeTy
Vue全局组件与局部组件笔记
Akio的博客
07-26 255
组件要注意的事项有： 1、组件的data要用函数,一个组件的 data 选项必须是一个函数，因此每个实例可以维护一份被返回对象的独立的拷贝 Vue.component('组件名',{ template:'&lt;p&gt;这是一个组件里的模板&lt;/p&gt;', //这些都是选项 data:function(){ return{ ...
JS中parentNode和parentElement的区别
bats的博客
07-09 814
参考文章 以一个网页作为例子： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="bb"> <div class="box1"></div>
Vue组件 $refs $parent $children 的使用
weixin_50313248的博客
05-22 988
Vue组件 $refs $parent $children 的使用 $refs 作用: 获取对应组件实例，如果是原生dom，那么直接获取的是该dom。获取之后我们可以使用它的属性和方法。 使用方法： // 在我们需要获取实例的地方定义ref <my-component ref="myRef"></my-component> // 然后我们在js中通过$refs方式获取该实例 this.$refs.myRef $parent 作用： 获取父组件实例，同样，获取之后我们可以使
parentnode和parentelement
03-16
parentnode和parentelement都是DOM API中的属性，用于获取当前节点的父节点。 其中，parentnode是所有节点对象都有的属性，它返回当前节点的父节点，如果当前节点没有父节点，则返回null。 而parentelement是Element对象特有的属性，它返回当前元素节点的父元素节点，如果当前节点不是元素节点，则返回null。 总的来说，parentnode和parentelement都是用于获取当前节点的父节点，但parentelement只能用于元素节点，而parentnode适用于所有节点类型。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值