页面应该是有多个class叫做"checkgread"的元素吧，通过$('checkgread')获取到的是一个jquery对象数组，加上[0]之后，取到的其实还是一个jquery的对象。所以无法使用原生的js方法，可以试试下面的代码
var checkgread =$('checkgread')[0][0];
对于没有设置宽度的元素、亦或CSS样式非内嵌式的，js原生写法可以通过offsetWidht来获取宽度
即：documentgetElementById("#id")offsetWidth;
ps:对于设置了CSS样式的元素（内联、内嵌、外联）offsetWidth 也都可以获得值
所以，jquery的width()与js的offsetWidth都可以获取元素的宽度，但有个区别：
width()的值单纯是内容区域的宽度、不包括内外补丁和border。ie6+和chrome相同。
offsetWidth ：包括了内补丁和border，不包括外补丁。ie6+和chrome相同
<script type="text/javascript">
//jquery获取ID为abc的元素的宽度
alert($("#abc")width());
//js获取ID为abc的元素的宽度
alert(parseInt(documentgetElementById('abc')stylewidth));
</script>
js通过html对象的style属性获取元素属性
获取到的值是包含单位（px像素）的
将获取到的值转化成整数就可去掉单位
parseInt() 函数可解析一个字符串，并返回一个整数
语法
parseInt(string, radix)
参数 描述
string 必需。要被解析的字符串。
radix 可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。
如果省略该参数或其值为 0，则数字将以 10 为基础来解析。
如果它以“0x” 或 “0X” 开头，将以 16 为基数。
如果该参数小于 2 或者大于 36，则 parseInt() 将返回 NaN。
返回值
返回解析后的数字。
一般用原生js、jQuery获取html元素的值。<div id="test">数值</div>
原生js写法：
alert(documentgetElementById('test')innerHTML);//数值
jQuery写法：
alert($('#test')html());//数值
JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。
在1995年时，由Netscape公司的Brendan Eich，在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作，Netscape管理层希望它外观看起来像Java，因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。
为了取得技术优势，微软推出了JScript，CEnvi推出ScriptEase，与JavaScript同样可在浏览器上运行。为了统一规格，因为JavaScript兼容于ECMA标准，因此也称为ECMAScript。
第一种情况就是宽高都写在样式表里，就比如#div1{width:120px;}。这中情况通过#div1stylewidth拿不到宽度，而通过#div1offsetWidth才可以获取到宽度。
第二种情况就是宽和高是写在行内中，比如style="width:120px;"，这中情况通过上述2个方法都能拿到宽度。（什么是行内，就是直接在html标签上写样式）
小结，因为idoffsetWidth和idoffsetHeight无视样式写在样式表还是行内，所以我们获取元素宽和高的时候最好用这2个属性。注意如果不是写在行内style中的属性都不能通过idstyleatrr来获取。
现在的前端制作很少直接把样式写style里了，都是写在样式表里。如果你要获取的样式没有相对应的（就像#div1stylewidth对 应#div1offsetWidth），就只能分别针对不用浏览器来获取样式表的属性了，可以试着搜索“JS 获取样式属性”之类的。
代码：
var o = documentgetElementById("view");var h = ooffsetHeight; //高度var w = ooffsetWidth; //宽度
扩展资料：
js编程:
JavaScript是一种脚本语言，其源代码在发往客户端运行之前不需经过编译，而是将文本格式的字符代码发送给浏览器由浏览器解释运行。直译语言的弱点是安全性较差，而且在JavaScript中，如果一条运行不了，那么下面的语言也无法运行。而其解决办法就是于使用try{}catch(){}。
Javascript被归类为直译语言，因为主流的引擎都是每次运行时加载代码并解译。V8是将所有代码解译后再开始运行，其他引擎则是逐行解译（SpiderMonkey会将解译过的指令暂存，以提高性能，称为实时编译），但由于V8的核心部份多数用Javascript撰写（而SpiderMonkey是用C++）。
因此，在不同的测试上，两者性能互有优劣。与其相对应的是编译语言，例如C语言，以编译语言编写的程序在运行之前，必须经过编译，将代码编译为机器码，再加以运行。
参考资料：
Document
Document接口表示在浏览器中加载的任何网页，并作为到网页内容的入口点，这是 DOM 树。 DOM树包括诸如<body> 和 <table>之类的元素，其他等等。其也为文档（document）提供了全局性的函数，例如获取页面的URL、在文档中创建新的 element 的函数。它为文档提供全局的函数，像如何获取页面的URL和在文档中创建新的元素。
这里主要用于Document的两个方法
1、 documentgetElementById
返回一个匹配特定 ID的元素
<script>function changeColor(newColor) {
var elem = documentgetElementById("para1");
elemstylecolor = newColor;
}
</script>
</head>
<body>
<p id="para1">Some text here</p>
</body>
新手注意：
新手要注意方法名中 'Id' 的拼写——'getElementByID' 是没有作用的。许多人会忽视这个错误。
如果没有查找到对应的元素，方法会返回null。注意ID参数是大小写敏感的，所以documentgetElementById("Main")无法获取到元素<div id="main">，因为'M'和'm'是不一样的。
2、DocumentgetElementsByClassName()
返回一个类似数组的对象，包含了所有指定 class 名称的子元素。
documentgetElementsByClassName('test'); //获取所有class为'test'的元素documentgetElementsByClassName('red test'); //获取所有class同时包括'red'和'test'的元素
以上就是关于用jquery去获取元素 用原生js去写样式为什么 会报错全部的内容，包括:用jquery去获取元素 用原生js去写样式为什么 会报错、js中如何取得一个div的width注意此css的width是在<style></style>中设置的。、js 怎样获取div的宽度等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）