Jquery新手语法

1903 查看

Jquery chaining grammar

直到现在,我们都是一次写一条 jQuery 语句(一条接着另一条)。
不过,有一种名为链接(chaining)的技术,允许我们在相同的元素上运行多条 jQuery 命令,一条接着另一条。
提示:这样的话,浏览器就不必多次查找相同的元素。
如需链接一个动作,您只需简单地把该动作追加到之前的动作上。

连续方法链接

$('selector').action1([paramater]).action2([paramater]).action3([paramater])...

这种方式也可以这样写

$('selector'){
.action1([paramater1])
.action2([pramater2])
.action3([paramater3])
....    
}

这是因为jquery不按换行截断语句.

连续选择器的意思就是被选择了的元素连续进行这些操作。类似于c++中的花括号作用。

参考链接


jquery和dom创建元素的不同

  • jquery 方式

    $("<p></p>") (ps:$("p")要么代表p的选择器,或者是文档text为p,所以引号内必须是`完整标签`)
    
  • DOM方式

    var para=document.CreateElement("p");
    

其实是我说错了。显示创建元素需要做到以下两点

  1. 创建元素
  2. 部署位置

如果少一个,都不行。举个例子,这样点是点不出来button的啊哈哈。去掉注释就可以了。

<!DOCTYPE html>
<html>
<body>
<p id="demo">Click the button to make a BUTTON element.</p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction()
{
var btn=document.createElement("BUTTON");
//document.body.appendChild(btn);
};
</script>
</body>
</html>

jquery函数参数注意

一般来说,jquery中的函数如果没有参数,那么就是返回,如果有参数,一般都是set.
eg:

$('#div1').height();//表示返回id为div1的元素高度
$('#div2').height(200); //表示设置id为div2的元素高度为200px

jquery noConflict方法

  1. 驼峰命名法 否则不识别
  2. $.noConfict()使用后,所有的$都用jQuery来替换。
  3. 如果使用自己的方法,应该使用·var rename=$.noConflict()·的方法,然后用自己的rename来替换。
  4. 如果你的 jQuery 代码块使用 $ 简写,并且您不愿意改变这个快捷方式,那么您可以把 $ 符号作为变量传递给 ready 方法。这样就可以在函数内使用 $ 符号了 - 而在函数外,依旧不得不使用 "jQuery":

    $.noConflict();
    jQuery(document).ready(function($){
      $("button").click(function(){
        $("p").text("jQuery 仍在运行!");
      });
    });