关于p标签的嵌套问题
今天群里问了一个p的问题,初看我觉得恩这么简单我应该知道。
他代码如下:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
</head>
<body>
<body>
<div>
<p><p></p></p> </div>
</body>
</body>
</html> <script>
$(function(){
var p = $("p");
alert(p.length);
});
</script>
然后输出了3
我怎么看也是2啊,然后我就让他把代码发给我看看,后来别人说p嵌套会有问题,我就试了一下其它标签 发现i,a ,div都是好的,
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
</head>
<body>
<div>
<div>1<div>2</div>3</div>
</div>
</body>
</html>
<script>
$(function() {
var $targetName = $('div');
console.log('i len:',$targetName.length); for(var i=0;i<$targetName.length;i++) {
console.log($targetName.eq(i).html());
}
});
</script>

然后我突然想起,p里面是不能嵌套块级的,p自己也是块级,
例如<p>1<p>2</p>3</p>
他最后会被解析为
<p>1</p>
<p>2</p>
<p</p>
然后我继续想,如果我把p的style设置为inline呢?
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
<style>
p {
display: inline;
}
</style>
</head>
<body>
<div>
<p>1<p>2</p>3</p>
</div>
</body>
</html>
<script>
$(function() {
var $targetName = $('p');
console.log('p len:',$targetName.length); for(var i=0;i<$targetName.length;i++) {
console.log($targetName.eq(i).html());
}
});
</script>
恩 还是会输出3的, 这个应该是和浏览器有关系的。
ps:问题虽小,但是我今天才知道,略掉脸,囧。
)OP8.jpg)
关于p标签的嵌套问题的更多相关文章
- XHTML标签的嵌套规则分析
在 XHTML 的语言里,我们都知道:ul 标签包含着 li.dl 标签包含着 dt 和 dd——这些固定标签的嵌套规则十分明确.但是,还有许多标签是独立的,它们没有被捆绑在一起,比如 h1.div. ...
- HTML标签的嵌套
随着时间的推移,我们学习html的基础知识有了大概的了解.而我发现,平时在写html文档的时候,发现不太清楚标签之间的嵌套规则,经常是想到什么标签就用那些,然而发现有时的标签嵌套却是错误的.通过网上找 ...
- HTML标签的嵌套规则
我在平时在写html文档的时候,发现不太清楚标签之间的嵌套规则,经常是想到什么标签就用那些,后来发现有些标签嵌套却是错误的.通过网上找资料,了解了html标签的嵌套规则. 一.HTML 标签包括 块级 ...
- XHTML标签的嵌套规则--很基础很重要
XHTML的标签有许多:div.ul.li.dl.dt.dd.h1~h6.p.a.addressa.span. strong……我们在运用这些标签搭建页面结构的时候,是可以将它们无限嵌套的,但是,嵌套 ...
- 为什么p标签不能嵌套div??
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- 火狐下<a>标签里嵌套的<select>不能选的bug
今天遇到了这个问题,网上一找就找到原因了:在狐火下<a>标签里嵌套的<select>不能选 可是我查找这个问题过程中依然饶了一些时间,原因是在<a>标签没有写hre ...
- html标签的嵌套规则分析
1.a标签最好不要嵌套块级元素,可以嵌套内联元素,但是不能嵌套a标签和input之类的标签.能嵌套的标签像,等等. 2.ul和ol的子元素不能是别的元素只能是li,不能是别的比如div等,但是li中可 ...
- HTML中部分标签的嵌套问题
书写HTML结构的时候,对于标签的嵌套问题,在我发现这个问题之前,都不在自己的考虑之中,还傻傻的以为标签之间是可以进行百搭的! 其实,有些标签是不能进行随意嵌套,如果你没有深受其害,你是不会发现它的存 ...
- 超级简单却不知道:html标签的嵌套规则
XHTML的标签有许多:div.ul.li.dl.dt.dd.h1~h6.p.a.addressa.span. strong……我们在运用这些标签搭建页面结构的时候,是可以将它们无限嵌套的,但是,嵌套 ...
- PHPCMS V9标签循环嵌套调用数据的方法
PHPCMS V9的标签制作以灵活见长,可以自由DIY出个性的数据调用,对于制作有风格有创意的网站模板很好用,今天就介绍一个标签循环嵌套方法,可以实现对PC标签循环调用,代码如下: 在此文件里/php ...
随机推荐
- JavaScript 关闭浏览器窗口
<input type="button" name="m" value="关闭窗口" onclick="window.clo ...
- Redis 基础概念和命令
Redis 是什么 Redis是一种基于键值对(key-value)的NoSQL数据库. 为什么使用Redis 速度快 Redis的时间颗粒度一般是微秒,慢查询的默认值是10 000微秒,即10毫秒. ...
- cnblog编辑Latex数学公式
Latex在线公式编辑器 http://www.codecogs.com/latex/eqneditor.php 1. 行内公式: code $ \sqrt{a^2} $ display $ \sqr ...
- MySQL入门很简单: 5 索引
1. 索引的含义和特点 索引:创建在表上,是对数据库表中一列或多列的值进行排序的一种结构. 存储类型: B性树(BTREE)索引和哈希(HASH)索引: InnoDB和MyISAM支持BTREE索引, ...
- hdu-1247 Hat’s Words---字典树模板
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1247 题目大意: 给出一些单词,以EOF结束,看其中哪一个单词可以由其他两个单词组成,将其输出 解题 ...
- 遍历ResultSet,行列要从1开始
为什么遍历ResultSet,行列要从1开始. 因为Resultset的第一行的第一列都是空的,要用rs.next()到第一行才能进行读取. Statement stmt=null; ResultS ...
- 继承FileInputFormat类来理解 FileInputFormat类
import java.io.IOException; import java.util.ArrayList; import java.util.List; import org.apache.had ...
- GPU计算的后CUDA时代-OpenACC(转)
在西雅图超级计算大会(SC11)上发布了新的基于指令的加速器并行编程标准,既OpenACC.这个开发标准的目的是让更多的编程人员可以用到GPU计算,同时计算结果可以跨加速器使用,甚至能用在多核CPU上 ...
- Linux驱动学习(编写一个最简单的模块)
在Linux中想做驱动开发,那么一定要先熟悉module的使用和编写 一.什么是module 从名字上看就是模块的意思,我个人的理解就是一个一个的小程序,可以进行动态的安装和卸载,而在这里面就实现一些 ...
- C# for语句
一.C# for语句 for语句是C#语言中使用频率最高的循环语句. 1. for语句 语法格式如下: for(initializer; condition; iterator){ embedd ...