JQ方法

文献种类：专题技术总结文献；
开发工具与关键技术：
作者： 唐文坚 ；年级： 19 ；撰写时间： 2020 年 9 月 1 日

JQ方法 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~开发工具与关键技术：Vs JavaScript
作者：唐文坚
撰写时间：2020年9月1日

节点的创建
通过JQ的$()函数创建div节点并添加文本内容
var $div = $(“

12

”)
元素的插入
$(a).after(b);在a后插入元素也可以插入标签
$(a).before(b);在a前面插入b元素也可以插入标签
$(“

3100023

”).insertAfter("#box")在b后面插入a元素(反向操作)
$(“

3100023

”).insertBefore("#box")在b前面插入a元素(反向操作)

元素的清空
$("#box").empty();清空匹配元素的集合中的所有子节点
$("#box").remove();也是清空元素
和remove不同的是empty清空的只是效果数据还在append可以找回
列：function detachFun() {
var $ele = KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲box").detach();…ele);
$("body").append($ele);
$("#web li").eq(0).css({ “font-size”: “30px”, “color”: “red” });（括号里的是从索引0开始设置的为负数的话就是从倒数的xx设置）
var s = $("#web").find(“a”);查找元素

Mouseenter：鼠标移动到子元素不触发事件
Mouseover：鼠标移动到子元素触发事件
JQ的伪类写两个方法鼠标进去的时候和出来的时候
Focus:焦点事件比如鼠标单击到文本的时候触发的事件
Blur:失去焦点事件比如鼠标单击到文本后点击别出的事件
$(".box").hover(function () { $(this).addClass(“bgPink”); }, function () { $(this).removeClass(“bgPink”) })
Focusin:子元素获取焦点的时候父元素也会连带
Focusout:子元素失去焦点的时候父元素也会连带
通过事件对象的值进行打印获取到文本内容
$(“forminput”).change(function(event) { console.log(event.target.value); })
通过事件对象的值进行打印获取到拉下框的内容
$(“formselect”).change(function(){var value = $(this).val(); console.log(value) })
通过这个方法点击输入的文本会响应
$(“form input”).select(function () { console.log(1230);})
键盘按下的时候打印出是那一个键按下的事件
$(".target1").keydown(function(e){ $(“em”).first().text(e.target.value); })
键盘弹起的时候打印出是那一个键按下的事件
KaTeX parse error: Expected '}', got 'EOF' at end of input: …up(function(e){(“em”).last().text(e.target.value); })
用on的方法来绑定一个点击事件
$("#div1").on(“click”, function (e) { $(this).text(“11” + e.type); })
用on的方法来绑定多个点击事件
$("#div2").on(“mousedown mouseup”, function (e) { $(this).text(“220” + e.type); })
多个事件绑定不同的函数
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲div3").on({mous…(this).addClass(“bgGreen”);}, mouseup: function () {$(this).removeClass(“bgGreen”); }})
移出绑定的函数
$("#div2").off(“mousedown”);
Chang事件当元素的值发生改变时，会发生 change 事件。
该事件仅适用于文本域（text field），以及 textarea 和 select 元素。当用于 select 元素时，change 事件会在选择某个选项时发生。当用于 text field 或 text area 时，该事件会在元素失去焦点时发生。
@（””）输出的字符串就是普通的字符串，就算有HTML代码，也不会显示
解决办法：@HTML.Raw(代码)，这样就避免了HTML代码被当成字符串输出的情况了