1.文本操作
- 操作标签内部文本
- js jQuery
- innerText text() 括号内不加参数就是获取加了就是设置
- innerHTML html()
在这里插入代码片
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>wot</title>
</head>
<body>
<div>
<p>
势如鲲鹏,怒啸长空
</p>
</div>
</body>
</html>
$('div').text();
" 势如鲲鹏,怒啸长空 "
$('div').html();
" <p> 势如鲲鹏,怒啸长空 </p>"
$('div').text('乱舞狂沙,行踪诡魅');
k.fn.init [div, prevObject: k.fn.init(1)]
$('div').text('<h1>乱舞狂沙,行踪诡魅</h1>');
k.fn.init [div, prevObject: k.fn.init(1)]
$('div').html('<h1>乱舞狂沙,行踪诡魅</h1>');
k.fn.init [div, prevObject: k.fn.init(1)]
- 获取值操作
- js jQuery
- .value .val()
- $(’#d1’).val(‘520快乐’) # 括号内不加参数就是获取加了就是设置
在这里插入代码片
<input type="text" id="d1">
<input type="file" id="d2">
$('#d1'); // 获取标签对象
k.fn.init [input#d1]
$('#d1').val(); // 获取标签文本
"一怒而诸侯惧,安居则天下息"
$('#d1').val('一怒而诸侯惧,安居则天下息'); // 设置标签文本
k.fn.init [input#d1]
$('#d2').val(); // val获取文件只是文件的名称
"C:\fakepath\31b01.jpg"
$('#d2')[0].files[0]; // 实际文件数据, # 牢记两个对象之间的转换
File {name: "31b01.jpg", lastModified: 1601381931612, lastModifiedDate: Tue Sep 29 2020 20:18:51 GMT+0800 (中国标准时间), webkitRelativePath: "", size: 105834, …}
- 属性操作
js中 jQuery
setAttribute() attr(name,value)
getAttribute() attr(name)
removeAttribute() removeAttr(name)
在用变量存储对象的时候 js中推荐使用 XXXEle 标签对象
jQuery中推荐使用 $XXXEle jQuery对象
<p id="d1" username="wot" >我是p标签</p>
let $idEle = $('p');
undefined
$idEle.attr('id');
"d1"
$idEle.attr('class');
"c1"
$idEle.attr('class','c2');
k.fn.init [p#d1.c2, prevObject: k.fn.init(1)]
$idEle.attr('class');
"c2"
$idEle.attr('password');
"1234"
$idEle.attr('password','hhhhh');
k.fn.init [p#d1.c2, prevObject: k.fn.init(1)]
$idEle.attr('password');
"hhhhh"
对于标签上有的能够看到的属性和自定义属性用attr
对于返回布尔值比如checkbox radio option是否被选中用prop
`<p id="d1" username="wot" >我是p标签</p>
<input type="checkbox" value="111" name="lt" id="d2">
<input type="checkbox" value="222" name="mt" id="d3" checked>
<input type="checkbox" value="333" name="ht" id="d4">
$('#d3').attr('checked');
"checked"
$('#d3').attr('checked','checked');
k.fn.init [input#d3]
$('#d2').prop('checked');
false
$('#d2').prop('checked');
true
$('#d2').prop('checked',false);
k.fn.init [input#d2]``