JQuery基本操作

标签：insert   移动   pac   删除   偶数   标签   bug   int   添加   

console.info($("#div1").text());
console.info($("#div1").length);
console.debug($("div").length);
   console.debug("-----------------------------------------------------------------------------------------");
/*获取ipput并列的div层*/
   console.debug($("input,div").text());
   console.debug("-----------------------------------------------------------------------------------------");
 /*获取div并列的input层*/
   console.debug("-----------------------------------------------------------------------------------------");
   console.debug($("div>input").text());
   console.debug("-----------------------------------------------------------------------------------------");
   /*匹配input紧接在div后面的所有元素*/
   console.debug($("div+input").length);
   console.debug($("div+input").text());
   console.debug("-----------------------------------------------------------------------------------------");
   /*匹配div之后的input的所有元素*/
   console.debug($("div~input").length);
   console.debug($("div~input").text());
  /* jquery 获取值相关的方法,如果针对多个元素进行操作,那么返回的第一个元素的值;
   jquery 设置值相关的方法,如果针对多个元素进行操作,那么设置的是所有的元素值;*/
  /*设置CSS样式*/
  $("#div1").css("color","red").css("fontSize","30px");
  /*追加字符串*/
  $("#div1").css("color","red").css("fontSize","30px").append("强骏梦");
  /*所有字符串匹配的标签添加内容*/
  $("div div").append("XXXXXXXXXXXXXXXXXXX");
  /*再匹配元素后添加兄弟标签*/
   $("div div").after("<p>1233123131231313131312331231313131311313131</p>");
   /*再匹配元素前添加兄弟标签*/
   $("div div").before("<p style=‘color: red‘>1111111111111111111111111111111111111111</p>");
   /*把匹配到的元素插入到一个层里面*/
   $("div div").insertBefore($("#div1"));
   /*
   * 删除
    empty(): 删除匹配的元素所有的子节点。
    remove([jquery选择器]):DOM中删除所有匹配的元素。

    * */
   /*删除所有子节点*/
   $("div div").empty();
   /*删除所匹配的元素*/
   $("div div").remove();

   /*替换*/
   $("div div").replaceWith("<P STYLE=‘color: green‘>QQQQQQQQQQQQQQQQQQQQQQQ</P>");

   /*克隆*/
   /*
   * clone() 克隆匹配的DOM元素并且选中这些克隆的副本。
    clone(true) 元素以及其所有的事件处理并且选中这些克隆的副本
    * */
  /* $("p").clone(true).append(document.body);*/


   /*属性操作checked*/
 /$("#btn").click(function () {
       alert("312");
   });

console.debug($("#div1 .s1").length);

/*获取div层下类选择器为是s1的层，并且为指定的层，并显示层中的内容*/

console.debug($("#div1 .s1").get(1).innerHTML);

console.debug("------------------------------------");

console.debug($("#div1 .s1").get(1).innerText);

console.debug("------------------------------------");

/*打印所匹配的所有层*/

var str=$("#div1 .s1");

for(var i=0;i<str.length;i++){

    console.debug($("#div1 .s1").get(i).innerText);

}

/*改变匹配到的所有层内容的属性*/

$("#div1 .s1").css("color","red");

console.debug("------------------------------------");

/*改变指定匹配元素的属性*/

console.debug($("#div1 .s1").get(2).innerHTML);

 $(document).ready()：允许我们在文档完全加载完后执行函数

click()：当按钮点击事件被触发时会调用一个函数

dblclick()：当双击元素时，会发生 dblclick 事件

mouseenter()：当鼠标指针穿过元素时，会发生 mouseenter 事件

mouseleave()：当鼠标指针离开元素时，会发生 mouseleave 事件

mousedown()：当鼠标指针移动到元素上方，并按下鼠标按键时，会发生 mousedown 事件

  hover()：用于模拟光标悬停事件

focus()：当元素获得焦点时，发生 focus 事件

blur()：元素失去焦点时，发生 blur 事件

JQuery基本操作

标签：insert   移动   pac   删除   偶数   标签   bug   int   添加   

原文地址：https://www.cnblogs.com/2070393244com/p/9452406.html