JavaScript-jQuery操作Dom元素

参考文档： https://jquery.cuishifeng.cn/

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script src="lib/jquery-3.6.0.js"></script>
</head>
<body>
<ul id="test-ul"><li class="js">JavaScript</li><li name="python">Python</li>
</ul>
</body>
</html>

节点文本操作

// 获取和修改元素的值： 原来的写法
// document.getElementById('test-ul')// $('#test-ul li[name=python]').text()  // text()没有值代表获取值
// $('#test-ul li[name=python]').text('test')  // text('test')有值代表重新赋值// $('#test-ul li[name=python]').html()
// $('#test-ul li[name=python]').html('<strong>123</strong>')

css 的操作

// css 的操作
$('#test-ul li[name=python]').css({ "color": "#ff0011", "background": "blue" })

元素的显示和隐藏

// 元素的显示和隐藏： 本质： display: none
$('#test-ul li[name=python]').show()  // 显示
$('#test-ul li[name=python]').hide()  // 隐藏

更多方法可以参考： https://jquery.cuishifeng.cn/

https://www.bilibili.com/video/BV1JJ41177di?p=29

JavaScript-jQuery操作Dom元素相关推荐

jQuery操作Dom元素、jQuery遍历、JavaScript遍历
目录 jQuery操作Dom元素 jQuery遍历几种方式 JavaScript遍历 jQuery操作Dom元素 jQuery的主要用法为"选择某个dom元素,再对其进行某种操作" ...
jQuery操作DOM元素案例
直接打开注释即可观察效果,都已经测试通过!!! <!DOCTYPE html> <html><head><meta charset="UTF-8&q ...
第四章使用jQuery操作DOM元素
一.DOM的分类: 1.DOM core 2.HTML-DOM 3.CSS-DOM 二.css操作语法: $("#div1").css("color",&qu ...
使用jQuery操作DOM元素
一.DOM分类: 1.DOM core 2.Html-DOM 3.CSS-DOM 二.css样式 $(this).css("font-size","25px") ...
【面试必备】javascript操作DOM元素
前言时间过的真快,不知不觉就到年底了.问问自己,这一年你对自己的工作满意吗? 评价标准是什么呢?当然是马云的那两条准则了:钱给到了吗?干的爽吗?如果答案都是no,那么,你准备好跳槽了吗? 为了应对年 ...
jq追加html属性,jQuery 操作 HTML 元素和属性的方法
jQuery拥有操作 HTML 元素和属性的强大方法. 1. 获取HTML 元素的内容和属性 (1) 获得内容: text().html() 以及 val()方法 My Test JQuery $( ...
jQuery操作DOM对象
jQuery操作DOM对象 1.使用attr()方法控制元素的属性 attr()方法的作用是设置或者返回元素的属性,其中attr(属性名)格式是获取元素属性名的值,attr(属性名,属性值)格式则是设 ...
原生JS和jQuery操作DOM的区别小结
一.Js原生对象和jQuery实例对象的相互转化: (1).原生JS对象转JQ对象: $(DOM对象); (2). JQ对象转原生JS对象: $(DOM对象).get(index); //注意区分eq ...
jQuery操作Dom、jQuery事件机制、jQuery补充部分
jQuery操作Dom: 修改属性: //使用attr()方法 //attr(name, value) //name:要修改的属性的属性名 //value:对应的值 //attr方法,如果当前标签有要 ...
jQuery 操作DOM总结,DOM Core操作,HTML-DOM操作和CSS-DOM操作
jQuery创建元素节点或文本节点或属性节点.jQuery插入节点.jQuery删除节点.jQuery复制节点.jQuery替换节点.jQuery包裹节点.jQuery属性操作.jQuery样式操作. ...

JavaScript-jQuery操作Dom元素

JavaScript-jQuery操作Dom元素相关推荐

最新文章

热门文章