我的天

罪过，今天晚上本打算和妈一起去医院然后再自己回来的，结果太用心研究点点模板以至于妈什么时候走的我都不知道……

昨天的台风严重坑爹，我们很傻冒地“严阵以待”，但是，今天早上发现啥事都没有，就赶紧跑路了。但前天沿江高速发生爆炸，封闭了，我们被迫兜了好大一个圈回广州。足足花了2个小时！虽然路上没有塞车，但用时却是平时的2倍多。

我对省人民医院没什么好感。就像我不崇拜大明星一样，我也不崇拜大医院。那个楼陈旧啊，那个房间陈旧啊，病房小到了一个境界，而那些病床配套的椅子更是历史悠久。或许在我懂事以后我不知道很烂很烂的病房到底是怎么个模样的吧，我看太多米国医务剧了，我看太多香港医务剧了，我只接触过一个广医二院新盖不久的住院楼。

外婆这次是去换心脏起搏器，要做那玩意的手术，通常医院极快就有床位了，前提是你的手术没啥风险，比如说你年纪不大，你没啥并发症神马的。因为，一个1小时的手术，单是那个起搏器本身就已经得花两万到是几十万不等了，不知道这其中的水分有多少，但几天的住院期，一小时的手术就能不知道赚多少，因为起搏器这东西医保是不包的，即便能报销，也只是一点点，所以…… 生命本来是非常宝贵的东西，但无意中却跟臭钱扯上关系，那可真是让人不快。但是，如果能挽救生命，花再多的钱又算什么呢，毕竟钱没有了，还能重新赚回来，生命没有了，绝对没有TAKE TWO了！

今天晚上花了很多时间去研究到底可不可以用一个div的hover属性触发出另外一个div，用div-a-div是肯定能做到的，但这样话，第二个div就不能嵌套a了，因为这是一个错误的写法。但如果用div-div-a的话，就完全没问题。

经过N多次的尝试，我觉得这是一个position:absolute/relative以及display:block/none使用的问题。有例子，有真相

1
2
3
4
5
6
7
8

/*CSS部分*/
 
#side{position:absolute;left:-48px; top:40px;width:50px;display:block;}
#side-tabs {background:url(http://x.libdd.com/farm1/5b7f4a/fbba4837/slide-bg.jpg);text-align:center;padding:5px;font-size:16px;display:block;color:#ccc;position:absolute;}
#side-tabs:hover .side-panel{top:0;left:50px;position:absolute;display:block;width:300px;z-index:25;}
#side-tabs .side-panel{background:url(http://x.libdd.com/farm1/5b7f4a/fbba4837/slide-bg.jpg);left:50px;width:300px;height:40px;display:none;position: absolute;padding:5px;word-wrap:break-all;line-height:1.5em;text-align:left;font-size:small;}
#side-tabs .side-panel a{color:#ffffff;}
#side-tabs .side-panel a:hover{color:#ccc;}

1
2
3
4
5
6
7
8

<!--XHTML部分-->
 
<div id="side">
	<div id="side-tabs">关于模板
		<div class="side-panel">Designed by <a href="http://blog.etcetradesign.net" title="Theme Creator Site">Idraki Muhamad</a><br />Modified by <a href="http://www.xlanda.net/">xrspook</a>
		</div>		
	</div>	
</div>

最重要的是要通过hover被显示的div必须position:absolute，且在非hover的设置下为display:none。利用hover引出第二层div的首层div必须设置为display:block/inline-block，position可以是absolute或者relative。

我不懂js和jQuery，所以我一直在努力研究只用XHTML和CSS解决问题，不是有所有问题都一定能这般解决，但这次，我成功了。

不屈不挠，自己也能成为挽救自己的英雄！

昨天晚上收到Lei的这些回复，彻底死心了……

Lei
告诉你一个处理方法，将最外围的a标签干掉，换成div什么的，让DOM结构正常化。然后在外层的div上绑click事件，阻止浏览器本身的事件，然后用JS将页面跳转到想要的页面。
19小时前

Lei
看到DEMO终于知道怎么回事了。因为你的a标签里面还嵌套着a标签，这用法本身就是错的（看来画廊模板真的很烂），所以浏览器解析出来的DOM结构就是错的。用JS去A标签，也是在错误的DOM树上修改，就不可能正常了。
19小时前

