table.cell[].innerText works in IE but not in mozilla - javascript

Javascript
function test(){
var tableToSort = document.getElementById('tblid');
for (i=1; i < tableToSort.rows.length; i++)
{
alert("result ============> "+tableToSort.cells(iCurCell).innerText);
iCurCell = iCurCell + tableToSort.cols;
}
}
Upper function not works in IE but not in mozilla so i have change it with
function test(){
var tableToSort = document.getElementById('tblid');
for (i=1; i < tableToSort.rows.length; i++)
{
alert("result ============> "+tableToSort.rows[iCurCell1].cells[2].textContent);
iCurCell = iCurCell + tableToSort.cols;
}
}
In mozilla for first record of loop it works fine but for other it prints undefined.
While in IE all records print correctly.

innerText property is only for IE, see this page, use textContent for most of browser including IE9.

you should really look for the textNode inside the tablecell:
inside your for:
var tcell = tableToSort.rows[iCurCell1].cells[2];
var child = tcell.firstChild;
do {
if(child.nodeType == 3)
break;
} while(child = child.nextSibling);
var textThatYouWant = child.nodeValue;
this is the true DOM implementation that will work with all browsers

Related

Object doesn't support property or method 'item' IE 9

I am trying to find all buttonitems. In chrome and modern browsers this works fine but in ie9 I am having the error above. I can't change the HTML on the page only the javascript on the page. In chrome I can use document.getElementsByClassName() but in ie 9 I can't even though I should be able to probably because the website has to run in comparability with Quirks. I have tried rewriting the code to work without this and believe I have got the elements with the code
if(navigator.userAgent.toLowerCase().indexOf('msie') != -1){
if (document.all) {
var allElements = document.all;
} else {
var allElements = document.getElementsByTagName("*");
}
// Empty placeholder to put in the found elements with the class name
var oldHrefs = [];
for (var i = 0, ii = allElements.length; i < ii; i++) {
if (allElements[i].className == 'ButtonItem') {
oldHrefs[oldHrefs.length] = allElements[i];
}
}
}
else
{
var oldHrefs = document.getElementsByClassName('ButtonItem');
}
But I then need to loop through the code and remove the href and add an onclick which is when I revive my next error. Object doesn't support property or method 'item'. Any ideas what I can do to correct the code below?
for (var i = 0; i < oldHrefs.length; i++) {
var thisHref = oldHrefs.item(i).getAttribute('href');
if (thisHref != null) {
if (thisHref.includes('Act=1468')) {
oldHrefs.item(i).removeAttribute("href");
oldHrefs.item(i).setAttribute('onclick', 'window.location.href="' + thisHref + '";this.removeAttribute("onclick");');
}
}
}
Thanks

execCommand('copy') not working programatically, only when executed via DevTools console

