jQuery取name和byName取值区别

jQuery取name和byName取值区别,第1张

一个是jQuery封装对象,一个是DOM API返回的封装对象。

两个都不是数组,而是伪数组。

var $id= $('input[name="id"]');

var id = documentgetElementsByName("id");

consolelog($id === id); // false 是不同的伪数组对象

consolelog($id[0] === id[0]); // true 这两个伪数组内的对象都是DOM对象,是相同的。

// 所以,不论你使用

consolelog($id[0]value); 

// 还是,都是一样的

consolelog(id[0]value);

HTML代码

<form id=”myForm” name=”myForm”>

</form>

JS代码;

var fm=documentgetElementById(‘myForm’);

var fm=documentgetElementsByTagName(‘form’)[0];

var fm=documentforms[0];//HTML DOM 通过下标获取

var fm=docuemntforms[‘myForm’]; HTML DOM 通过form 元素的name值获取

一,获取html元素

1getElementByID(id)

通过对元素的ID访问,这是DOM一个基础的访问页面元素的方法

example:

<div id="divid">测试</div>

<script language="javascript">

var div=documentgetElementByID("divid");

alert (divnodeName); //显示元素名

</script>

如果id在元素中不是唯一的,那么获得的将是第一个ID

2getElementsByName(name)

仅用于input radio checkbox等元素,返回名字为name的元素数组

example:

<div name="george"></div>

<input name="george"></div>

<script language=javascript>

var ge=documentgetElementsByName("george");

alert (georgeslength); //获取georges个数,对div唔效果

</script>

3getElementsByTagName(tagname)

返回具有tagname的元素列表数组处理大的DOM结构会用到它

二,DOM Element常用方法

1appendChild(node) //增加内容

向当前对象追加节点,example:

<div id="test">123</div>

<script type="text/javascript">

var newdiv=documentcreateElement("div");

var newtext=documentcreateTextNode("A new div");

newdivappendChild(newtext) ;

documentgetElementById("test")appendChild(newdiv) ;

</script>

当然,上面的功能用documentgetElementById("test")innerHTML="测试一下"就可实现,遗憾的是,innerHTML不属于DOM

2,removeChild(childreference)

移除当前节点的子节点,并返回节点

<div id="father"><div id="child">A child</div></div>

<script type="text/javascript">

var childnode=documentgetElementById("child");

var removednode=documentgetElementById("father")removeChild(childnode)

</script>

3cloneNode(deepBoolean)

复制并返回当前的复制节点,由于复制了原节点的id属性,所以在document树中要改ID属性,以确保ID唯一性

4,insertBefore(newElment,targetElement) 插入新的节点

在当前节点插入一个新节点,如果targetElement为null,那新节点为最后节点

example:

<body>

<span id="lovespan">熊掌我所欲也!</span>

</body>

<script type="text/javascript">

var lovespan=documentgetElementById("lovespan"); //获取id

var newspan=documentcreateElement("span");

var newspanref=documentbodyinsertBefore(newspan, lovespan);

newspanrefinnerHTML="鱼与";

</script>

三,DOM Element常用属性

1、childeNodes 返回所有子节点对象,

例如

<ul id="mylist">

<li>美国</li>

<li>意大利</li>

<li>加拿大</li>

</ul>

<script>

var msg="" ;

var mylist=documentgetElementById("mylist")

for (i=0; i<mylistchildNodeslength; i++){

var li=mylistchildNodes[i];

msg+=liinnerText;

}

alert (msg);

</script>

2,innerHTML

这是一个标准,但它并不书DOM

例如:

<div id="bbb"><span id="aaa">我拉</span></div>

<input type=button value="点击看看">

<script language="javascript">

function change()

{

documentgetElementById("aaa")innerHTML= "修改修改";

}

</script>

3,style

这是一个极其重要的属性,可以获取并修改每个单独的样式

例如:documentgetElementByTagName("body")[0]stylebackgroundColor="#cccccc"

4、firstChild 返回第一个子节点

lastChild 返回最后一个子节点

parentNode 返回父节点的对象。

nextSibling 返回下一个兄弟节点的对象

previousSibling 返回前一个兄弟节点的对象

nodeName 返回节点的HTML标记名称,使用英文的大写字母,如P, FONT

5,click()

执行元素的一次点击,可以用于通过脚本来触发onClick函数

以上就是关于jQuery取name和byName取值区别全部的内容,包括:jQuery取name和byName取值区别、怎么获取form表单的dom对象、怎么获取 dom element等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9316957.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-27
下一篇 2023-04-27

发表评论

登录后才能评论

评论列表(0条)

保存