html li标签设置value诡异的问题

简介:

设置li的value为一串数字,结果获取的时候不是原来的值.

直接上代码:

Html代码   收藏代码
  1. <!DOCTYPE html>  
  2. <html lang="en">  
  3. <head>  
  4.     <meta charset="UTF-8">  
  5.     <title>给li标签设置value</title>  
  6. </head>  
  7. <body>  
  8. <li id="myLi"></li>  
  9. <script type="text/javascript">  
  10.     window.onload = function () {  
  11.         console.log('onload');  
  12.         var li22 = document.getElementById('myLi');  
  13.         li22['setAttribute']('value', ('90000786062'));  
  14.         console.log(li22);  
  15.         console.log(li22.getAttribute('value'));  
  16.     }  
  17.   
  18. </script>  
  19. </body>  
  20. </html>  

 在IE 11中的结果:

 控制台打印:

 原因:

ul 中的li定义的value会自动转换为int.数值,ie 浏览器下大于int最大值,显示int最大值,其他浏览器显示为0.而且无论你定义什么值,都会转int.默认为1,例如value=中文。所以如果你想要实现正确取值,就需要换一个li属性例如自定义属性time.或者改一种实现标签元素,例如div.都可以

解决方法:

不使用value,而使用其他名称

Html代码   收藏代码
  1. <!DOCTYPE html>  
  2. <html lang="en">  
  3. <head>  
  4.     <meta charset="UTF-8">  
  5.     <title>给li标签设置value</title>  
  6. </head>  
  7. <body>  
  8. <li id="myLi"></li>  
  9. <script type="text/javascript">  
  10.     window.onload = function () {  
  11.         console.log('onload');  
  12.         var li22 = document.getElementById('myLi');  
  13.         li22['setAttribute']('value2', ('90000786062'));  
  14.         console.log(li22);  
  15.         console.log(li22.getAttribute('value2'));  
  16.     }  
  17.   
  18. </script>  
  19. </body>  
  20. </html>  

 IE11 :

 

 

相关文章
|
18天前
|
移动开发 JavaScript Java
关于Android中如何过滤HTML标签
关于Android中如何过滤HTML标签
25 0
|
2天前
|
数据采集 缓存 自然语言处理
PHP将HTML标签转化为图片
通过这个方法,PHP后端能够实现将HTML内容转化为图片的功能。这种方式虽然牵涉到一些额外的安装和配置,但能够相对灵活且稳定地解冀转换需求,适用于需要在后端动态生成图片的场景。
3 1
|
19天前
|
搜索推荐 前端开发 SEO
SEO需要了解的8大html标签
SEO需要了解的8大html标签
24 2
|
18天前
HTML【详解】表格 table 标签(table的属性,语义化表格,简易表格,合并单元格)
HTML【详解】表格 table 标签(table的属性,语义化表格,简易表格,合并单元格)
41 0
HTML【详解】表格 table 标签(table的属性,语义化表格,简易表格,合并单元格)
|
23天前
|
JSON JavaScript 数据格式
文本-----wangEditor的使用,设置和获取内容,展示HTML无样式怎么办????console同步展示怎样写,Vue的配置在Vue3配置文件中的配置,是editor中的v-model绑定的值
文本-----wangEditor的使用,设置和获取内容,展示HTML无样式怎么办????console同步展示怎样写,Vue的配置在Vue3配置文件中的配置,是editor中的v-model绑定的值
|
8天前
|
XML 数据采集 机器学习/深度学习
使用 XPath 定位 HTML 中的 img 标签
使用 XPath 定位 HTML 中的 img 标签
|
18天前
HTML【详解】超链接 a 标签的四大功能(页面跳转、页内滚动【锚点】、页面刷新、文件下载)
HTML【详解】超链接 a 标签的四大功能(页面跳转、页内滚动【锚点】、页面刷新、文件下载)
18 0
|
24天前
|
Web App开发 移动开发 HTML5
文本,兼容性-----HTML5新增音频和视频标签
文本,兼容性-----HTML5新增音频和视频标签
|
25天前
|
移动开发
常用HTML标签及其作用
常用HTML标签及其作用
|
25天前
|
搜索推荐
html【标签】meta base
html【标签】meta base
16 0