>  기사  >  웹 프론트엔드  >  소유자 문서는 무엇을 의미하나요?

소유자 문서는 무엇을 의미하나요?

伊谢尔伦
伊谢尔伦원래의
2017-06-16 14:35:452609검색

제공된 원시 HTML 마크업 문자열을 기반으로 jQuery 객체로 래핑된 DOM 요소를 동적으로 생성합니다. 일련의 속성, 이벤트 등을 동시에 설정합니다.

손으로 쓴 HTML 문자열, 일부 템플릿 엔진이나 플러그인에서 생성된 문자열 또는 AJAX를 통해 로드된 문자열을 전달할 수 있습니다. 하지만 입력 요소를 생성할 때 제한 사항이 있습니다. 두 번째 예를 참조할 수 있습니다. 물론 이 문자열에는 백슬래시뿐만 아니라 슬래시(예: 이미지 주소)도 포함될 수 있습니다. 개별 요소를 생성할 때 닫는 태그나 XHTML 형식을 사용하세요. 예를 들어 범위를 생성하려면 $("

jQuery 1.8에서는 $(html,props)를 통해 모든 jQuery 객체의 메서드나 플러그인을 사용할 수 있습니다. 이전에는 짧은 메서드 이름 목록만 사용할 수 있었고 목록에 추가할 수 있는 문서화된 방법이 없었습니다. 이제는 목록일 필요가 전혀 없습니다! 그러나 플러그인을 추가한 후 HTML 속성과 이름이 동일한 경우 코드 동작이 변경될 수 있다는 점에 유의하세요.

jQuery(html [, ownerDocument]), jQuery(html, props)

수신 문자열 매개변수가 HTML 코드 조각처럼 보이는 경우(예: 문자열에 617c665f162642ab2081eb5237807c25가 포함되어 있음) jQuery는 이 HTML 코드를 사용하여 새 DOM 요소를 생성하고 이러한 DOM 요소에 대한 참조가 포함된 jQuery 개체를 생성해 보세요. 예를 들어 다음 코드는 HTML 코드를 DOM 요소로 변환하고 이를 본문 노드 끝에 삽입합니다.

$(&#39;<p id="test">My <em>new</em> text</p>&#39;).appendTo(&#39;body&#39;);

HTML 코드가 단일 태그인 경우(예: $('79d7c95122630a3791db16c5259dc98d ') 또는 $('553a280de7202c0dce8dfe871821475e5db79b134e9f6b82c0b36e0489ee08ed'), jQuery는 브라우저의 기본 메소드 document.createElement()를 사용하여 DOM 요소를 생성합니다. 위의 예에서 $('b78fed35e0c5c76e28c8a94634525662My907fae80ddef53131f3292ee4f81644bnewd1c6776b927dc33c5d9114750b586338text94b3e26ee717c64999d7867364b1b4a3')와 같이 별도의 태그보다 더 복잡한 HTML 조각인 경우 다음을 사용하세요. 브라우저 innerHTML 메커니즘은 DOM 요소를 생성합니다. 이 프로세스는 jQuery.buildFragment() 메서드와 jQuery.clean() 메서드에 의해 구현됩니다. 관련 내용은 각각 섹션 2.4와 2.5에서 소개되고 분석됩니다.

두 번째 매개변수 ownerDocument는 새 DOM 요소를 생성하기 위해 문서 객체를 지정하는 데 사용됩니다. 전달되지 않으면 기본값은 현재 문서 객체입니다.

HTML 코드가 별도의 태그인 경우 두 번째 매개변수는 속성과 이벤트를 포함하는 공통 객체인 props일 수도 있습니다. DOM 요소를 생성하기 위해 document.createElement()를 호출한 후 매개변수 props에 jQuery 메서드가 전달됩니다. .attr() 및 .attr()은 매개변수 props의 속성과 이벤트를 새로 생성된 DOM 요소로 설정하는 역할을 담당합니다.

매개변수 소품의 속성은 모든 이벤트 유형(예: "클릭")일 수 있습니다. 이때 속성 값은 새로 생성된 DOM 요소에 바인딩될 이벤트 수신 함수여야 합니다. 특수 속성: val, css, html, text, data, width, height, offset, 해당 jQuery 메서드: .val(), .css(), .html(), .text(), .data(), . width() , .height(), .offset() 이 실행되고 속성 값이 매개변수로 전달되며 다른 유형의 속성이 새로 생성된 DOM 요소로 설정되고 일부 특수 속성도 설정됩니다. (type, value, tabindex 등) 속성 이름 class를 통해 클래스 스타일을 설정할 수 있지만 class는 JavaScript 예약어이므로 클래스를 따옴표로 묶어야 합니다. 예를 들어 다음 예제에서는 p 요소를 만들고 클래스 스타일을 "test"로 설정하고 텍스트 콘텐츠를 "Click me!"로 설정하고 클릭 이벤트를 바인딩한 다음 body 노드 끝에 삽입합니다. p 요소를 클릭하면 클래스 스타일도 전환됩니다. 테스트:

$("<p/>", {  
   "class": "test",  
   text: "Click me!",  
   click: function(){  
     $(this).toggleClass("test");  
   }  
}).appendTo("body");

샘플 코드:

p 요소(및 그 안의 모든 콘텐츠)를 동적으로 생성하고 body 요소에 추가합니다. 이 함수 내에서 DOM 요소로의 마크업 변환은 임시로 요소를 생성하고 해당 요소의 innerHTML 속성을 지정된 마크업 문자열로 설정하여 수행됩니다. 따라서 이 기능에는 유연성과 한계가 있습니다.

jQuery Code:

$("<p><p>Hello</p></p>").appendTo("body");

Description:

d5fd7aea971a85678ba271703566ebfd 요소를 생성하려면 type 속성도 설정해야 합니다. Microsoft에서는 d5fd7aea971a85678ba271703566ebfd 요소의 유형을 한 번만 쓸 수 있다고 규정하고 있습니다.

jQuery Code:

// 在 IE 中无效: $("<input>").attr("type", "checkbox"); // 在 IE 中有效: $("<input type=&#39;checkbox&#39;>");

Description:

p 요소(및 그 안에 포함된 모든 콘텐츠)를 동적으로 생성하고 body 요소에 추가합니다. 이 함수 내에서 DOM 요소로의 마크업 변환은 임시로 요소를 생성하고 해당 요소의 innerHTML 속성을 지정된 마크업 문자열로 설정하여 수행됩니다. 따라서 이 기능에는 유연성과 한계가 있습니다.

j쿼리 코드:

$("<p>", {

  "class": "test",

  text: "Click me!",

  click: function(){

    $(this).toggleClass("test");

  }

}).appendTo("body");

설명:

创建一个 d5fd7aea971a85678ba271703566ebfd 元素,同时设定 type 属性、属性值,以及一些事件。

jQuery 代码:

$("<input>", {

  type: "text",

  val: "Test",

  focusin: function() {

    $(this).addClass("active");

  },

  focusout: function() {

    $(this).removeClass("active");

  }

}).appendTo("form");

jQuery( html, [ownerDocument] ) 的用途是通过 html 字符串创造相应的 node 节点,jQuery 分为了两种情况,一种是 html 是由一个标签组成的 html 字符串,比如

<span>I&#39;m a SPAN</span>

这时, jQuery 会使用正则表达式匹配出这个 tag 的 tag name ,然后使用

document.createElement( tagName )

来生成这个 node ,而对于多个标签(还包括单个标签的前后有空白字符串)的情况,会这么处理:

先用 document.createDocumentFragment 创建一个 documentFragment

然后 用 document.createElement('p') ,创建一个 p

然后再 p.innerHTML = html ,创建 html 字符串对应的 node 节点

然后从 p 中得到这些节点,并返回

위 내용은 소유자 문서는 무엇을 의미하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.