Home > Web Front-end > JS Tutorial > What is $(dom).context in JQuery code? how to use?

What is $(dom).context in JQuery code? how to use?

伊谢尔伦
Release: 2017-06-16 14:36:18
Original
2380 people have browsed it

context, returns the original DOM node content passed to jQuery(), which is the second parameter of jQuery(). If not specified, context points to the current document
For example: $("p span",context);
means selecting the "p span" object from the context object. This is a usage of jQuery, which is to select Find objects within a certain range.
And $(dom)[0].attributes directly finds the attributes under the first dom. It is different from context and specifies the search object.

context Return value: Element

Newly added in jQuery1.3, it returns the original DOM node content passed to jQuery(), which is the second parameter of jQuery(). If not specified, the context points to the current document (document). It can be used with selector for Accurately detect selector query situations. These two properties are useful to plugin developers.

Example: Detect the content of the document used

jQuery code:

1

2

$("ul").append("<li>"+$("ul").context+"</li>")

          .append("<li>"+$("ul", document.body).context.nodeName+"</li>");

Copy after login

Result:

1

2

[object HTMLDocument]//如果是IE浏览器,则返回[object]

  BODY

Copy after login

[Note]: $("ul", document. body).context.nodeName This sentence means to find the ul element in document.body.

Sample code one:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="//m.sbmmt.com/"/>

<title>php.cn</title>

<style type="text/css">

p

{

  width:150px;

  height:150px;

  border:1px solid blue;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"

$(document).ready(function(){

  $("button").click(function(){

    alert($("li").context);

  })

})

</script> 

</head>

<body>

<p>

  <ul>

    <li>测试脚本</li>

  </ul>

</p>

<button>点击测试</button>

</body>

</html>

Copy after login

By default, the original DOM node passed to jQuery() is Document, and [object] will be returned in IE browser. Other browsers return [object HTMLDocument].

Sample code two:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="//m.sbmmt.com/" />

<title>php.cn</title>

<style type="text/css">

p

{

  width:150px;

  height:150px;

  border:1px solid blue;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"

$(document).ready(function(){

  $("button").click(function(){

    alert($("li",document.getElementById("myid")).context);

  })

})

</script>

</head>

<body>

<p>

  <ul id="myid">

    <li>测试脚本</li>

  </ul>

</p>

<button>点击测试</button>

</body>

</html>

Copy after login

The return value of the above code is [object HTMLUListElement], but in IE browser it is [object]

The above is the detailed content of What is $(dom).context in JQuery code? how to use?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template