> 웹 프론트엔드 > HTML 튜토리얼 > html: P 요소를 무작위로 중첩하지 마세요.

html: P 요소를 무작위로 중첩하지 마세요.

黄舟
풀어 주다: 2017-07-03 11:56:16
원래의
1963명이 탐색했습니다.

오늘 동료가 jQuery 필터링에 대해 상담했습니다. 그는 UNREGISERED 버전의 Easy CHM에서 만든 jQuery1.7의 문서를 확인했는데, 그 안에 있는 지침이 너무 필터링되어 정상적으로 실행될 수 없다는 것을 발견했습니다. document 일부 콘텐츠에는 학습자를 오해할 수 있는 버그가 있습니다. 동시에 이번 필터 조사를 통해 이전에 주의하지 않았던 HTML p 요소의 문제점을 발견했습니다.

먼저 살펴보겠습니다. Easy CHM의 UNREGISERED 버전으로 만든 jQuery1.7에서 설명

하위 요소 중 ol을 포함하지 않는 요소를 유지합니다.

HTML 코드:

<p>
<ol>
<li>Hello</li>
</ol>
</p>
<p>How are you?</p>
로그인 후 복사

jQuery 코드:

$("p").filter(function(index) { return $("ol", this).length == 0;//这里明显有错误的.这样也不可能成功的. });
로그인 후 복사

결과:

[ <p>How are you?</p> ]
로그인 후 복사

사실, 이 오류는 $("ol", this).length == 0입니다. ( this).has("ol").length==0 으로 변경해도 괜찮지만, 다른 요소를 래핑하는 p 요소의 문제가 발생합니다. 전체 HTML에서 이 코드 내용만 있어야 합니다.

<p><div>I&#39;m nest in p element.</div></p>
로그인 후 복사

그런 다음 jQuery를 사용하여 이 HTML에서 p 요소를 가져옵니다.

alert($("p").length);
로그인 후 복사

p는 하나만 있기 때문에 반환 결과는 모두 1이 될 것으로 예상해야 합니다. 실험해볼 수 있습니다.

Chr

ome.Firefox.Opera.Safari.IE.모두 2.왜?

나보다 더 조심스럽고 엉성하지 않은 많은 사람들이 그 이유를 알 것입니다. 이런 종류의 문제는 나에게 매우 중요합니다. 부주의한 사람들은 실수하기가 매우 쉽습니다. P 요소는 블록 수준 요소(P 자체 포함)를 포함할 수 없다는 것이 밝혀졌습니다. . 블록 수준 요소(P 자체 포함)를 포함할 수 없습니다.

위 내용은 html: P 요소를 무작위로 중첩하지 마세요.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