JavaQueryDOW 节点操作

最新推荐文章于 2022-02-21 23:16:48 发布

C0C0D

最新推荐文章于 2022-02-21 23:16:48 发布

阅读量989

点赞数

分类专栏：新手文章标签： java

本文链接：https://blog.csdn.net/C0C0D/article/details/105940129

版权

新手专栏收录该内容

31 篇文章 0 订阅

订阅专栏

文献种类：专题技术总结文献；
开发工具与关键技术：DW与 JavaScript
作者：陈良鑫；年级： 19 ；撰写时间： 2020 年 4 月 28 日

JavaQueryDOW 节点操作

开发工具与关键技术：Adobe Dreamweaver JavaScript
作者：陈良鑫
撰写时间：2020年4月28日

JavaScript中的DOM对象：document.getElementById(“box”);DOM对象

DOM对象与jQuery对象的区别
1.DOM对象是通过原生的JS获取的对象，DOM对象只能使用JS中的方法和属性
2.jQuery对象是通过jQuery包装DOM对象后产生的对象，它是jQuery独有的。
jQuery可以使用jQuery库里面的方法，但是不能使用JS中的方法

append() 向每个匹配的元素内部追加内容
appendTo() 把所有匹配的元素追加到另一个指定的元素元素集合中。
prepend() 向每个匹配的元素内部前置内容
prependTo() 把所有匹配的元素前置到另一个、指定的元素元素集合中

after() 在每个匹配的元素之后插入内容
before() 在每个匹配的元素之前插入内容
insertAfter() 这个方法是颠倒了常规的 $(A) . a f t e r (B) 的操作，即不是把 B 插入到 A 后面，而是把 A 插入到 B 后面 i n s e r t B e f o r e () 颠倒了常规的$ (A).before(B)的操作，即不是把B插入到A前面，而是把A插入到B前面。

empty() 删除匹配的元素集合中所有的子节点
remove([expr]) 从DOM中删除所有匹配的元素(元素本身与子元素都被删除)
detach() 从DOM中删除所有匹配的元素。
- 这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。
与remove()不同的是，所有绑定的事件、附加的数据等都会保留下来
- $(“div”).detach()这一句会移除对象，仅仅是显示效果没有了。
但是内存中还是存在的。当你append之后，又重新回到了文档流中。就又显示出来了。

创建流程：
1.创建元素 document.createElement()
2.为节点添加一下属性 element.setAttribute();
3.可以使用innerText或则innerHTML属性添加文本或则HTML内容
4.使用parentElement.appendChild()方法将新创建的节点添加到父节点中
append(content|fn):向每个匹配的元素内部追加内容
- $(A).append(B);将B添加到A中
appendTo(content):把所有匹配的元素追加到另一个指定的元素元素集合中。

$(A).appendTo(B);把A追加到B中
总结：这两个方法功能相同，主要的不同是语法—>内容和目标的位置不同
prepend(content):向每个匹配的元素内部前置内容
$(A).prepend(B);将B添加到A中(和append添加的元素有位置上的区别)
prependTo(content):把所有匹配的元素前置到另一个、指定的元素元素集合中。
$(A).prependTo(B);把A追加到B中

1.getAttribute()获取特性
2.setAttribute()设置特性
3.removeAttribute() 移出特性
在jQuery中操作特性的jQuery方法:
1.attr() 获取/设置属性
2.removeAttr() 移出属性
在jQuery中用一个attr()与removeAttr()就可以全部搞定了，
jQuery中用attr()方法来获取和设置元素属性,attr是attribute（属性）的缩写，在jQuery DOM操作中会经常用到attr()

attr()方法的用法:

$(element).attr(“属性名”);//获取属性名的属性值
$(element).attr(“属性”,“属性值”);//设置属性的属性值
$(element).attr(“属性名”,“函数值”);//设置属性的函数值
$(element).attr({“属性名”:“属性值”,“属性名”:“属性值”});//给指定元素设置多个属性值
removeAttr()方法的用法:
$(element).removeAttr(“属性名”);//移出对应的属性

prop()方法的用法:

$(element).prop(“属性名”);//获取属性名的属性值
$(element).prop(“属性名”,“属性值”);//设置属性的属性值
$(element).prop(“属性名”,“函数值”);//设置属性的函数值
$(element).prop({“属性名”:“属性值”,“属性名”:“属性值”});//给指定元素设置多个属性值
removeProp()方法的用法:
$(element).removeProp(“属性名”);//移出对应的属性

Attribute

attribute是HTML中就有的，是元素的选项|附加项。
例如：id、class、title、src、alt、href
值只能为string类型
客户端向HTML元素添加的自定义的属性，推荐称为attribute
Property
JS DOM中，对象的成员(组成部分)，所以可以用JS DOM对象访问property(用对象访问成员)
例如：tagName, nodeName, nodeType, defaultChecked (这几个属性是DOM对象中属性)
值类型多样化：property因为是对象的成员，类型可多样化(boolean, string, number等)
如果获取DOM对象中的属性，推荐使用property
```
链接
```

发表平台文章发表网站链接URL 文章发表网站链接【二维码】发表者
CSDN个人博客
https://blog.csdn.net/

https://blog.csdn.net/weixin_44563954/article/details/86534500

 	学生本人

陈良鑫
CSDN专业技术论坛
https://bbs.csdn.net/
.NET、Java、Web、数据库开发、企业IT（地理信息系统）、云计算、移动开发、开发语言等每个月发布在同一个主题下，每个月的网页链接和二维码都是同一个。学生本人

陈良鑫

https://bbs.csdn.net/topics/392512019

百度贴吧：广信IT学院吧
https://tieba.baidu.com/f?kw=%E5%B9%BF%E4%BF%A1it%E5%AD%A6%E9%99%A2

（百度贴吧正文开头添加本文章CSDN的两个发表链接）每个月发布在同一个主题下，每个月的网页链接和二维码都是同一个。学生本人

陈良鑫

百度贴吧：广东信息科技职业培训学院吧
https://tieba.baidu.com/f?kw=%E5%B9%BF%E4%B8%9C%E4%BF%A1%E6%81%AF%E7%A7%91%E6%8A%80%E8%81%8C%E4%B8%9A%E5%9F%B9%E8%AE%AD%E5%AD%A6%E9%99%A2
（百度贴吧正文开头添加本文章CSDN的两个发表链接）学生本人

陈良鑫
广信IT学院
官网
www.gxrjxy.cn