js与jquery之元素操作

js

1、innerHTML获取

a = document.getElementById("username").innerHTML;

取出元素的html内容,即元素的开始标签和结束标签之间的所有字符,类型为字符串。

<p name=‘username‘>12<span>123</span>3</p>
a = document.getElementById("username").innerHTML;
a的值为12<span>123</span>3

2、innerText获取

a = document.getElementById("username").innerText;

取出元素的文本内容,即元素的开始标签和结束标签之间的,除了嵌套的标签外所有的字符内容,类型为字符串。

<p name=‘username‘>12<span>123</span>3</p>
a = document.getElementById("username").innerText;
a的值为121233

3、获取属性

document.getElementById("username").attributes
document.getElementById("username").attributes[0]
document.getElementById("username").attributes[‘name‘]

返回元素的属性集合对象,通过下标获取

4、innerHTML设置

document.getElementById(‘a‘).innerHTML=‘<img src="https://shs3.b.qianxin.com/butian_public/f8595983366a88d39b1a65d669a823b7184cd19eef9be.jpg">‘

执行后,赋值内容中会解析html显示
5、innerText设置

document.getElementById(‘a‘).innerText=‘<img src="https://shs3.b.qianxin.com/butian_public/f8595983366a88d39b1a65d669a823b7184cd19eef9be.jpg">‘

执行后,赋值内容中不会解析html显示,而是直接作为文本显示

6、设置属性

document.getElementById(‘a‘).setAttribute(‘id‘,‘123‘)

jquery元素操作

jquery获取对象与js获取对象的类型存在差异,jquer获取的对象无法调用原生js的操作方法,而需要使用jquery自定义的操作方法。

//获取html内容
$("#a").html()
//设置html内容
$("#a").html(‘<a href="http://www.bubuko.com/123">abc</a>‘)
//获取text内容
$("#a").text()
//设置text内容
$("#a").text(‘<a href="http://www.bubuko.com/123">abc</a>‘)
//获取属性内容
$("#a").attr(‘checked‘)
//设置属性内容
$("#a").attr(‘checked‘,false)
//获取输入控件的value内容
$("#a").val()
//设置输入控件的value内容
$("#a").val(‘abcdef‘)

js与jquery之元素操作

原文:https://www.cnblogs.com/heibaimao123/p/16277512.html

以上是js与jquery之元素操作的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>