I am tryin to populate a list of all Div ids on a page with javascript. The below code gives me a count of all divs but not a list of div ids which i am looking for, Please help
var divs = document.getElementsByTagName("div");
for(var i=0, len=divs.length; i < len; i++){
document.write(divs[i]);
}
Try:
document.write(divs[i].id);
Related
I want to add styling to an element only if it contains a particular string. i.e. if(el contains str) {el:style}.
If I wanted just the links containing w3.org to be pink, how would I find <a href="http://www.w3.org/1999/xhtml">article < /a> inside the innerHTML and then style the word "article" on the page.
So far, I can turn ALL the links pink but I can't selectively target the ones containing "www.w3.org".
var links = [...document.body.getElementsByTagName("a")];
for (var i = 0; i < links.length; i++) {
links[i].style["color"] = "#FF00FF";
}
How would I apply this ONLY to the elements containing the string "w3.org"?
I thought this would be so simple at first! Any and all help is appreciated.
While you can't filter by non-exact href values when finding the initial list, and you can't filter by contained text then either, you can filter the list after the fact using plain javascript:
var links = [...document.body.getElementsByTagName("a")];
for (var i = 0; i < links.length; i++) {
if (links[i]['href'].indexOf('www.w3.org') == -1) { continue };
links[i].style["color"] = "#FF00FF";
}
Assuming you want to filter by the href, that is. If you mean the literal text, you would use links[i]['text'] instead.
In looking at this image you can see in an ideal world each box would have the same height of content in each box. However in the real world we can't control how many characters the client uses for a heading. Wondering thoughts on how to deal with a situation like this? Is it ok to just let it be as is?
This will create an array of heights of an element by class, then find the tallest, and then make them all that height.
<script>
var headerHeights = [];
var mclength = document.getElementsByClassName("myClass").length;
for (i = 0; i < mclength; i++) {
headerHeights[i] = document.getElementsByClassName("myClass")[i].getBoundingClientRect().height;
}
var headerMaxHeight = Math.max(...headerHeights);
for (i = 0; i < mclength; i++) {
document.getElementsByClassName("myClass")[i].style.height = headerMaxHeight+"px";
}
</script>
You will likely want to make this a function which replaces "myClass" with a function parameter so that you can call it for each class you add. You will also want to add a listener for when a person resizes their window to rerun the function.
I have a column on my kendoUi grid that has anchor tags for the entire column including the footer, here is my code for that:
columns.Bound(p => p.NonFlagged).Title("Non Flagged").Width(100)
.ClientTemplate(
"<a onclick='ShowPatientGapDetailsModal(" + "#=MeasureId#" + ")' href='\\#'>#=NonFlagged#</a>")
.ClientFooterTemplate("<a onclick='ShowPatientGapDetailsModal()' href='\\#'>#=sum#</a>");
It works fine for all the rows except the footer, which shows the full html anchor tag as you can see here:
Has anyone seen this before or have any suggestions?
it is because grid exports only data. Not templates. For usage templates into excel export you have to use ExcelExport event.
Here is small code snippet which I hope helps you.
Anyway I didn't work with footers and excel yet but I am sure there will be same rules like with normal data. Probably it will not work as you need but can kick you right direction.
I have met this behaviour when I had checkboxes in cells or datefields etc.
excelExport: function (e) {
var sheet = e.workbook.sheets[0];
var data = [];
for (var i = 1; i < sheet.rows.length; i++) {
var dataItem = {
FieldWithMyTemplate: e.data[i].FieldWithMyTemplate, // In e.data are data from row in grid
};
var row = sheet.rows[i];
for (var j = 0; j < row.cells.length; j++) {
var template = kendo.template(this.columns[j].template);
row.cells[j].value = template(dataItem);
}
}
};
Edit: Forgot to mention that in e.Data at first index ([0]) are data from headers. So on the last one will be your footer data.
Now i am implementing the scroll view in cocos2dx (2.2.6 c++), in that
all the scroll view item is coming only one position. I want all the ietm with some specific padding so that i give the padding but then also its not working properly. My scrollview code is here below. In that i create array of CCMenuItemImage and add that in CCMenu. I also add abc->alignItemsHorizontallyWithPadding(100) then also padding is not consider so what are the changes in my code for this issue.
scrollview=cocos2d::extension::CCScrollView::create(CCSize(ccp(winsize.width/768*760, winsize.height/1024*550)),NULL);
// scrollview->setPosition(ccp(winsize.width/768*160,winsize.height/1024*1200));
scrollview->setPosition(ccp(winsize.width/768*0,winsize.height/1024*0));
scrollview->retain();
scrollview->setContentSize(CCSizeMake(slider->getContentSize().width+500,slider->getContentSize().height+250));
scrollview->setViewSize(ccp(winsize.width/768*724,winsize.height/1024*500));
scrollview->setContentOffset(ccp(winsize.width/768*350, winsize.height/1024*120));
scrollview->setDirection(cocos2d::extension::kCCScrollViewDirectionHorizontal);
scrollview->setContentOffsetInDuration(ccp(500,0), 0.5);
for (int i=1; i<10; i++) {
CCString *str = CCString::createWithFormat("haircopy%d.png", i);
flower_menuietm[i]=CCMenuItemImage::create(str->getCString(),NULL,this,menu_selector(HelloWorldScene::selectSprite));
flower_menuietm[i]->setTag(i);
//flower_menuietm[i]->setScale(0.9);
abc=CCMenu::create(flower_menuietm[i],NULL);
abc->alignItemsHorizontallyWithPadding(100);
scrollview->addChild(abc);
}
this->addChild(scrollview);
You problem is that you create a separate CCMenu for each CCMenuItem
To fix this, just create one CCMenu and add all CCMenuItems to it;
...
abc = CCMenu::create();
scrollview->addChild(abc);
for (int i=1; i<10; i++) {
CCString *str = CCString::createWithFormat("haircopy%d.png", i);
flower_menuietm[i]=CCMenuItemImage::create(str->getCString(),NULL,this,menu_selector(HelloWorldScene::selectSprite));
flower_menuietm[i]->setTag(i);
//flower_menuietm[i]->setScale(0.9);
abc->addChild(flower_menuietm[i]);
}
abc->alignItemsHorizontallyWithPadding(100);
this->addChild(scrollview);
I want to have only one event listener that work with 3 different buttons: btn1, btn2, btn3.
I know that "btn+i" doesn't exist and doesn't work. Theres any way to do this? Sorry, I'm a beginner...
for(var i:uint=1;i<4;i++){
btn+i.addEventListener(MouseEvent.CLICK, btnClicked);
}
You should be able to do this["btn" +i].
But you'd probably be better off stuffing them all into an array and accessing them that way. Then your code isn't so dependent on everything being named a certain way.
Something like this:
var buttons:Array = [btn1, btn2, btn3];
for(var i:int = 0; i < buttons.length; i++){
buttons[i].addEventListener(MouseEvent.CLICK, btnClicked);
}