非IE6,7,8可以直接用自带的属性 getElementsByClassName,如果需要考虑兼容,就需要自己写了。下面是自己写的:
function getClassName(obj,sName) //-->obj是要获取元素的父级
{ //-->sName是class名字
if(documentgetElementsByClassName)
{
return objgetElementsByClassName('sName');
}
else
{
var aTmp = objgetElementsByTagName('');
var aRes=[];
var arr =[];
for(var i=0;i<aTmplength;i++)
{
arr = aTmp[i]classNamesplit(' ');
for (var j=0;j<arrlength;j++)
{
if(arr[j] == sName)
{
aRespush(aTmp[i]);
}
}
}
return aRes;
}
}
大概思路,是将你要获取class元素父级下的所有元素都取出来,再循环查找className,满足的元素存到数组中,然后返回。
很明显你的html结构是table,所以可以循环每个tr来做对应。
比如:
var arr=[];
$("table tr")each(function(){
var name=$(this)find("lable")attr("name") || "";
var val=$(this)find("input")val() || "";
arrpush({
name:name,
value:val
})
});
consolelog(arr);
arr就是个数组,也是你要的数据,当然你可根据自己的情况作调整
可以通过jquery的属性选择器获取到元素,然后再得到title,具体代码如下:
$('button[data-id="id_select_gg"]')attr('title')
jQuery获取方法
data()方法
//HTML代码 <div id="myDiv" data-appid="123" data-myname="lsxj" data-app-id="456" data-my-name="secondname"></div>
//获取属性
var appid = $("#myDiv")data("appid"); //123
var app-id = $("#myDiv")data("app-id"); //456
//属性赋值 $("#myDiv")data("appid","666");
//最终HTML代码 <div id="myDiv" data-appid="123" data-myname="lsxj" data-app-id="456" data-my-name="secondname"></div>
需要注意的是,data()的值进行修改并不会影响到DOM元素上的data-属性的改变。data()的本质其实是将一个 “cache” 附加到了对象上,并使用了一个特殊的属性名称。
所以上述代码中,虽然对div进行了data()赋值 *** 作,但HTML代码中div的data-appid的值仍然为123,因为data()只是修改了缓存的那个值,此时进行$('#myDiv')data("appid")的 *** 作,输出的结果为666
js获取data-的方式
通过dataset属性访问
//HTML代码
<div id="myDiv" data-appid="123" data-myname="lsxj"></div>
//js代码
var div = documentgetElementById("myDiv");
var appId = divdatasetappid;//获取data-appid的值
var myName = divdatasetmyname;//获取data-myname的值
//设置值
divdatasetappid = 456;
divdatasetmyname = "newname";
//最终HTML结果
<div id="myDiv" data-appid="456" data-myname="newname"></div>
dataset属性的值是DOMStringMap的一个实例,名值对的映射。每个data-name形式的属性都有一个对应的属性,只不过该属性名没有data-前缀。
兼容性:
需要注意的是,dataset中大小写的问题。带连字符连接的名称在使用的时候需要命名驼峰化。例如data-my-name对应的是datasetmyName的值。可看以下代码
//将上面代码的设置值部分进行修改divdatasetappId = 789;
divdatasetmyName = "secondname";
//最终结果
<div id="myDiv" data-appid="123" data-myname="lsxj" data-app-id="456" data-my-name="secondname"></div>
有一定的JS基础后,就可以进入 dom 环节了,dom使得网页的交互效果得到完美呈现,可以说dom真正打开了网页和用户之间的通道桥梁,日常生活中我们点击鼠标,敲击键盘,甚至于无意间触碰到屏幕(触摸屏),都会或多或少或大或小的得到一些躲藏起来的内容。
打开淘宝,在输入框输入商品时,下拉的推荐商品:
或是当打开某个不想再浏览的网页时,右上角的那个×:
这些大部分都存在DOM的身影。
这里的“DOM”,通常来讲,叫做 DOM 文档对象模型 , 通过 *** 纵DOM,可以随意更改内容,样式,或者增删改查 ,因为网页是在浏览器中显示的,整个浏览器是BOM,所以DOM其实是BOM的一部分,BOM 就是 window对象 ,DOM 就是 document(文档)对象。
如果该元素,是网页的必备元素,而且只能有一个,可以通过document对象直接获取。比如:的src属性:
任由我们怎么去修饰的显示,但它本身的路径属性是独有的,所以我们可以直接获取:
更多的时候,我要需要获取网页中的指定元素,这就需要专门的方法来获取了,这里列举几个方法:
getElementById()方法,根据元素的id属性值来获取指定的元素,因为ID的唯一性,使得该方法需要搭配ID选择器使用,如果网页里ID重复时,它会获取第一个:
getElementsByTagName()方法,根据元素的标签名获取所有该元素,该方法获取的是所有该标签的元素,以伪数组的形式呈现:
getElementsByClassName()方法,根据元素的类选择器名称获取所有该元素,该方法获取的途径是标签的类,也就是class属性,由于拥有该属性的标签可能不只一个,所以该方法获得的也是一个伪数组(还有,可以看方法名,凡是带Elements的大多数都是伪数组):
getElementsByName()方法,根据元素的name属性值获取所有该元素,相同的性质,有name属性的标签也不少:
querySelector()方法,根据选择器的名称返回元素,如果有多个元素,只返回第一个元素,这个方法就比较常用了,而且IE这个啥也不咋适配的浏览器现在几乎不咋能见到了,可以多多考虑用他了该方法是 ES6新增,无论是ID 还是class都可以选,但是和上面区别的是选ID时前面要加#号,选class时前面要加“”:
区别于Elements,这里是个单数,所以只会获取一个,要是想获取多个相同的,就用querySelectorAll()吧!querySelectorAll()看这个ALL就知道它是用来选全部的:
最后这俩方法更实用,可以选取CSS几乎所有选择器,而且querySelectorAll()得到的数组数据后还可以使用数组的方法。
*** 作DOM的样式 ,有多种方式:
通过style属性直接设置
通过className属性设置类选择器
也可以通过classList属性添加多个类选择器
*** 作DOM的内容:
innerText属性,用于获取 和 *** 作 DOM的文本内容。
innerHTML属性,用于获取 和 *** 作 DOM的HTML内容:
createElement()方法,用于创建DOM元素:
appendChild()方法,用于在当前DOM元素中添加子元素:
自删 remove()方法,是元素删除自己:
通过父级删除子级 removeChild()方法,是删除元素里面指定的子元素:
以上就是关于DocumentEdit.jspie11缺少对象全部的内容,包括:DocumentEdit.jspie11缺少对象、js 根据class属性获取值并写到input 提交、jsoup教程等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)