JvavScript正则取img的alt值问题
本文最后更新于 5964 天前,其中的信息可能已经有所发展或是发生改变。

我最近最想做的一件事情就是找坨大便摔到IE开发人员的脸上,先说事情吧。

在Discuz!可视化编辑器和UBB编辑器之转换的时候,比如本来是

<img src="http://www.love.com/Discuz!6.0/images/avatars/noavatar.gif" border="0" alt="头像"/></coolcode>
但是IE给的内容是
<coolcode linenum="off">
<img alt=头像 src="http://www.love.com/Discuz!6.0/images/avatars/noavatar.gif" border=0/>

好好的双引号硬是给我吃了,莫非你很饿么?
本来用的正则是re = /alt=(["']+)([\s\S]*?)(\1)/i;去匹配出alt的值出来。
结果IE给出的内容就没法匹配,关键是没有双引号,而且alt值有能位任意值,Firefox就没有这个问题。

很是郁闷,有机会让我见者了开发IE浏览器内核的人,我一定丢坨大便给他,估计每个和JavaScript以及各个版本浏览器大交道的同行都有次想法吧:)

最后的解决方式是:加了另外加了个正则

re = /alt=([\s\S]*?)(>|\s>|\ssrc|\sborder|\swidth|\sheight|\s\/>|\")/i;

去匹配IE产生的这些非标准内容。

详细代码如下:

    //下面取alt值是针对标准浏览器即alt="xxxx"带双引号模式;
    re = /alt=(["']+)([\s\S]*?)(\1)/i;
    var matches = re.exec(attributes);
    if(matches != null) {
        var alt = matches[2];
        if(alt.length) {
            return '[img=' + src + ']' + alt + '[/img]';
        }
    }

    //下面取alt值是针对非标准浏览器比如狗日的IE,即alt=xxxx这种不带双引号模式;
    re = /alt=([\s\S]*?)(>|\s>|\ssrc|\sborder|\swidth|\sheight|\s\/>|\")/i;
    var matches = re.exec(attributes);
    if(matches != null) {
        var alt = matches[1];
        if(alt.length) {
            return '[img=' + src + ']' + alt + '[/img]';
        }
    }

大家如果有什么比较好的方式请一定要告知我哦!!~~

下午更新:
感谢blankyao的提醒,发现前面传过来的attributes最后是没有>符号的
所以正则修改为re = /alt=([\s\S]*?)(\ssrc|\sborder|\swidth|\sheight|\")/i;

评论

  1. 16年前
    2007-11-02 14:05:21

    刚才写漏了几个字符,重新写….
    当字符串是也就是说最后一个“>”前面有”/”时,针对非标准浏览器的正则会把“/”也匹配上,也就说返回的是“头像/”,我认为应该把正则改为
    /alt=([\s\S]*?)(>|\s>|\ssrc|\sborder|\swidth|\sheight|\s\/>|\/>|\”)/i,也就是说在第2个括号里加上”\/>”这个可选项。
    另外,写了个兼容两种浏览器的
    re = /alt=(\”?)([\s\S]*?)(>|\s>|\ssrc|\sborder|\swidth|\sheight|\s\/>|\/>|\”)/i;
    var matches = re.exec(attributes);
    if(matches != null) {
    var alt = matches[2];
    if(alt.length) {
    return ‘[img=’ + src + ‘]’ + alt + ‘[/img]’;
    }
    }
    不对的地方请水水指导!

  2. 博主
    16年前
    2007-11-08 9:46:16

    感谢blankyao的提醒,发现前面传过来的attributes最后是没有>符号的
    所以正则修改为re = /alt=([\s\S]*?)(\ssrc|\sborder|\swidth|\sheight|\”)/i;

  3. Go_Rush
    16年前
    2008-4-01 13:25:36

    IE 下:
    对于没有用引号包含的情况,那么就可以肯定 alt值里面没有包含空白符号。 那么,可以尝试一下下面这样的写法

    var s=”;
    alert(getAlt(s));

    function getAlt(str){
    var arr=/alt=([^\s]*)\s/i.exec(str);
    return arr==null ? ” : arr[1];
    }

  4. Go_Rush
    16年前
    2008-4-01 13:41:02

    愚人节:
    给你来一个搞笑版本

    var str=”;

    alert(getAlt(str));

    function getAlt(s){
    var code=s.split(“‘”).join(“\\'”).split(‘=’).join(“‘:'”).split(/\s+/).join(“‘,'”);
    eval(“var hash={‘tagName’:'”+code+”‘};”);
    return hash.alt;
    }

  5. 16年前
    2008-5-08 15:59:05

    还是用JQ吧,很方便

  6. ashuai
    16年前
    2008-8-20 12:36:33

    把img tag匹配出來,轉換成DOM對象,這樣就沒兼容性問題了

  7. 博主
    16年前
    2008-8-21 1:06:32

    @ashuai 这方法不错。

  8. 15年前
    2009-4-23 16:22:46

    /alt\s*=\s*[\’\”]?(.*?)[\’\”][^>]/si

  9. yzm
    15年前
    2009-6-27 16:07:27

    大家完全忽视了document对象

  10. 13年前
    2011-5-16 23:23:23

    I bow down hmulby in the presence of such greatness.

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