jqueryWeb前端之路Web 前端开发

二jquery基本操作(1)

2017-02-11  本文已影响20人  向布谷鸟说早安

1.三种创建元素的操作:

可以使用$直接创建元素

1.1线上模式

//线上模式
for(var i=0;i<10;i++){
   var tag = $("<p>"+i+"</p>")
   $('body').append(tag);
}

结果:


1.2线下组装模式(性能更好)

var html="";
for(var i=0;i<10;i++){
  html+="<p>"+i+"</p>";
    
}
var newTag = $(html);
$("body").append(newTag);

结果:


1.3长页面的拼接模式

//格式不对匹配不了
var fun=function(){/*
<ul>
               <li>1</li>
               <li>2</li>
               <li>3</li>
<ul>
    */}//toString不改变原始值
    
$(function(){
     var ss= fun.toString();
    //replace也不改变原始值
    //function后面要加一个空格
    //字符串的操作复习
    var m = ss.replace("function (){/*","").replace("*/}","");
    
    $("body").append(m);
})

结果:


2.获取内容的三种操作

2.1text()获取或设置对象的文本内容

2.2html()获取或设置对象的子节点

2.3val()获取或设置对象的值(只支持有value对象的对象如input)

不需要跟后台处理的时候可以使用这种方式获取客户端的密码

3.添加节点的8种方式

after() before() prepend() append()
insertAfter() insertBefore()prependTo() appendTo()
上下这四种一一对应

4.删除节点的两种方式

4.1remove()

删除被选元素本身

可以带一个选择器作为参数

删除类的函数都会返回删除前被选择器选择的对象(只要不用shift+delete就会进入回收站)

4.2empty()

删除被选元素子元素

5其它文档操作

5.1使用jquery替换其它节点

replaceAll()replaceWith()

5.2使用jquery包裹节点或者移除包裹(不常用)

wrap() wrapAll() wrapinner() unwrap()

5.3使用jquery克隆节点(不常用)

需要把它加入到dom中,可以用变量把它存起来
clone();
这篇文章jquery相关代码源码

上一篇 下一篇

猜你喜欢

热点阅读