低版本IE浏览器，使用attachEvent函数绑定onpropertychange事件。
高版本IE和Chrome与Firefox浏览器，使用addEventListener函数绑定DOMAttrModified事件，或使用MutationObserver函数。
propertychange | onpropertychange event
Mutation events
MutationObserver
分类： 工作
设计 编码 构建 创新
在java中使用Jsoup解析富文本防止XSS攻击
不要尝试自己做黑名单过滤，除非你确认自己非常了解html标准和各种浏览器的具体实现，否则你会被各种奇怪的注入方式搞死的。
参考资料：
XSS Filter Evasion Cheat Sheet
XSS Filter Evasion Cheat Sheet 中文版
消除不受信任的HTML (来防止XSS攻击)
jsoup 处理图片时候的一个问题
JSOUP 处理一段标准的html内容，怎么样才能保留这个tag呢。
字符编码相关
javascript和html编码
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
常规方式 <script> html 实体字符 <script> html 十进制字符 <script> html 十六进制字符 <script> javascript 八进制字符 \74\163\143\162\151\160\164\76 javascript 十六进制字符 \x3c\x73\x63\x72\x69\x70\x74\x3e javascript Unicode字符 \u003c\u0073\u0063\u0072\u0069\u0070\u0074\u003e |
Unicode控制字符（Unicode control characters）
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 |
左到右标记（LRM）——Left-To-Right Mark Unicode编号：U+200E HTML代码：‎ 实体：‎ 说明：操作时很象从左到右字符，只是它不显示。LRM 没有任何其它语义效果。 从右到左标记（RLM）——Right-To-Left Mark Unicode编号：U+200F HTML代码：‏ 实体：‏ 说明：操作时很象从右到左字符，只是它不显示。RLM 没有任何其它语义效果。 零宽度联接器（ZWJ）——Zero Width Joiner Unicode编号：U+200D HTML代码：‍ 实体：‍ 说明：防止连续字符在输出上联接。 零宽度非联接器（ZWNJ）——Zero Width Non-Joiner Unicode编号：U+200C HTML代码：‌ 实体：‌ 说明：在两个字符间添加非联接器，防止这两个字符在映射时连接草率。 启动从左到右的嵌套（LRE）——Left-To-Right Embedding Unicode编号：U+202A HTML代码：‪ 说明：表示将从左到右嵌套一些文本。例如， 阿拉伯句子中间的英文引用语可被标记为从左到右的嵌套文本。（LRE 影响单词顺序，不影响字符顺序。） 启动从右到左的嵌套（RLE）——Right-To-Left Embedding Unicode编号：U+202B HTML代码：‫ 说明：表示将从右到左嵌套一些文本。例如，英语引用语中间的希伯来短语可被标记为从右到左的嵌套文本。（RLE 影响单词顺序，不影响字符顺序。） 启动从左到右的优先（LRO）——Left-To-Right Override Unicode编号：U+202D HTML代码：‭ 说明：当需要用于特殊情况（例如，用于部件编号）时，优先于双向字符类型。LRO 强制字符成为从左到右的字符。 启动从右到左的优先（RLO）——Right-To-Left Override Unicode编号：U+202E HTML代码：‮ 说明：当需要用于特殊情况（例如，用于部件编号）时，优先于双向字符类型。RLO 强制字符成为从右到左的字符。 退出方向性格式化（PDF）——Pop Directional Formatting Unicode编号：U+202C HTML代码：‬ 说明：终止上一个显式代码的效果（嵌套或优先），并将双向状态恢复到在上一个 LRE、RLE、RLO 或 LRO 控制字符之前的状态。 国家（地区）数字形状替代（NADS）——National Digit Shapes Unicode编号：U+206E HTML代码： 说明：使用国家（地区）数字形状显示 U+0030-U+0039（ASCII 数字）。国家（地区）数字形状由当前用户的区域设置决定。 名义（欧洲）数字形状（NODS）——Nominal Digit Shapes Unicode编号：U+206F HTML代码： 说明：使用名义数字形状显示 U+0030-U+0039（ASCII 数字）。名义数字形状是欧洲数字。 激活对称交换（ASS）——Activate Symmetric Swapping Unicode编号：U+206B HTML代码： 说明：表示是否应该将成对的字符名中的 LEFT 或 RIGHT 分别解释为有意义的打开或关闭。（默认状态是激活。） 禁止对称交换（ISS）——Inhibit Symmetric Swapping Unicode编号：U+206A HTML代码： 说明：关闭象圆括号这样的字符的对称交换，这样其左边和右边能继续表明向左和向右的朝向，与打开对称交换时的打开和关闭状态相反。 激活阿拉伯成形（AAFS）——Activate Arabic Form Shaping Unicode编号：U+206D HTML代码： 说明：控制阿拉伯兼容性字符的成形行为。在显示过程中，某些字母形式可能以草率的连接或者连字狐线的方式联接起来。成形选择器代码表示用于获得显示效果的字符形状确定（glyph 选择）过程是处于激活还是禁止状态。（默认状态为禁止。） 禁止阿拉伯成形（IAFS）——Inhibit Arabic Form Shaping Unicode编号：U+206C HTML代码： 说明：禁止字符成形确定过程， 这样字符不会根据位置而成形。 记录分隔符（RS）——Record Separator Unicode编号：U+001E HTML代码： 说明：在每个行分隔符后开始新的行。 单元分隔符（US）——Unit Separator Unicode编号：U+001F HTML代码： 说明：每个段分隔符后开始新的段。 |
参考资料：
JavaScript 字符串字面值
Unicode®字符百科
unicode控制字符
ScriptItemize (Windows CE 5.0)
密码保护：Web微信辅助函数
Firefox中一个长达十几年的“BUG”——fieldset标签的overflow属性无效
今天使用fieldset标签遇到的，本以为只是个小问题，没想到却成了挖坟。
示例代码：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> fieldset{ border: solid 1px #EEE; overflow: auto; /*float: left;*/ /* 浮动后Firefox无法修复 */ width: 100px; /*min-width: 0;*/ /* 修复Chrome下宽度无法固定 */ } /* 修复Firefox下宽度无法固定 */ /*@-moz-document regexp(".*") { fieldset { display: table-column; } }*/ </style> </head> <body> <fieldset> <legend>test</legend> <div> testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest </div> </fieldset> </body> </html> |
该代码在IE8至IE11下表现正常，超出宽度后滚动：
但在Chrome47和Firefox42下与预期不符：
一番搜索后，得知：
Chrome下，fieldset标签的默认属性中min-width为-webkit-min-content值。而min-width的优先级大于width属性，因而内部div的width超出了fieldset的width却未出现滚动。可通过设置fieldset的min-width属性来覆盖默认值。
Firefox下，没有好的一个解决方案，只能通过hack方式解决。通过只为Firefox浏览器设置display属性为table-column值，可固定fieldset宽度。
另外，发现如果设置了fieldset元素的浮动属性，会造成Firefox中上述修复方式无效。目前没找到合适的解决方案。
其实，最简单的方式是绕过去，直接设定fieldset元素内的div元素宽度。
最后，祭上“BUG”截图：
参考资料：
<pre>会撑开父辈<fieldset>的宽度，怎么能让pre的宽度随filedset的宽度
<fieldset> resizes wrong; appears to have unremovable min-width: min-content
@document
Bug 261037 – overflow property not implemented on fieldset