原来我的瞎想一开始就是错的，难怪……所以虽然我已经很努力了，但还是没有实现我的目标，因为我的方向根本就是错的。昨晚看了两个把“span”利用JavaScript当“a”用的例子（例子1，例子2），结果发现纯文字链接没问题，加上非文字部分就歇菜了。估计是某些判断句所设定的非空与不是常规字符串有空格回车什么的东西产生矛盾。对JS可算是一窍不通，看来这回，我真的很有理由认真地学学JS了。

HTML、CSS、JavaScript、jQuery浏览器端的神兵利器，外加服务器端的PHP和SQL，哇咔咔。如果当初我读的是网络工程神马的，估计会很神奇，不过如果我的专业真是那个我就不会花那么时间激情澎湃地像现在这样去学习了。

今天没搞懂是怎么回事，库里有一帮人在拍片子，整个下午就耗在当群众演员上，外加早上一回来就说开神马会，结果，一天就这么被浪费掉了，多可惜啊～～～

明天是Raw，是Alberto Del Rio vs. CM Punk的WWEC rematch，对结果，我不存在丝毫的幻想，我只希望他们能给出一场精彩的比赛，足矣。可以没有头衔，但不可以没有血性，哪怕当个跑龙套的jobber！

不知道推迟了1个多月的演讲明晚会不会举行，真讨厌！

我真的已经很用力地去想解决“a div a”这个三角恋问题了！不过，还是没想出对策，哭～～～

这“a div a”三角恋是这样的：第一个“a”嵌套着第二个“div”，第二个“div”嵌套着第三个“a”，理论上，第二个“div”肯定被第一个“a”包含，但如果“div”里含有第三层的“a”，那么“div”就会自动脱离第一个“a”的嵌套，第一个“a”和第二个“div”变成同级关系。这会导致什么结果呢？第一层“a”和第三层“a”同时存在！但我的目标是当鼠标滑过div这个片区时只有一种链接即只有第一个“a”起作用，第三层“a”必须的只保留纯文本或者干脆拜拜。

没看懂我上面话的可以直接看源文件：HTML + CSS

这貌似很简单，但我至今没找到对策，尤其是适合各种主流浏览器的（Chrome，Firefox，IE8等）方法。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

// SH想出了这个
 
jQuery(".postmetadata1").each( function() {
	jQuery(this).html(jQuery(this).html().replace(/<a [^>]*>|< \/a>/gi,""));
});
 
// 我折腾出了这个
 
jQuery(".postmetadata1 a").each( function() {
	$(this).replaceWith($(this).html());
});
 
// 点点的Lei给出了这个
 
$(".postmetadata1").each(function() {
	var str = jQuery(this).html(),
	code = str.replace(/</a><a [^>]*>|< \/a>/gi,"");
	console.log(str);
	console.log(code);
	$(this).html(code);
	console.log($(this).html());
});
</a>

在Firebug看，这三种方法都能把第三层a干掉，不过，三个方法都会把第一层“a”和第二层“div”变成同级，即第一层“a”失效，无法做到当鼠标移过第二层“div”片区的时候出现正确链接。三种方法在Chrome和Firefox下片区链接都浮云了，展示效果一样。SH的方法在IE8下可以实现我的目标功能；我的方法在IE8下显示诡异，第二层“div”片区有第一层“a”的导航但无法打开链接；Lei的方法在IE8下会显示怪异，第二层“div”片区有第一层“a”的导航但无法打开链接，也有第三层“a”的导航且可以打开。各种怪异，各种神奇！！！！为什么用点点的“description|nohtml”就能轻易除去内容里的各种HTML标记，要在浏览器层面单纯干掉这般嵌套的“a”却这么难呢？？？？

期望高人想出解决问题的JavaScript（可以包含jQuery）！

昨晚在电脑前抓了几个小时的头，凌晨1点+才睡觉，今天在早上继续抓了1个多小时，未果，不能再纠结了，我答应了妈要陪她去茶博会的，茶博会今天是最后一天。于是，大概在中午1点，我暂时放下包袱，出门口了。