Source:
const package = document.querySelector('td[data-bind="text: packageName"');
if (package.textContent.indexOf('Adaptive') !== -1) {
package.click();
const stacks_tab = document.querySelector('ul[class="tabsExpanded"]').children[5];
stacks_tab.click();
function get_sources() {
const sources = [];
const stacks = document.querySelectorAll('span[data-bind="text:duration"]');
for (let i = 0; i < stacks.length; i++) {
stacks[i].click();
let renditions = document.querySelectorAll('span[class="blockUnSelected"]');
renditions[(i+1) * 8 - 1].click();
sources.push(document.querySelectorAll('p[data-bind="text: $data.name"]')[0].textContent);
}
let copy = '';
for (let i = 0; i < sources.length; i++) {
const change_brackets = sources[i].replace(/\/tveorigin\/vod\/ae\//, '');
const no_pd1 = change_brackets.replace(/-pd1/g, '');
copy += no_pd1 + ',';
}
if (copy === '') {
setTimeout(get_sources, 500);
} else {
const hidden = document.createElement('input');
hidden.value = copy;
document.querySelector('body').appendChild(hidden);
hidden.select();
function copy_sources() {
console.log('running');
hidden.select();
if (!document.execCommand('copy')) {
setTimeout(copy_sources, 500);
} else {
console.log('Sources copied!');
}
}
copy_sources();
}
}
get_sources();
} else {
console.log('There is no Adaptive package in this content.');
}
Line 45 is what isn't working.
That code won't make a lot of sense, but here's the use case:
I'm trying to automate part of my job by injecting some JavaScript into the Chrome DevTools console on our CMS that we use for video content where I work. What the script does is click a few elements, then grabs some file locations and copies them to the clipboard as comma separated values. I had this working just fine before, but I decided to try and make the script better...and now the document.execCommand('copy') is just not working.
As you can see, I use some recursion to continuously select the hidden input value and then I try to copy it, and if it fails, I try again in 500 ms. I also log 'running' to ensure the function is actually running (it is). The execCommand() function keeps returning false every 500ms. BUT, if I type it into the console manually and run it, it returns true and works fine even as the recursive function continues to return false. So for some reason, it won't work in the context of my script, but works totally fine when run manually.
Like I said before, it WAS working programatically before, but I changed some stuff to make the script better and more automated, and it won't work anymore. Here's the code with execCommand() working fine:
const sources = [];
const stacks = document.querySelectorAll('span[data-bind="text:duration"]');
for (let i = 0; i < stacks.length; i++) {
stacks[i].click();
let renditions = document.querySelectorAll('span[class="blockUnSelected"]');
renditions[(i+1) * 8 - 1].click();
sources.push(document.querySelectorAll('p[data-bind="text: $data.name"]')[0].textContent);
}
let copy = '';
for (let i = 0; i < sources.length; i++) {
const change_brackets = sources[i].replace(/\/tveorigin\/vod\/ae\//, '');
const no_pd1 = change_brackets.replace(/-pd1/g, '');
copy += no_pd1 + ',';
}
const hidden = document.createElement('input');
hidden.value = copy;
document.querySelector('body').appendChild(hidden);
hidden.select();
document.execCommand('copy');
I just tested that code and it still works, and copies the text to the clipboard as intended. The only notable different I see is that in the older code, I run execCommand() in the global context, whereas in the new script, it's in a function context. Could this have something to do with it?
So the solution to this was odd. execCommand() can only be triggered by a user event handler, so what I had to do was attach a click listener to the window, then invoke a click event on the hidden node. Because that triggered a click handler, that made it work!

Nodelist getAttribute IE11 JavaScript Error

I am currently having an issue with the getAttribute() method.
This currently works in IE8, but in IE11 I recieve the error Object doesn't support property or method 'getAttribute'.
The same issue happens when I use hasAttribute() at the same point.
The error is thrown when you reach if(discounts[j].getAttribute("id") == discountId), and if I try to console.log the id, I get Undefined.
I did manage to get it to work in IE11 by running in compatibility mode, but that is not an option.
This is the method I am currently using below.
if(discountsXml != null && discountsXml.documentElement != null) {
var invItems = discountsXml.documentElement.getElementsByTagName("invItem");
var invItemsCounter = invItems.length;
var i = 0;
for(i=0; i<invItemsCounter; i++) {
if(invItems[i].getAttribute("id") == invItemId) {
var discounts = invItems[i].childNodes;
var discountsCounter = discounts.length;
var j = 0;
for(j=0; j<discountsCounter; j++) {
if(discounts[j].getAttribute("id") == discountId) {
discount = true;
}
}
}
}
}
You didn't actually ask a question above so I'm not sure on the best answer,
But would it be possible for you to use the id property instead of the id attribute as is generally recommended?
invItems[i].id vs invItems[i].getAttribute("id")
http://www.w3schools.com/jsref/prop_html_id.asp

Why is my script firing on Mozilla when it should only fire on IE?

My script below is firing on Mozilla when it should only fire on IE? It works correctly with Chrome. The cookie notifies the user once per browser session that they should update IE (if it is version 10 or less). However, users on Mozilla are getting the alert aswell.
Code:
var key_value = "Cookie=true";
var foundCookie = 0;
// Get all the cookies from this site and store in an array
var cookieArray = document.cookie.split(';');
// Walk through the array
for(var i=0;i < cookieArray.length;i++)
{
var checkCookie = cookieArray[i];
// Remove any leading spaces
while (checkCookie.charAt(0)==' ')
{
checkCookie = checkCookie.substring(1,checkCookie.length);
}
// Look for cookie set by key_value
if (checkCookie.indexOf(key_value) == 0)
{
// alert("Found Cookie");
// The cookie was found so set the variable
foundCookie = 1;
}
}
// Check if a cookie has been found
if ( foundCookie == 0)
{
// The key_value cookie was not found so set it now
document.cookie = key_value;
if (GetIEVersion() < 11) {
alert("You are using an outdated version of Internet Explorer.");
}
}
function GetIEVersion() {
var sAgent = window.navigator.userAgent;
var Idx = sAgent.indexOf("MSIE");
// If IE, return version number.
if (Idx > 0) {
return parseInt(sAgent.substring(Idx + 5, sAgent.indexOf(".", Idx)));
}
// If IE 11 then look for Updated user agent string.
else if (!!navigator.userAgent.match(/Trident\/7\./)) {
return 11;
}
else {
return 0; //It is not IE
}
}
Fixed it. The last 'return 0;' was returning 0, obviously, which made the statement think it was IE Version 0: therefore triggering the alert. Changing this to a number higher than 11 fixed it.

Chrome and Firefox incompatibility

I have two frames, the expression running in first frame and calling highlightElements function in another frame. This expression works fine in Firefox:
parent.frames[0].highlightElements(lineNumbers, stringObj);
The highlightElements function (just for sure):
function highlightElements(lineNumbers, stringObj) {
// run through the cycle and highlight them
//for (var ln in lineNumbers) {
var length = lineNumbers.length;
for (var ln=0; ln<length; ln++) {
var elements = $('.no');
//for (var i in elements) {
var el_length = elements.length;
for (var i=0; i<el_length; i++) {
if (parseInt(elements[i].innerHTML) == lineNumbers[ln]) {
var badThing = "yes";
for (var nextElement = elements[i].next();
nextElement.className != '.no'; nextElement = elements[i].next()) {
if (nextElement.innerHTML == stringObj) {
badThing = "no";
nextElement.effect('highlight', {}, 'slow');
scrollIntoView(nextElement);
}
}
if (badThing == "yes") alert("Didn't find the object");
}
}
}
}
But in Chrome it produces the error "Uncaught TypeError: Property 'highlightElement' of object[objectDOMWindow] is not a function".
How to change the expression to make it runnable in Chrome? Thanks
Make sure both frames are under same domain and protocol. Chome blocks javascript access from frames to another if the domains/protocols don't match. If you are working locally, and not under a local domain (i.e. the url is something like file:///C:/etc/etc.html) then it won't work either.

Categories

Resources