JS JQuery与JavaScript比较

旨在处理浏览器不兼容性并简化 HTML DOM 操作、事件处理、动画和 Ajax。

设置/获取元素内文本

jQuery:
通过 .text() 方法

//设置
element.text("NewText");
//获取
var myText = element.text();

JavaScript:
通过 textContent 或 innerText 属性

//设置
element.textContent/innerText = “NewText”;
//获取
var myText = element.textContent/innerText;

设置/获取HTML标签

jQuery:
通过 .html() 方法

//设置
element.html("NewHtmlTag");
//获取
var myText = element.html();

JavaScript:
通过 innerText 属性

//设置
element.innerText = “NewHtmlTag”;
//获取
var content = myElement.innerText;

删除节点

JQuery .remove()

element.remove();

JavaScript .removeChild()

element.parentNode.removeChild(element);

节点关系 -获取父元素

JQuery .parent()

Element.parent();

JavaScript .parentNode

Element.parentNode;

操纵元素样式

隐藏/显示元素

JQuery .hide()/show()

Element.hide()/show();

JavaScript

Element.style.display = "none"/"";

编辑样式

JQuery

Element.css("样式名","值")

JavaScript

Element.style.样式名 = "值";