茶博会么，有茶的，也有咖啡的。今天我花掉了95元，20元的入场费（10元/人），10元的espresso体验（5元/杯，250mL），15元的2罐玄米茶叶，50元1套的250g纯咖啡粉越南滤杯套装送了5条同一牌子的三合一咖啡。妈花了10元买胎菊。最让我兴奋的收获该数各种咖啡的试喝。第一次喝espresso呢！漂亮是有了，但我觉得有点怪怪的，味道有点淡，5元250mL我就不奢求什么了。虹吸式咖啡壶煮出来的波多黎各咖啡，这种波多黎各咖啡酸味挺弱，基本没有，苦味中偏强，苦后会甘。喝了不知道是不是猫屎咖啡的猫屎咖啡，酸味和苦味都要比波多黎各的重，味道也更活泼延绵，苦后甘，但感觉跟我平时喝的不太一样，我不是很喜欢。最痛苦的要数某个意大利咖啡，估计那是要弄espresso的，但没有奶没有发泡，所以，杯具啊～～～ 不酸、苦得很彻底，是我喝过所有咖啡中最苦的！苦完以后还不甘，内牛满面，不习惯咖啡的小盆友别自残试这个，即便30mL都会让你抓狂死…… 现在我仍无睡意，今晚或许要看着蚊帐顶发呆了。可能是我来得不是时候吧，这个咖啡展区已经有很多单位撤场了，而且随着时间的推移，各个商家都在打包降价促销想赶快走人，这有好有不好。

我可以明确地说，我对茶叶没什么爱的，对茶具也没什么爱的。

茶博会出来，本来想去员村的知名外国超市麦德龙见识一下，但那个鬼地方需要会员卡，我那个去！为啥不在门口写？！保安站在入口查会员卡，我分明的木有。这让我想起了很久很久以前机场路附近的万客隆，也就是现在的易初莲花，也是要会员卡，大概是10年+以前的事了，但那时万客隆就已经不免费提供塑料袋，但入场人流依旧变态，那是我第一次见识什么叫做Supermarket！后来，好又多遍地开花了，家乐福来了，吉之岛越来越多了，华润万家、百佳雨后春笋，超市成了普通事物，但第一次的万客隆经历还是很惊艳。今天在麦德龙吃到了闭门羹，很不爽，但总有一次，我会去那里见识的！

下午5点多回到家，继续纠结我的“a div a”三角恋，依旧未果，呜呜呜～～～

很傻很天真的以为用正则可以轻易提取出div里的层层嵌套div，结果囧得厉害。div的开头通常都带有class或id，唯一，且容易辨认，但div的结尾，清一色的“/div”，真会搞死人。网络上流传的提取div版本貌似都不太可行。在一坨里提取一堆只是第一步，第二部还得把提取到的内容xml数组化。

其实呢，我也有想过一开始就对所有内容xml数组化，不过，信不信由你，从最开始那层<>到我要提取的那些内容少说也有15层，而且如果那些网页设计者好心加一层或减一层，我又得慢慢摸到底哪里出问题了。所以，用xml数组化是个思路，但“解剖”源数据的工作量不少且维护困难。毕竟，这不是5层，这是15层+啊！怨念那些穿那么多层衣服的网页。

正则难提取嵌套div，xml太郁闷，咋办呢？

我还有一个很天真的办法，手动选取要提取部分的代码然后贴到程序里提取。这么一来就解决了难提取困难的问题，当然啦，都手动干了，还有什么难不难的，这个办法很低级，但一定可行。

怎么办呢，怎么办呢？！

应该是我想得还不够深入，再花点时间动动脑筋好好琢磨琢磨吧。

今天很坏地想到用正则提取，table输出，然后直接Excel粘贴保存，早上还在兴奋这个伟大思路，下午就发现正则把我卡死，生活真是个悲喜剧。

别囧，我有的是时间，一定可以的！

终于做完了一个table转div的改造，太折磨人了！除了要考虑如果使用div实现table的效果与功能外，还得面对成功通过Google Chrome，Opera以及Firefox测试，但在IE内核却会出现囧效果的悲情时刻。对我来说，使用div不难，但在使用了N多的margin、padding、border后仍能使网页在IE下正常，对我来说那是最最难的。偏偏，国内的大家还依赖于IE浏览器，而且还是IE6占主导。所以，无论我多IN，无论我学会了多少新规则并使用都是徒劳。table转div后，除了信息量增加了以外，文件大小还减少了20%。从维护角度，div更简单，但偏偏，table不会引起IE问题，但div容易。

心力交瘁无奈状。

困了，又困了。

今晚应该能看上几场Finlay的比赛，我欠别人很久了。

生活本不复杂，但这样那样的人为限制越来越多，于是我们就经常碰壁了。怀念那些Google Docs的日子，怀念那些imageshack的日子，更怀恋那些U2的日子，但怀念神马的都是浮云。

IE，一种让人绝望的浏览器！